Webcam in PHP – How to Use Webcam in PHP




Webcam in PHP, How to show webcam in PHP, take image from Webcam in PHP read this article you will get all the details regarding these questions. Hello friends i am Vivek Moyal today i am uploading the tutorial for showing the Webcam in PHP page and save that image in database. It will be a nice tutorial for you please comment for the tutorial so we will get motivated. First of all what we need is your PHP IDE, a Webcam, Mysql and a cup of coffee.

PHP IDE is for coding the program, Webcam to take the image, MySql for database and Coffee is for your refreshment…. lol.

In this article we will discuss How to capture the webcam image from our PHP Jquery and save it to the database. It will use the Flash for the webcam screen

In this article we will make 3 Files

  1. Index file for showing the webcam.
  2. Script to upload.
  3. Connection Script for database.

First of all download some files from bottom of the post. Lets start…………..

1. Index File for Webcam . Download link files from here

In this file we will show our Webcam screen on our PHP page. For this download the package from above and link the jquery and swf.

index.php

In the above code we show the screen and get the image from webcam. But still we have to save it somewhere so lets go to save this image in our folder.

2. Script for Saving the webcam image

Now after showing the Webcam Screen in PHP page we took the snap from clicking the button. Now we will save it to the folder in our project.

For this we will make a new separate file ….. named …. test.php. But we have to save the snap and call the function for taking the snap and save it and return the success. So first we will make our script to save the image in folder but keep in mind that it will not work because it is just to save it but still we dont have the snap with us.

test.php

Let me explain the above code In this code $name will take the current time and data. In $newname we will put our image in images folder along with the image so we provide the full path with the image.

$file will save the image. If there is any error than our if condition will show the error otherwise our script will return the success message.

Now time to take the snap.

add this code in our index.php

Now we have the success message and we will show it in div.

So now we have the code for taking the snap and saving it to our images folder. But still it is not in database now we will update the code for saving the image and saving the name in database.


Create database.

Create database with any name here i am using the “webcam” table name is ‘entry’ with 3 fields.

  1. “id” with auto number
  2. “name” column here i am using it for denoting the person
  3. “image” name.

connection.php

In the above code we create a connection string with the database. Now lets back to our save image script

test.php

we will include the connection file for establishing the connection.

include ‘connection.php’;

now we will write the code for saving the image in our database.

So we have our insert code with us. Now our test.php will look like this.

Now you were thinking that why i am using the session here and why i am taking the id of last insert. It is because in out table we are using the 3 column 1 is id 2nd is for saving the person name 3 is for image name.

from the above code we save the webcam image from php and jquery code in our database but now we want to save the person name on the same image. So we are taking the last id from database with the code and sending the value to the Session

Now we have the id on which our image is saved. In next step we will save the person name in the database on the same id.

Come to the index page here will put some php code and we already have the textfield and button to save the details of the image

index.php

Add this above PHP code in our index file so we will save the details of the person with his webcam image in the database.

So in brief………… We make a index file in which we show the Webcam Screen to save the image in our project. By clicking the take snap button it will take snap and by using the test.php we save the image in our folder. Now when we save it our database we just updated the save code and made a connection file. Through getting the last Id and saving it to the session we have the id of the image. In index.php we make the code for saving the extra details of the image by filling the form and submit the form.

In this tutorial we use the JpegCam Library. In this we use following files

PHP Webcam (96.4 KiB, 13100 downloads)
  1. JPEGCam Library
    1. Webcam.js
    2. shutter.mp3
    3. webcam.swf
  2. Test.php
  3. Index.php
  4. Connection.php

Thanks for reading the tutorial how do you find please comment.

PHP Webcam
PHP Webcam
camtest.rar
96.4 KiB
13100 Downloads
Details...

285 Comments

  1. fazzi

    please tell me why the capture sound is not comming after clicking on the take snapshot and my images are inserting and also capturing but they can’t be open from images folder its writtern that image is curropted…

    Reply
    1. fazzi

      please admin fix the problem…!!!

      Reply
  2. Nelson

    Hello admin nice tutorial!! can you help on on this error??

    Im getting Undefined index: myvalue in C:\xampp\htdo

    Any idea

    Reply
    1. Vivek Moyal (Post author)

      myvalue is a session only. So check that it is creating the session

      Reply
  3. root

    Thanks for posting this. Worked perfectly.

    Reply
  4. Rohan Pareek

    Nice tutorial thank you.

    Reply
  5. Dnyaneshwar Chavan

    Hello sir,

    i have downloaded your code but it showing error on console like this: Syntax Error: malformed hexadecimal character escape sequence.

    when i click on take snapshot these error are come but captured image is stored in images folder n image path is not stored in database….

    Plzzzz help me

    Reply
    1. Vivek Moyal (Post author)

      At which line you are getting this error

      Reply
  6. Dnyaneshwar Chavan

    Hello sir,

    I have used your webcam code but when clicking on take snapshot image saved in image folder but but image is not store in database.

    Plzz help me

    Reply
  7. imran Aslam

    Dear friend , i am imran. not work take_snapshot function if click on taksnapshot button.
    2) i required video conferencing tutorial (video chat).other hand tale me any website which provide video Api .
    plz reply.(thanks).

    Reply
    1. Vivek Moyal (Post author)

      What error you are getting when you click on take snapshot.

      Reply
      1. imran Aslam

        nothing error and nothing perform on click take_snapshot.
        not upload image in images folder

        Reply
  8. ali

    I use this script on http://www.tadreesonline.com/camtest but its do nothing no error message appear just Uploaded re….. but no entry in the database and no any image in the images folder please help me in this regards

    Reply
    1. Vivek Moyal (Post author)

      Can you tell me is there any error log at your hosting space. If yes than please provide me. And try to give me the log only for your camtest page

      Reply
  9. moses

    I have tried using this app but its not taking the snapshot neither is it saving in the database

    Reply
  10. Freeman

    I dont know how to use this. do you have manual to read on?

    Reply
    1. Vivek Moyal (Post author)

      Read the whole article you will know how to use it. :)

      Reply
  11. Yayra Koku

    Thanks for the package. Really nice one. Have followed the procedure and having the following problems.
    After taking the snapshot and click on the submit query, i get this error messages:

    Notice: Undefined index: myvalue in C:\xampp\htdocs\myproject\index.php on line 13

    Notice: Undefined index: myvalue in C:\xampp\htdocs\myproject\index.php on line 25
    Updated re …..

    Also the images does not save in the images folder.
    Please is there a way the image can be saved in the database as blog?

    Thank you and hope to hear from you soon.

    Reply
    1. Vivek Moyal (Post author)

      first of all these are not the errors these are just the Notices. And it is working fine please check that you have given the images folder proper permission so that it will save the image in the folder.

      Reply
      1. Shibashis Ray

        how to give permission to the image folder??

        Reply
  12. Vam

    It worked! Can you please help me out? I want the last taken picture to be viewed in one of the screen. Thank you.

    Reply
    1. Vivek Moyal (Post author)

      As if you see that we are using database here to save the name of the image for further use. You can do one thing after the snapshot just save the image and than using the jquery/ajax just call the last image which you have clicked recently

      Reply
  13. Edd

    Take snapshot is not working

    Reply
    1. Vivek Moyal (Post author)

      Its working fine can you please put the error what you are getting so that it will be quite easy for us to understand

      Reply
      1. Shibashis Ray

        how to give permission to the image folder?????

        Reply
  14. Edd

    snapshot() not working

    Reply
  15. tamil vanan p

    THANK U SIR .BUT SNAPSOHRT NOT SAVE THE PHOTO

    Reply
    1. Vivek Moyal (Post author)

      Check your database that you are getting the value in database

      Reply

Leave a Comment

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code class="" title="" data-url=""> <del datetime=""> <em> <i> <q cite=""> <strike> <strong> <pre class="" title="" data-url=""> <span class="" title="" data-url="">