[HTML] 웹캠 사용하기
2020. 6. 23. 16:49ㆍHTML
<video id="video" width="320" height="240" autoplay></video>
<canvas id="canvas" width="960" height="720"></canvas>
<button type="button" id="webcamBtn">캡쳐하기</button>
<script>
if(navigator.mediaDevices && navigator.mediaDevices.getUserMedia) {
navigator.mediaDevices.getUserMedia({ video: true }).then(function(stream) {
var video = document.getElementById('video');
video.srcObject = stream;
video.play();
});
}
var canvas = document.getElementById('canvas');
var context = canvas.getContext('2d');
var video = document.getElementById('video');
document.getElementById("webcamBtn").addEventListener("click",function() {
context.drawImage(video,0,0,960,720);
});
</script>