How to take a picture using a webcam and have the picture uploaded directed or automatically into my php form [duplicate]

StackOverflow https://stackoverflow.com/questions/23685086

  •  23-07-2023
  •  | 
  •  

Question

I have been trying to build a data capture and biometric (finger print) form where a webcam is attached to the PC and such that when you click on the add/upload image button, the system will automatically launch the webcam and when you take a shot using the webcam, the image is automatically uploaded to the form.

A simple example is the process of applying for a new driving license. The officer will ask you to fill a form and the form data are transferred into the software and then you are asked to stand before a camera for a photo shot. In some cases finger prints of the applicant is also taken and uploaded to the system.

I am developing the web application using Dreamweaver, PHP and MySQL. For now I am only familiar with PHP. No knowledge of Java programming.

Your tips are welcomed and thank you in advance

Mike

Était-ce utile?

La solution

Kindly try this code for the image capture from agurchand on TheOnlyTutorials.com:

index.html

<!DOCTYPE html>
<html>
<head>
    <title>WebCam jQuery and PHP script</title>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.2/jquery.min.js"></script>
 
    <style>
        #camera_wrapper, #show_saved_img{float:left; width: 650px;}
    </style>
 
    <script type="text/javascript" src="scripts/webcam.js"></script>
    <script>
        $(function(){
            //give the php file path
            webcam.set_api_url( 'saveimage.php' );
            webcam.set_swf_url( 'scripts/webcam.swf' );
            webcam.set_quality( 100 ); // Image quality (1 - 100)
            webcam.set_shutter_sound( true ); // play shutter click sound
 
            var camera = $('#camera');
            camera.html(webcam.get_html(600, 460));
 
            $('#capture_btn').click(function(){
                //take snap
                webcam.snap();
            });
 
            //after taking snap call show image
            webcam.set_hook( 'onComplete', function(img){
                $('#show_saved_img').html('<img src="' + img + '">');
                //reset camera for next shot
                webcam.reset();
            });
 
        });
    </script>
</head>
<body>
    <h1>Capture photo with Web Camera - PHP Script</h1>
 
    <!-- camera screen -->
    <div id="camera_wrapper">
    <div id="camera"></div>
    <br />
    <button id="capture_btn">Capture</button>
    </div>
    <!-- show captured image -->
    <div id="show_saved_img" ></div>
</body>
</html>


Saveimage.php

<?php
 
//set random name for the image, used time() for uniqueness
 
$filename =  time() . '.jpg';
$filepath = 'saved_images/';
 
//read the raw POST data and save the file with file_put_contents()
$result = file_put_contents( $filepath.$filename, file_get_contents('php://input') );
if (!$result) {
    print "ERROR: Failed to write data to $filename, check permissionsn";
    exit();
}
 



echo $filepath.$filename;
?>

See the source for the PHP portion.

Also download the webcam.js library from https://code.google.com/p/jpegcam/

Licencié sous: CC-BY-SA avec attribution
Non affilié à StackOverflow
scroll top