PHP image upload and JavaScript plugin usage

This article mainly introduces the PHP image upload and the use of JavaScript plug-ins, interested in the reference of friends, hope to help you.

The example of this paper describes the Php+javascript realization of the online photo function, as follows:

We may encounter this situation in some Web applications where users need to take photos of themselves and upload them to the membership system. such as driving school to collect fingerprint photo process, test site collection photos. What we're going to talk about today is how to use JavaScript and PHP to implement a simple online photo and upload feature.

The prerequisite for this is that you need to have a webcam installed on your computer device and that your browser needs to support Flash

<! DOCTYPE html>
Add a container id#cam to the body to call the camera assembly and a container id#results to display the upload information.

Javascript

Next call the camera module, we first load the webcam.js, used for photo and upload JS library.

The code is as follows:

<script type= "Text/javascript" src= "Webcam.js" ></script>


Then in the container Id#cam, add the following code:

<script language= "JavaScript" >webcam.set_api_url (' action.php '); webcam.set_quality (90); Image quality (1-100) Webcam.set_shutter_sound (true); Play Sound document.write (webcam.get_html (+, 160,120));</script>
We call the webcam, where webcam.set_api_url is used to set the PHP path for image upload interaction, set_quality can set the image quality, Set_shutter_sound set the sound, get_html output camera assembly, parameter is width , height, post-upload width, post-upload height.

When you click the button to take a photo, you need to execute the following code:

<script language= "JavaScript" >webcam.set_hook (' oncomplete ', ' my_completion_handler '); function take_snapshot () {document.getElementById (' results '). InnerHTML = ' 
When performing a photo action, the code interacts with the background PHP, and if the uploaded image is completed, the corresponding information is returned.

Php

What action.php is doing is uploading the image of the local photo to the server and returning the picture path to the front end. Note the path where the picture is stored is given write permission.

$filename = Date (' Ymdhis '). '. jpg '; $result = file_put_contents (' pics/'. $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 '). '/pics/'. $filename;p rint "$url \ n";
Summary : The above is the entire content of this article, I hope to be able to help you learn.

Related recommendations:

Types of PHP comparison operators

About encapsulation and inheritance of PHP classes

PHP implementation of the Guess Word games