[SOLUCIONADO] Asignar valor de imagen tomada por Webcam a formulario PHP

c3media · #1 (**permalink**) 06/01/2014, 11:35

Hola,

Tengo un script tipo Webcam y necesito insertar a mi DB la foto tomada al capturar en la Webcam, me funciona utilizando HTML; pero mi formulario es dinamico por lo tanto la requiero bajo PHP.

Gracias!

pateketrueke · #2 (**permalink**) 06/01/2014, 11:38

Me imagino que quieres que adivinemos todo tu código para intentar ayudarte, ¿cierto?

Porque me imagino que lo de la webcam lo haces con HTML5 y Javascript, ¿cierto?

Al menos el formulario ya has de tener, ¿cierto?

c3media · #3 (**permalink**) 06/01/2014, 11:58

Ok,

Este codigo me permite enviar el archivo con su nombre a la DB.

Código PHP:

  <?php 
   include 'configuration.php'; 
   date_default_timezone_set('America/Bogota'); 
/* JPEGCam Test Script */ 
/* Receives JPEG webcam submission and saves to local file. */ 
/* Make sure your directory has permission to write files as your web server user! */ 
 
$filename = date('YmdHis') . '.jpg'; 
$query_ingresar = "INSERT INTO test VALUES('$filename')"; 
$result_ingresar = mysql_query($query_ingresar) or die(mysql_error()); 
$result = file_put_contents( $filename, file_get_contents('php://input') ); 
if (!$result) { 
    print "ERROR: Failed to write data to $filename, check permissions\n"; 
    exit(); 
} 
$url = 'http://' . $_SERVER['HTTP_HOST'] . dirname($_SERVER['REQUEST_URI']) . '/' . $filename; 
print "$url\n"; 
 
?>

Este HTML permite iniciar la WebCam.

Código HTML:

<body>
	<table><tr><td valign=top>
	<h1>JPEGCam Test Page 2</h1>
	<h3>Demonstrates a two-step implementation: capture, then upload.</h3>
	
	<!-- First, include the JPEGCam JavaScript Library -->
	<script type="text/javascript" src="webcam.js"></script>
	
	<!-- Configure a few settings -->
	<script language="JavaScript">
		webcam.set_api_url( 'test.php' );
		webcam.set_quality( 100 ); // JPEG quality (1 - 100)
		webcam.set_shutter_sound( true ); // play shutter click sound
	</script>
	
	<!-- Next, write the movie to the page at 320x240 -->
	<script language="JavaScript">
		document.write( webcam.get_html(320, 240) );
	</script>
	
	<!-- Some buttons for controlling things -->
	<br/><form>
		<input type=button value="Configure..." onClick="webcam.configure()">
		&nbsp;&nbsp;
		<input type=button value="Capture" onClick="webcam.freeze()">
		&nbsp;&nbsp;
		<input type=button value="Upload" onClick="do_upload()">
		&nbsp;&nbsp;
		<input type=button value="Reset" onClick="webcam.reset()">
	</form>
	
	<!-- Code to handle the server response (see test.php) -->
	<script language="JavaScript">
		webcam.set_hook( 'onComplete', 'my_completion_handler' );
		
		function do_upload() {
			// upload to server
			document.getElementById('upload_results').innerHTML = '<h1>Uploading...</h1>';
			webcam.upload();
		}
		
		function my_completion_handler(msg) {
			// extract URL out of PHP output
			if (msg.match(/(http\:\/\/\S+)/)) {
				var image_url = RegExp.$1;
				// show JPEG image in page
				document.getElementById('upload_results').innerHTML = 
					'<h1>Upload Successful!</h1>' + 
					'<h3>JPEG URL: ' + image_url + '</h3>' + 
					'<img src="' + image_url + '">';
				
				// reset camera for another shot
				webcam.reset();
			}
			else alert("PHP Error: " + msg);
		}
	</script>
	
	</td><td  width=50>&nbsp;</td>
 <td valign=top>
		<div  id="upload_results" style="background-color:#eee;"></div>
	</td>
	</tr></table>
</body

Ahora, este ultimo lo estoy probando en .php y no me guarda el objeto imagen.

Gracias, espero haber sido claro!

c3media · #4 (**permalink**) 18/01/2014, 09:48

Tema solucionado