1

2 つの Web カメラがあり、どちらをビデオ タグに表示するかを指定しようとしています。私の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 を 2 番目の Web カメラに変更しても、その Web カメラを表示できません。js.fiddle コード

4

1 に答える 1

1

このコードは、モバイルクロムで機能しています。背面のビデオストリームを検出しようとします。

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 に答える