2

我正在http://www.html5rocks.com/en/tutorials/webrtc/basics/中尝试对等网络摄像头通信的示例代码,其中两个客户端都在同一页面中实现。

“本地”网络摄像头流正确显示。但是,“远程”流上没有任何显示,我不确定为什么。

下面是我的代码。我目前正在托管服务器上对其进行测试。谢谢!

var localStream;

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

window.URL = window.URL || window.webkitURL;

navigator.getUserMedia({'audio':true, 'video':true}, onMediaSuccess, onMediaFail);

function onMediaSuccess(stream) {
    var localVideo = document.getElementById("localVideo");
    var url = window.URL.createObjectURL(stream);
    localVideo.autoplay = true;
    localVideo.src = url;
    localStream = stream;
    console.log('Local stream established: ' + url);
}

function onMediaFail() {
    alert('Could not connect stream');
}

function iceCallback1(){}
function iceCallback2(){}

function gotRemoteStream(e) {
    var remoteVideo = document.getElementById("remoteVideo");
    var stream = e.stream;
    var url = window.URL.createObjectURL(stream);
    remoteVideo.autoplay = true;
    remoteVideo.src = url;
    console.log('Remote stream received: ' + url);
}   

function call(){

    pc1 = new webkitPeerConnection00(null, iceCallback1);   // create the 'sending' PeerConnection
    pc2 = new webkitPeerConnection00(null, iceCallback2);   // create the 'receiving' PeerConnection

    pc2.onaddstream = gotRemoteStream;                      // set the callback for the receiving PeerConnection to display video

    console.log("Adding local stream to pc1");
    pc1.addStream(localStream);                             // add the local stream for the sending PeerConnection

    console.log("Creating offer");
    var offer = pc1.createOffer({audio:true, video:true});  // create an offer, with the local stream

    console.log("Setting local description for pc1");
    pc1.setLocalDescription(pc1.SDP_OFFER, offer);          // set the offer for the sending and receiving PeerConnection

    console.log("Start pc1 ICE");
    pc1.startIce();

    console.log("Setting remote description for pc2");
    pc2.setRemoteDescription(pc2.SDP_OFFER, offer);

    // gotRemoteStream Triggers here

    console.log("Creating answer");                         // create an answer
    var answer = pc2.createAnswer(offer.toSdp(), {has_audio:true, has_video:true});

    console.log("Setting local description for pc2");   
    pc2.setLocalDescription(pc2.SDP_ANSWER, answer);        // set it on the sending and receiving PeerConnection 

    console.log("Setting remote description for pc1");
    pc1.setRemoteDescription(pc1.SDP_ANSWER, answer);

    console.log("Start pc2 ICE");
    pc2.startIce();                                         // start the connection process

    console.log("script done");
}
4

1 回答 1

0

尝试这个:


Vikas Marwaha 和 Justin Uberti 的simpl.info RTCPeerConnection

http://www.simpl.info/rtcpeerconnection/

它对我来说效果很好,而且非常干净和简单。

于 2014-07-12T20:17:32.010 回答