<!DOCTYPE html>
<html>
<head>
<title>Prueba Web Cam</title>
</head>
<body>
<video width="400" height="250" id="player" autoplay></video>
<button id="capture">Capturar</button>
<canvas id="snapshot" width=320 height=240></canvas>
<script>
var player = document.getElementById('player');
var snapshotCanvas = document.getElementById('snapshot');
var captureButton = document.getElementById('capture');
var handleSuccess = function(stream) {
// Attach the video stream to the video element and autoplay.
player.srcObject = stream;
};
captureButton.addEventListener('click', function() {
var context = snapshot.getContext('2d');
// Draw the video frame to the canvas.
context.drawImage(player, 0, 0, snapshotCanvas.width,
snapshotCanvas.height);
});
navigator.mediaDevices.getUserMedia({video: true})
.then(handleSuccess);
</script>
</body>
</html>