今天小编就为大家带来一篇关于html5调用摄像头拍照源码的文章。小编觉得挺实用的,为此分享给大家做个参考。一起跟随小编过来看看吧。
代码:
<!DOCTYPE html>
<HTML>
<HEAD>
<TITLE> HTML5调用摄像头实现拍照</ TITLE>
<meta charset =“utf-8”>
<meta name =“viewport”content =“width = device-width,initial-scale = 1”>
</ HEAD>
<BODY>
<video id =“video”autoplay =“”style ='width:640px; height:480px'> </ video>
<button id =“paizhao”>拍照</ button>
<canvas id =“canvas”width =“640”height =“480”> </ canvas>
<script type =“text / javascript”>
var video = document.getElementById(“video”);
var context = canvas.getContext(“2d”);
var errocb = function(){
console.log(“sth srong”);
}
如果(navigator.getUserMedia){
navigator.getUserMedia({ “视频”:真},函数(流){
video.src =流;
video.play();
},errocb);
} else if(navigator.webkitGetUserMedia){
navigator.webkitGetUserMedia({ “视频”:真},函数(流){
video.src = window.webkitURL.createObjectURL(流);
video.play();
},errocb);
}
的document.getElementById( “paizhao”)的addEventListener( “点击”,函数(){
context.drawImage(视频,0,0,640,480);
});
</ SCRIPT>
</ BODY>
</ HTML>
以上就是html5调用摄像头拍照的源码,代码详细清楚,如果在日常工作遇到这个问题,希望你能通过这篇文章解决问题。如果想了解更多相关内容,欢迎关注亿速云行业资讯频道!
亿速云「云服务器」,即开即用、新一代英特尔至强铂金CPU、三副本存储NVMe SSD云盘,价格低至29元/月。点击查看>>
免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:is@yisu.com进行举报,并提供相关证据,一经查实,将立刻删除涉嫌侵权内容。