Как мне инициировать канал данных WebRTC?

Question

Я пытаюсь создать канал данных WebRTC между клиентами, используя веб-сокеты.

Я перечислил несколько серверов ICE

var rtcsettings = {
  iceServers: [
    {url: "stun:stun.ekiga.net"},
    {url: "stun:stun.voipbuster.com"},
    {url: "stun:stun.1.google.com:19302"},
  ]   
};

Затем есть функция подключения, которая создает канал и предложение и отправляет его через веб-сокет.

function(them) {
  var pc = new RTCPeerConnection(rtcsettings);
  self.channel = pc.createDataChannel("gamelink");
  console.log(pc, self.channel);
  self.peerconnection = pc;
  pc.createOffer(function(offer) {
    pc.setLocalDescription(new RTCSessionDescription(offer), function() {
      self.socket.send(JSON.stringify({
        "to": them,
        "uuid": uuid,
        "offer": offer,
      }));
    }, pc.close);
  }, pc.close);
}

Затем на другом конце есть обратный вызов, который добавляет предложение к его соединению и отправляет ответ.

Он также устанавливает обратный вызов при добавлении канала данных, но он никогда не срабатывает. Что мне не хватает?

function (message){
  var offer = message.offer;
  var pc = new RTCPeerConnection(rtcsettings);
  pc.ondatachannel = function(ch) {
    self.channel = ch;
    console.log(self.channel);
  }
  console.log(pc);
  pc.setRemoteDescription(new RTCSessionDescription(offer), function() {
    pc.createAnswer(function(answer) {
      pc.setLocalDescription(new RTCSessionDescription(answer), function() {
        self.socket.send(JSON.stringify({
          "to": message.uuid,
          "uuid": uuid,
          "answer": answer,
        }));
      }, pc.close);
    }, pc.close);
  }, pc.close);
  self.peerconnection = pc;
}

Затем, наконец, существует еще один обратный вызов инициатора, который добавляет дескриптор ответа к его соединению.

function(message) {
  self.peerconnection.setRemoteDescription(
      new RTCSessionDescription(message.answer),
      function() { },
      self.peerconnection.close);
}

Весь код, кроме содержимого сокетов и канала данных, почти дословно взят со страницы базового использования MDN.

Я тестирую Chrome на localhost, так что брандмауэры не должны быть проблемой.

После того, как обмен произошел, оба соединения имеют локальный и удаленный набор дескрипторов. Канал данных readyState является connecting, PeerConnection's iceConnectionState является new И его signalingState является stable,

Чего не хватает?

Answer 1

Вы должны обращаться с кандидатами ICE.

На обоих концах должен быть обратный вызов:

pc.onicecandidate = function(e) {
  if(e.candidate) {
    self.socket.send(JSON.stringify({
      "to": message.uuid,
      "uuid": uuid,
      "candidate": e.candidate,
    }));
  }
};

и обработчик

callbacks["candidate"] = function(message) {
  console.log(message)
  self.peerconnection.addIceCandidate(new RTCIceCandidate(message.candidate));
}

Answer 2

Добавьте эти настройки в ваш RTCPeerConnection

var optionalRtpDataChannels = {
  optional: [{RtpDataChannels: true}]
};
var pc = new RTCPeerConnection(rtcsetting, optionalRtpDataChannels);