2016-09-12 78 views
1

我有一個腳本,可以從網絡攝像頭捕獲圖像並將其存儲在使用php的目錄中。使用PHP從網絡攝像頭或瀏覽文件上傳圖像

這裏是我的html代碼

<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');//flash file (SWF) file path 
     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(300, 200)); //generate and put the flash embed code on page 

     $('#capture_btn').click(function(){ 
      //take snap 
      webcam.snap(); 
      $('#show_saved_img').html('<h3>Please Wait...</h3>'); 
     }); 


     //after taking snap call show image 
     webcam.set_hook('onComplete', function(img){ 
      $('#camera_wrapper').html('<img src="' + img + '">'); 
      //reset camera for the next shot 
      //$("#camera_wrapper").html('&nbsp;'); 
      //webcam.hide(); 
     }); 

    }); 
</script> 
<!-- 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> 

PHP代碼,用於存儲圖像

$filename = time() . '.jpg'; 
$filepath = 'saved_images/'; 
$result = file_put_contents($filepath.$filename,  file_get_contents('php://input')); 
if (!$result) { 
print "ERROR: Failed to write data to $filename, check permissions\n"; 
exit(); 
} 
echo $filepath.$filename; 
?> 

這個腳本工作正常。但是我想補充連同瀏覽文件選項這個。即用戶可以使用其攝像頭捕獲圖像,或者可以從設備上瀏覽文件。

我是javascript的新手。是否可以添加兩個選項

回答

1

首先,您需要確保PHP已配置爲允許文件上載。 在你的「php.ini」文件中,搜索file_uploads指令,並將其設置爲On。

file_uploads = On 

在HTML表單中添加代碼,允許用戶選擇從W3Schools的瀏覽文件

<!DOCTYPE html> 
<html> 
<body> 

<form action="file_uploader.php" method="post" enctype="multipart/form-data"> 
    Browse file to upload: 
    <input type="file" name="fileToUpload" id="fileToUpload"> 
    <input type="submit" value="Upload File" name="submit"> 
</form> 

</body> 
</html> 

在file_uploader.php

<?php 
$target_dir = "uploads/"; 
$target_file = $target_dir . basename($_FILES["fileToUpload"]["name"]); 
$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; 
    } 
} 
?> 

使用此tutorial作爲參考

+0

我需要兩個選項**網絡攝像頭**和**選擇文件** –

+0

因此,編輯代碼並添加您的文檔r代碼已經適用於攝像頭。 – mayorsanmayor