1

我有两个网络摄像头，并试图指定在我的视频标签中显示哪一个。我的 HTML 很简单<video autoplay></video>。这是我的javascript：

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

var constraints = {
    video: {
        optional: [{
            sourceId: "64-character-alphanumeric-source-id-here"
        }]
    }
};
var video = document.querySelector("video");

function successCallback(stream) {
    window.stream = stream; // stream available to console
    if (window.URL) {
        video.src = window.URL.createObjectURL(stream);
    } else {
        video.src = stream;
    }
    video.play();
}

function errorCallback(error) {
    console.log("navigator.getUserMedia error: ", error);
}

navigator.getUserMedia(constraints, successCallback, errorCallback);

但是，即使我将 sourceId 更改为我的第二个网络摄像头，我也无法让它显示该网络摄像头。js.fiddle 代码

4

1 回答 1

1

此代码在移动 chrome 中为我工作：它尝试检测背面的视频流。

MediaStreamTrack.getSources(function(sourceInfos) {
              var videoSourceId;
              for (var i = 0; i != sourceInfos.length; ++i) {
                var sourceInfo = sourceInfos[i];
                if(sourceInfo.kind == "video" && sourceInfo.facing == "environment") {
                  videoSourceId = sourceInfo.id;
                }
              }
              var constraints = {
                audio: false,
                video: {
                  optional: [{sourceId: videoSourceId}]
                }
              };
            ....
});

请注意，此代码中没有回退

于 2014-01-05T16:34:39.497 回答