<!--video用于显示媒体设备的视频流，自动播放--> <video id="video" autoplay style="width: 480px;height: 320px"></video><!--拍照按钮--><div><button id="capture">拍照</button></div><!--描绘video截图--><canvas id="canvas" width="480" height="320"></canvas><script> var video = document.getElementById('video');var canvas = document.getElementById('canvas');var capture = document.getElementById('capture');var context = canvas.getContext('2d');//成功回调函数function success(stream){//兼容webkit核心浏览器var CompatibleURL = window.URL || window.webkitURL;//将视频流转化为video的源video.srcObject = stream;video.play();//播放视频}function error(error) {console.log('访问用户媒体失败：',error.name,error.message);}var constraints = { audio: true, video: true }navigator.mediaDevices.getUserMedia(constraints).then(success).catch(error);capture.addEventListener('click',function() {// 将video画面描绘在canvas画布上context.drawImage(video,0,0,480,320);})</script>