html5调用拍照上传,如何使用HTML5实现拍照上传应用

html5调用手机摄像头，实现拍照上传功能

article>

video { transform: scaleX(-1); }

p { text-align: center; }

Snapshot Kiosk

Loading...

navigator.getUserMedia({video:true}, gotStream, noStream);

var video = document.getElementById('monitor');

var canvas = document.getElementById('photo');

function gotStream(stream) {

video.src = URL.createObjectURL(stream);

video.onerror = function () {

stream.stop();

};

stream.onended = noStream;

video.onloadedmetadata = function () {

canvas.width = video.videoWidth;

canvas.height = video.videoHeight;

document.getElementById('splash').hidden = true;

document.getElementById('app').hidden = false;

};

}

function noStream() {

document.getElementById('errorMessage').textContent = 'No camera available.';

}

function snapshot() {

canvas.getContext('2d').drawImage(video, 0, 0);

}