Warning: file_get_contents(/data/phpspider/zhask/data//catemap/9/javascript/418.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript WebRTC远程视频为黑色_Javascript_Socket.io_Webrtc - Fatal编程技术网

Javascript WebRTC远程视频为黑色

Javascript WebRTC远程视频为黑色,javascript,socket.io,webrtc,Javascript,Socket.io,Webrtc,我正在尝试遵循“入门”WebRTC指南: 我试图实现的是在两个对等点之间建立视频连接。但是,当我共享网络摄像头(按下chrome中的“允许”按钮)时,remoteVideo在远程端是黑色的 我的剧本: var pc; var sdpConstraints = {'mandatory': { 'OfferToReceiveAudio':true, 'OfferToReceiveVideo':true }}; var constraints = {video: true, audio: true}

我正在尝试遵循“入门”WebRTC指南:

我试图实现的是在两个对等点之间建立视频连接。但是,当我共享网络摄像头(按下chrome中的“允许”按钮)时,remoteVideo在远程端是黑色的

我的剧本:

var pc;
var sdpConstraints = {'mandatory': { 'OfferToReceiveAudio':true, 'OfferToReceiveVideo':true }};
var constraints = {video: true, audio: true};
var socket = io.connect();

function start(isCaller) {
    var servers = {"iceServers": [{ "url": "stun:stun.l.google.com:19302"}]};
    pc = new RTCPeerConnection(servers);

    pc.onicecandidate = function(event) {
        if(event.candidate) {
            socket.emit('candidate', {'candidate': event.candidate});
        }
    }

    pc.onaddstream = function(event) {
        attachMediaStream(remoteVideo, event.stream);
    }

    getUserMedia(constraints, function(stream) {
        attachMediaStream(localVideo, stream);
        pc.addStream(stream);

        if(isCaller) {
            pc.createOffer(gotDescription, null, sdpConstraints);
        } else {
            pc.createAnswer(pc.remoteDescription, gotDescription);
        }

        function gotDescription(desc) {
            pc.setLocalDescription(desc);
            socket.emit('sdpMessage', {'sdpMessage': desc});
        }
    }, printError);
}

socket.on('gotMessage', function(data) {
    if(!pc) { start(false); }

    if(data.remoteSDP) {
        pc.setRemoteDescription(new RTCSessionDescription(data.remoteSDP));
    } else {
        pc.addIceCandidate(new RTCIceCandidate(data.remoteCandidate), onAddIceCandidateSuccess, onAddIceCandidateError);
    }
});
HTML包含:

<button onclick="start(true)">HIT ME</button>
<video id="localVideo" autoplay></video>
<video id="remoteVideo" autoplay></video>
控制台会成功记录addIceCandidate,当我在接收端记录媒体流时,它的id和标签对应于发送方的id和标签

我做错了什么

我也得到了这个错误:
未能在“RTPeerConnection”上执行“createAnswer”:作为参数1提供的回调不是函数。“您对API的使用不正确。”。你提到的博客也有同样的错误。请查看正确的,并查看

createAnswer签名是:

pc.createAnswer(successCallback, failureCallback, constraints);

这发生在我的电脑在代理服务器后面的时候。我使用TURN服务器解决了这个问题。还可以在iceServers中列出TURN服务器。

您只需右键单击“视频”部分并选择“显示控件”,视频就会显示出来。真的很简单


您是否使用单一计算机/视频源?你用的是什么操作系统?我用的是两台mac OS x机器。。。运行chrome。。正在从内置网络摄像头提交视频输入。您如何填写turn服务器的凭据。。我用过它,但远程视频又变黑了。
pc.createAnswer(successCallback, failureCallback, constraints);