<video id="video" width="100%" height="100%" autoplay></video>
<canvas id="canvas" width="965" height="680"></canvas>
<div style="padding: 10px;">
<button class="button button-block button-energized button-drive" id="snap">确认</button>
</div>
var video = document.getElementById('video');
if(navigator.mediaDevices && navigator.mediaDevices.getUserMedia) {
navigator.mediaDevices.getUserMedia({ video: true }).then(function(stream) {
video.src = window.URL.createObjectURL(stream);
video.play();
});
}
var canvas = document.getElementById('canvas');
var context = canvas.getContext('2d');
document.getElementById("snap").addEventListener("click", function() {
context.drawImage(video, 0, 0, 965, 680);
});