Solved

HTML & PHP Camera Capture

Posted on 2014-11-26
7
498 Views
Last Modified: 2015-01-02
I have a page that im designing to be used on smartphones. I have added an input to a html form to capture a image from the camera. When clicked on the upload file button it asks take photo or upload from gallery which is spot on. If you select from gallery it works fine and the image is uploaded to the webserver, but if the camera is selected nothing comes up. Is there a different line of code required to determine where the image is coming from?
0
Comment
Question by:JakeD14
  • 3
  • 2
7 Comments
 
LVL 25

Expert Comment

by:Kyle Hamilton
ID: 40469500
<input type="file" accept="image/*" capture="camera" />

please provide your code so we can troubleshoot
0
 

Author Comment

by:JakeD14
ID: 40469676
Capture Page
<form name="myForm" method="POST" enctype="multipart/form-data" action="section1.php">
<label class="filebutton">Take/Get Photo<span><input type="file" capture="camera" accept="image/*" name="fileToUpload" id="fileToUpload"></span></label>
</form>

Open in new window


Processing Page
$file = $_FILES['fileToUpload']['name'];

	<<SQL CONNECT SCRIPT>>
	<<QUERY TO GET NEW IMAGE NAME>>
		
$target_dir = "uploads/";
$target_file = $target_dir . basename($_FILES["fileToUpload"]["name"]);
echo $target_file;
$uploadOk = 1;
$imageFileType = pathinfo($target_file,PATHINFO_EXTENSION);
// Check if image file is a actual image or fake image
//if(isset($_POST["submit"])) {
    $check = getimagesize($_FILES["fileToUpload"]["tmp_name"]);
    if($check !== false) {
        #echo "File is an image - " . $check["mime"] . ".";
        $uploadOk = 1;
    } else {
        #echo "File is not an image.";
        $uploadOk = 0;
    }
//}
// Check if file already exists
if (file_exists($target_file)) {
    #echo "Sorry, file already exists.";
    $uploadOk = 0;
}
// Check file size
if ($_FILES["fileToUpload"]["size"] > 500000) {
    #echo "Sorry, your file is too large.";
    $uploadOk = 0;
}
// Allow certain file formats
if($imageFileType != "jpg" && $imageFileType != "png" && $imageFileType != "jpeg"
&& $imageFileType != "gif" ) {
    #echo "Sorry, only JPG, JPEG, PNG & GIF files are allowed.";
    $uploadOk = 0;
}
// Check if $uploadOk is set to 0 by an error
if ($uploadOk == 0) {
    #echo "Sorry, your file was not uploaded.";
// if everything is ok, try to upload file
} else {
	$newTarget = "uploads/".$newMax.".".$imageFileType;
    if(move_uploaded_file($_FILES["fileToUpload"]["tmp_name"], $newTarget)) {
       # echo "The file ". basename( $_FILES["fileToUpload"]["name"]). " has been uploaded.";
		<<QUERY TO ADD FILE DETAILS TO DATABASE>>
    } else {
        #echo "Sorry, there was an error uploading your file.";
    }
}

Open in new window

0
 
LVL 25

Expert Comment

by:Kyle Hamilton
ID: 40469839
what device/browser are you using?

this will only work in

Android 3.0 browser - one of the first implementations
Chrome for Android (0.16)
Firefox Mobile 10.0
iOS6 Safari and Chrome (partial support)
0
 

Author Comment

by:JakeD14
ID: 40469897
Yeah i was using it on a new iPad Air
0
 
LVL 25

Accepted Solution

by:
Kyle Hamilton earned 500 total points
ID: 40470603
this is working for me. the only problem was that the maximum file size was set too small, so the captured photos were not uploading. So I think if you make that change you should be good to go.

Here is my working example:
http://candpgeneration.com/EE/camera-capture.php

view the uploaded file:
http://candpgeneration.com/EE/uploads/image.jpg
0

Featured Post

Networking for the Cloud Era

Join Microsoft and Riverbed for a discussion and demonstration of enhancements to SteelConnect:
-One-click orchestration and cloud connectivity in Azure environments
-Tight integration of SD-WAN and WAN optimization capabilities
-Scalability and resiliency equal to a data center

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Suggested Solutions

Title # Comments Views Activity
HTML5 frame 5 31
Wordpress plugins not working in html 3 39
Html CheckBox obtain Its Value 5 28
Need output in powershell ( Vertical format) 2 22
Not sure what the best email signature size is? Are you worried about email signature image size? Follow this best practice guide.
Is your Office 365 signature not working the way you want it to? Are signature updates taking up too much of your time? Let's run through the most common problems that an IT administrator can encounter when dealing with Office 365 email signatures.
In this tutorial viewers will learn how to embed videos in a webpage using HTML5. Ensure your DOCTYPE declaration is set to HTML5: "<!DOCTYPE html>": Use the <video> tag to insert a video. Define the src as the URL of your video; this is similar to …
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…

829 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question