【问题标题】:webRTC order and signaling serverwebRTC 订单和信令服务器
【发布时间】:2016-09-17 14:24:16
【问题描述】:

所以我正在尝试通过带有socket.io 的信令服务器建立 webRTC 视频连接。我已经通过了setLocalDescription,这让我可以得到候选冰,我相信从阅读中是正确的方法,但是我如何添加冰候选。我看到我必须使用类似以下内容:myPeerConnection.addIceCandidate(RTCIceCandidate); 但我是否将其添加到远程和本地对等连接中?我是否将evt.candidates 发送到我的信令服务器并将它们添加到那里?如果是这样,怎么办?添加到对等连接的变量不是全局的。我已经为此工作了几天,我想我现在只需要一个指南,比在线教程更好,而且我已经查看了我能找到的所有内容。

这是附加到我的 html 的代码:client.js

var socket = io.connect();

var myPeerConnection;
var remotePeerConnection;
var offer;

var PeerConnectionWindow = (window.RTCPeerConnection || window.mozRTCPeerConnection 
|| window.webkitRTCPeerConnection || window.msRTCPeerConnection);
var SessionDescription = (window.RTCSessionDescription || window.mozRTCSessionDescription 
|| window.webkitRTCSessionDescription || window.msRTCSessionDescription);


    function hasUserMedia() { 
   //check if the browser supports the WebRTC 
   return !!(navigator.getUserMedia || navigator.webkitGetUserMedia || 
      navigator.mozGetUserMedia || navigator.msGetUserMedia); 
}




if (hasUserMedia()) {

   var configuration = { 
      "iceServers": [{ "url": "stun:stun.1.google.com:19302" }] 
   }; 

   myPeerConnection = new PeerConnectionWindow(configuration);
   console.log(myPeerConnection);

   remotePeerConnection = new PeerConnectionWindow(configuration);
   console.log(remotePeerConnection);

   myPeerConnection.createOffer(gotDescription, onError);

   myPeerConnection.onicecandidate = function(evt){
      if(event.candidate){
         socket.emit('ice', JSON.stringify({'ice': evt.candidate}));
         remotePeerConnection.addIceCandidate(evt.candidate);
         console.log("connected my to remote");
      }
   };

   remotePeerConnection.onicecandidate = function(evt){
      if(event.candidate){
         socket.emit('ice', JSON.stringify({'ice': evt.candidate}));
         myPeerConnection.addIceCandidate(evt.candidate);
         console.log("connected my to remote");
      }
   };

   remotePeerConnection.onaddstream = function (evt) {
      console.log("on added stream");
      var remoteVid = document.getElementById('remote'); 

      remoteVid.src = window.URL.createObjectURL(evt.stream);
   }

   navigator.getUserMedia = navigator.getUserMedia || navigator.webkitGetUserMedia
   || navigator.mozGetUserMedia || navigator.msGetUserMedia; 
   //enabling video and audio channels 
   navigator.getUserMedia({ video: true, audio: true }, function (stream) {  
      var video = document.getElementById('local');  
      // //inserting our stream to the video tag     
      video.src = window.URL.createObjectURL(stream);
      myPeerConnection.addStream(stream); 
   }, onError); 
} else { 
   alert("WebRTC is not supported"); 
}

function gotDescription(desc) {
   offer = desc
   myPeerConnection.setLocalDescription(offer, myPeerConnLocalDescSet, onError);
   socket.emit('description', JSON.stringify({'sdp': desc}));
}

function onError(err){
   console.log(err);
}

function myPeerConnLocalDescSet(){
   remotePeerConnection.setRemoteDescription(offer, remotePeerConnRemoteDescSet,onError);
}

function remotePeerConnRemoteDescSet(){
   remotePeerConnection.createAnswer(onAnswerCreated, onError);
}

function onAnswerCreated(description){
   answer = description;
   remotePeerConnection.setLocalDescription(answer, remotePeerLocalDescSet,onError);
}

function remotePeerLocalDescSet(){
   myPeerConnection.setRemoteDescription(answer, myPeerRemoteDescSet,onError);
}

function myPeerRemoteDescSet(){
   console.log('did we get it?');
}

这是我的信令服务器:server.js

var express = require('express');
var app = express();
var server = require('http').createServer(app);
var io = require('socket.io').listen(server);



app.get('/', function(req, res){
   res.sendFile(__dirname + '/index.html');
});

app.use(express.static(__dirname + '/'));

server.listen(process.env.PORT || 3000, function(){
  console.log('listening on *:3000');
});


io.sockets.on('connection', function(socket){
    console.log("in the socket on server");

    socket.on('disconnect', function(){
        console.log('user disconnected');
    });
    socket.on('description', function(data){
        console.log(data);
    });
    socket.on('ice', function(data){
        // Do I attempt to add the candidate here like so?: myPeerConnection.addIceCandidate(new RTCIceCandidate(data));
    });
});

更新

所以看起来一切都是按顺序流动的,所以我更新了我的代码。现在我只需要关于如何在两个对等方之间交换 SDP 信息的帮助。我现在所拥有的是将它们发送到Socket.io 以供双方领取和申请……对吗?有人有一些示例代码来说明这是如何完成的,他们可以向我展示一个解释。请并感谢您的帮助!

【问题讨论】:

    标签: node.js sockets socket.io webrtc peer


    【解决方案1】:

    所以如果有人感兴趣,我通过一些基本教程了解了如何与 socket.io 通信,但最重要的是我发现 webrtc 的顺序非常重要。在拥有正确的代码并调用后,点对点仍未完成,这是因为 必须在远程调用 ONADDSTREAM 并在本地添加流,然后才能创建报价

    这是为那些在如此简单的 ish 上浪费了几个小时的人准备的。

    【讨论】:

    • onaddstream 是一个事件监听器,而不是你调用的东西。但是是的,您必须添加一个事件侦听器以避免错过。
    【解决方案2】:

    第一次实现总是很棘手,ICE 候选接口(添加和打开)确实非常混乱。您可以查看该图表以了解何时调用哪个事件以及应该使用哪个 API。您可以看到,当在本地创建候选人时(onIceCandidate 事件),它需要通过信号传递到远程端,并使用 addIceCandidate API 添加。由于它是对称的,onIceCandidate 总是提供本地候选者,而 addIceCandidate 总是将远程候选者作为参数。

    http://www.slideshare.net/alexpiwi5/overviewpeerconnectionlifetime

    【讨论】:

    • 我确实认为我已经设法找到了发送和接收双方 SDP 报价的问题。我需要socket.io或服务器吗?我不确定从我所阅读的内容来看,这两种方式都有效还是只有一种方式有效?
    • 您使用网络套接字在同行之间交换报价、答案和候选人。这是一个交换,所以它需要双向。报价会从呼叫者到被呼叫者,以另一种方式回答,候选人将双向进行。
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2014-03-31
    • 2018-01-18
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多