getUserMedia无法在Chrome v50.0.2661.86上运行

时间:2016-04-26 22:42:43

标签: javascript google-chrome html5-video webcam getusermedia

我正在尝试使用getUserMedia方法访问我的网络摄像头并使用clmtrackr(https://github.com/auduno/clmtrackr)跟踪我的脸部。 几周前它正在运行但是由于Chrome更新到v50我遇到问题,它使用替换视频而不是调用我的网络摄像头。

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

// check for camerasupport
if (navigator.getUserMedia) {

    var videoSelector = {video : true};
    if (window.navigator.appVersion.match(/Chrome\/(.*?) /)) {
        var chromeVersion = parseInt(window.navigator.appVersion.match(/Chrome\/(\d+)\./)[1], 10);
        if (chromeVersion < 20) {
            videoSelector = "video";
        }
    };

    navigator.getUserMedia(videoSelector, function( stream ) {
        if (video.mozCaptureStream) {
            video.mozSrcObject = stream;
        } else {
            video.src = (window.URL && window.URL.createObjectURL(stream)) || stream;
        }

        video.play();
    }, function() {
        //it uses this alt video
        insertAltVideo(video);
        alert("There was some problem trying to fetch video from your webcam, using a fallback video instead.");
    });
} else {
    insertAltVideo(video);
    alert("Your browser does not seem to support getUserMedia, using a fallback video instead.");
}

PS:它可以在我想要的Firefox上运行

提前致谢

1 个答案:

答案 0 :(得分:1)

navigator.getUserMedia在Chrome中不再有效(它返回undefined),请使用较新的MediaDevices界面:

navigator.mediaDevices.getUserMedia(constraints)
  .then(function(stream) {
    var videoTracks = stream.getVideoTracks();
    console.log('Got stream with constraints:', constraints);
    console.log('Using video device: ' + videoTracks[0].label);
    stream.onended = function() {
      console.log('Stream ended');
    };
    window.stream = stream; // make variable available to console
    video.srcObject = stream;
  })
  .catch(function(error) {
    // ...
  }

查看更多: