如何通过Mobile Camers拍照并使用Mobile Browser通过预览将其保存在数据库中

时间:2019-03-20 06:04:16

标签: javascript php html mysql html5

我想先拍照,然后必须预览,最后必须将其保存在数据库中。我使用HTML,JavaScript,PHP创建了代码,并且在Computers Browser中可以正常工作。

但是我需要用于移动浏览器的代码。我尝试了很多次,但是无法获得正确的代码。所以请帮我做。谢谢。

这里是我的代码

HTML

    <div align="center">
<p><input type="file"  accept="image/*" capture="camera" name="image" id="file"  onchange="loadFile(event)" style="display: none;"></p>
<br />
<p><label for="file" style="cursor: pointer;">Take SnapShot</label></p>  
<br />      
<input type=button value="Save Snapshot" onClick="saveSnap()">
<p><img id="output" width="200" style="display: none;"/></p>
<div id="results"></div>
</div>

JAVASCRIPT

var loadFile = function(event) 
{
var image = document.getElementById('output');
image.src = URL.createObjectURL(event.target.files[0]);
document.getElementById('results').innerHTML = '<img id="imageprev" style="height: 200px; width: 200px;" src="'+image.src+'"/>';
};
//Code to handle taking the snapshot and displaying it locally
function saveSnap()
{           
var base64image =  document.getElementById("imageprev").src;
alert(base64image);
Webcam.upload( base64image, 'upload.php', function(code, text) {
console.log('Save successfully');                
});
}

PHP-上传文件

$filename = 'Snap_'.date('YmdHis') . '.jpeg';
    $url = '';
    if( move_uploaded_file($_FILES['webcam']['tmp_name'],'upload/'.$filename) ){
       $url = 'http://' . $_SERVER['HTTP_HOST'] . dirname($_SERVER['REQUEST_URI']) . '/upload/' . $filename;
    }
    echo $url;

对不起。我知道那里有很多错误或混乱。问题是我可以将图像保存在“上传”文件夹中。请帮助我解决此问题。

0 个答案:

没有答案