程式碼圖
直接上程式碼:
<!DOCTYPE html>
var video = document。getElementById(“video”);
var canvas=document。getElementById(“canvas”);
var context=canvas。getContext(‘2d’);
//獲取攝像頭物件
navigator。getUserMedia=navigator。getUserMedia||navigator。webkitGetUserMedia||navigator。mozGetUserMedia||navigator。msGetUserMedia;
navigator。getUserMedia({video:true,audio: true},gotStream,noStream);//開啟攝像頭
//成功開啟攝像頭
function gotStream(stream){
video。src =URL。createObjectURL(stream);
video。onerror= function(){
stream。stop();
}
stream。onended = noStream;
video。onloadedmetadata =function()
{
alert(“成功開啟攝像頭”)
};
}
//開啟攝像頭失敗
function noStream(error){
alert(error)
}
document。getElementById(“snap”)。addEventListener(“click”,function(){
context。drawImage(video,0,0,1024,800)
});