navigator調用攝像頭pc

navigator 調取攝像頭

async　　異步請求方式
await 　 等待Promise請求完成

//開啟攝像頭
async function startCamera() {
 let video = document.getElementById("video");
 let stream = await navigator.mediaDevices.getUserMedia({
 video: {
 width:100,
 height: 200
 },
 audio: false
 })
 video.srcObject = stream;
 video.play();
}

//關閉攝像頭

function closeCamera(){
 let stream = document.getElementById('video').srcObject;
 let tracks = stream.getTracks();
 tracks.forEach(function(track) {
 track.stop();
 });
 document.getElementById('video').srcObject = null;
}

//拍照
function takephoto(){
  let video = document.getElementById('video');//視頻標簽
  let canvas = document.getElementById('outputCanvas');//
  let ctx = canvas.getContext('2d');//設置格式
  ctx.drawImage(video, 0, 0,640,480);       
  let img = document.getElementById('outputCanvas').toDataURL();//圖片 base64格式可直接做img
}