Node.js WebRTC视频共享应用程序不工作

Node.js WebRTC视频共享应用程序不工作,node.js,websocket,webrtc,Node.js,Websocket,Webrtc,我已经尝试在两个客户端之间通过WebRTC共享视频流大约一周了,我不知道如何继续。我很沮丧,真的需要经验丰富的人的帮助。请帮我把这个打开 我正在使用WebSocket和NodeJ。我将在下面发布我的所有代码: NodeJS上的服务器代码 Index.html加载并立即运行VideoChatApp.js 最后,这里是我的错误: 您可以从已经运行并完全打开的代码开始。查看easyrtc.com我们有一个客户端api、信号服务器和工作代码。如果您对该代码有任何问题,请向我们寻求有关Google Gro

我已经尝试在两个客户端之间通过WebRTC共享视频流大约一周了,我不知道如何继续。我很沮丧,真的需要经验丰富的人的帮助。请帮我把这个打开

我正在使用WebSocket和NodeJ。我将在下面发布我的所有代码:

NodeJS上的服务器代码

Index.html加载并立即运行VideoChatApp.js

最后,这里是我的错误:

您可以从已经运行并完全打开的代码开始。查看easyrtc.com我们有一个客户端api、信号服务器和工作代码。如果您对该代码有任何问题,请向我们寻求有关Google Groups for easyrtc的帮助

我不确定这对您是否仍然有意思,但我对使用PeerJS作为包装器的WebRTC有很好的经验。它会处理所有你不想做的事情。有一个客户端库和一个非常好的nodejs信令服务器。您可以在自己的节点服务器中轻松扩展此服务器。
这可能无法解释您的方法失败的原因,但可以使WebRTC轻松运行。

如果您指出发生错误的原因,这会有所帮助。关于offer.onicecandidate:它不应该通过您的websocket将候选人发送给其他对等方吗?我认为Silvia Pfeiffer在这里有一个很好且简单的例子:FWIW我构建了一个简单的逐步代码实验室,用于构建WebRTC视频聊天应用程序,使用节点上的Socket.IO发送信号,在www.bitbucket.org/webrtc/codelab@Sam我看到你在其他3-4个页面上宣传你的codelab。问题是,在第二步中,你清楚地解释了简单的部分。在第3步,你说,ok,从这个文件复制代码。说明:它有很多功能@队长说得对-也许我应该补充一些信息-虽然代码实验室在这一点上确实给出了更多的细节,而不仅仅是“它做了很多!”很难做到平衡——我不想在codelab说明中给出完整的解释。不管有没有广告,我认为在相关的地方指向代码实验室是合理的。
"use strict";

/** Requires **/
var  webSocketServer = require('websocket').server,
        expr = require("express"),
        xpress = expr(),
        server = require('http').createServer(xpress);
// Configure express
xpress.configure(function() {
     xpress.use(expr.static(__dirname + "/public"));
     xpress.set("view options", {layout: false});
});
// Handle GET requests to root directory
xpress.get('/', function(req, res) {
    res.sendfile(__dirname + '/public/index.html');
});
// WebSocket Server
var wsServer = new webSocketServer({
    httpServer: server
});
// Set up the http server
server.listen(8000, function(err) {
    if(!err) { console.log("Listening on port 8000"); }
});

var clients = [ ]; 

/** On connection established */
wsServer.on('request', function(request) { 
    // Accept connection - you should check 'request.origin' to make sure that client is connecting from your website
    var connection = request.accept(null, request.origin); 
    var self = this;    
    // We need to know client index to remove them on 'close' event
    var index = clients.push(connection) - 1;

    // Event Listener for when Clients send a message to the Server
    connection.on('message', function(message) {
        var parsedMessage = JSON.parse(message.utf8Data);
        if ( parsedMessage.kind == 'senderDescription' ) {
            wsServer.broadcastUTF(JSON.stringify({ kind:'callersDescription', callerData: parsedMessage }));
        }
    }); 
});
function VideoChatApp() {
    this.connection = null;
    this.runConnection();
}

_p = VideoChatApp.prototype;


/** Initialize the connection and sets up the event listeners **/
_p.runConnection = function(){
    // To allow event listeners to have access to the correct scope
    var self = this;
    // if user is running mozilla then use it's built-in WebSocket
    window.WebSocket = window.WebSocket || window.MozWebSocket;
    // if browser doesn't support WebSocket, just show some notification and exit
    if (!window.WebSocket) { return;  }
    /** Where to make the connection **/     
    var host = location.origin.replace(/^http/, 'ws');
    console.log(host);
    this.connection = new WebSocket(host);
    /** Once the connection is established **/
    this.connection.onopen = function () {
        console.log("Web Socket Connection Established");
        self.onConnectionEstablished();        
    };
    /** If there was a problem with the connection */
    this.connection.onerror = function (error) {
        console.log("ERROR with the connection *sadface*");
    };
}; // end runConnection

_p.onConnectionEstablished = function() {  
    // My connection to the nodejs server
    var websocketConnection = this.connection;

    // Some local variables for use later
    var mediaConstraints = {
        optional: [],
        mandatory: {
            OfferToReceiveVideo: true
        }
    };
    var offerer, answerer;
    this.theLocalStream = null;
    var amITheCaller = false;
    var localVideoTag = document.getElementById('localVideoTag');
    var remoteVideoTag = document.getElementById('remoteVideoTag');
    window.RTCPeerConnection = window.mozRTCPeerConnection || window.webkitRTCPeerConnection;
    window.RTCSessionDescription = window.mozRTCSessionDescription || window.RTCSessionDescription;
    window.RTCIceCandidate = window.mozRTCIceCandidate || window.RTCIceCandidate;
    navigator.getUserMedia = navigator.mozGetUserMedia || navigator.webkitGetUserMedia;
    window.URL = window.webkitURL || window.URL;
    window.iceServers = {
       iceServers: [{
           url: 'stun:23.21.150.121'
       }]
    };
    var callButton = document.getElementById("callButton");
    callButton.onclick = callClicked;
    function callClicked() {
      amITheCaller = true;
      setUpOffer();
    }
    offerer = new RTCPeerConnection(window.iceServers);
    answerer = new RTCPeerConnection(window.iceServers);


    /** Start Here - Set up my local stream **/
     getUserMedia(function (stream) {
         hookUpLocalStream(stream);
     });
     function getUserMedia(callback) {
         navigator.getUserMedia({
             video: true
         }, callback, onerror);

         function onerror(e) {
             console.error(e);
         }
     }
     function hookUpLocalStream(localStream) {
        this.theLocalStream = localStream;
        callButton.disabled = false;
        localVideoTag.src = URL.createObjectURL(localStream);
        localVideoTag.play();
     };


    /* When you click call, then we come here. Here I want to set up the offer and send it. */
    function setUpOffer() {
      var stream = theLocalStream;      
      offerer.addStream(stream);    

      offerer.onaddstream = function (event) {
        console.log("onaddstream callback was called");
      };

      offerer.onicecandidate = function (event) {
         if (!event || !event.candidate) return;
         answerer.addIceCandidate(event.candidate);
      };

      offerer.createOffer(function (offer) {
        offerer.setLocalDescription(offer);
            console.log("------------------- What I am sending: -------------------------");
            console.log(offer);
            console.log(stream);
            console.log("-----------------------------------------------------------------\n");
            var jsonMsg = JSON.stringify( {kind:'senderDescription', streamInfo: offer, theStream: stream} );
            websocketConnection.send( jsonMsg );  
            //answererPeer(offer, stream);            
      }, onSdpError, mediaConstraints);
    }

     /* Respond to a call */
    function answererPeer(offer, stream) {      
      answerer.addStream(stream);

      answerer.onaddstream = function (event) {         
         remoteVideoTag.src = URL.createObjectURL(event.stream);
         remoteVideoTag.play();
      };

      answerer.onicecandidate = function (event) {
         if (!event || !event.candidate) return;
         offerer.addIceCandidate(event.candidate);
      };

      answerer.setRemoteDescription(offer, onSdpSucces, onSdpError);
      answerer.createAnswer(function (answer) {
         answerer.setLocalDescription(answer);
         offerer.setRemoteDescription(answer, onSdpSucces, onSdpError);
      }, onSdpError, mediaConstraints);
    }

     function onSdpError(e) {
         console.error('onSdpError', e);
     }

     function onSdpSucces() {
         console.log('onSdpSucces');
     }

     websocketConnection.onmessage = function (messageFromServer) {
        console.log(" ------------------------ Message from server: -------------------- ");
        var parsedMessage = JSON.parse(messageFromServer.data);
        if(parsedMessage.callerData.kind = "senderDescription") {
            console.log("Received a senderDescription");
            console.log(parsedMessage.callerData.streamInfo);
            console.log(parsedMessage.callerData.theStream);
            console.log("-------------------------------------------------------------------\n");
            answererPeer(parsedMessage.callerData.streamInfo, parsedMessage.callerData.theStream);            
        }        
    }; 
};// end onConnectionEstablished()