Browsersync相机访问video.play不是一个功能

时间:2016-04-12 04:27:51

标签: javascript html5 browser-sync webcam-capture

大家好我今天开始使用browsersync和项目中https://browsersync.io/#install的简单配置来使用网络摄像头捕获图片。它工作得很好,但突然它停止工作,现在它没有显示来自相机的图像和铬现在出现错误 video.play不是一个功能即使有一大口文件启动本地服务器,所以不知道发生了什么。有没有人之前遇到这样的问题?

这是我的js文件:

(function(){
var video = document.getElementById('video'),
    canvas = document.getElementById('canvas'),
    context = canvas.getContext('2d'),
    photo = document.getElementById('photo'),
    vendorUrl = window.URL || window.webkitURL;

navigator.getMedia = navigator.getUserMedia||
                     navigator.webkitGetUserMedia ||
                     navigator.mozGetUserMedia ||
                     navigator.msGetUserMedia;

navigator.getMedia({
    video: true,
    audio: false
}, function(stream) {
    video.src = vendorUrl.createObjectURL(stream);
    video.play();
}, function(error){
    //An error occured
    //error.code
});

document.getElementById('snap').addEventListener('click', function(){
    context.drawImage(video, 0, 0, 400, 300);
    photo.setAttribute('src', canvas.toDataURL('image/png'));
});

})();

1 个答案:

答案 0 :(得分:0)

我在完全相同的源代码时遇到了同样的问题。我将我的相机图像解决方案迁移到yii2,我的问题是#video是一个div元素而不是视频元素,如果你把它改成视频标签,它将完美地工作。

:)