RTCDataChannel 的 ReadyState 未“打开”

Question

我正在尝试使用WebRTC's adapter.js 通过RTCPeerConnection 和RTCDataChannel 发送文本，但出现以下错误：

Uncaught InvalidStateError:
Failed to execute 'send' on 'RTCDataChannel':
RTCDataChannel.readyState is not 'open'

我的代码可通过this fiddle 及以下获得：

var peerConnection = new RTCPeerConnection(null, {
  optional: [{
    RtpDataChannels: true
  }]
});

peerConnection.ondatachannel = function(event) {
  receiveChannel = event.channel;
  receiveChannel.onmessage = function(event){
    alert(event.data);
  };
};

var dataChannel = peerConnection.createDataChannel("data", {reliable: false});
dataChannel.send("Hello");

我做错了什么吗？

Answer 1

我今天早上编写了以下代码，它在一个页面中使用了RTCPeerConnection 和RTCDataChannel。这些函数的声明顺序很重要。

var localPeerConnection, remotePeerConnection, sendChannel, receiveChannel;

localPeerConnection = new RTCPeerConnection(null, {
  optional: [{
    RtpDataChannels: true
  }]
});

localPeerConnection.onicecandidate = function(event) {
  if (event.candidate) {
    remotePeerConnection.addIceCandidate(event.candidate);
  }
};

sendChannel = localPeerConnection.createDataChannel("CHANNEL_NAME", {
  reliable: false
});

sendChannel.onopen = function(event) {
  var readyState = sendChannel.readyState;
  if (readyState == "open") {
    sendChannel.send("Hello");
  }
};

remotePeerConnection = new RTCPeerConnection(null, {
  optional: [{
    RtpDataChannels: true
  }]
});

remotePeerConnection.onicecandidate = function(event) {
  if (event.candidate) {
    localPeerConnection.addIceCandidate(event.candidate);
  }
};

remotePeerConnection.ondatachannel = function(event) {
  receiveChannel = event.channel;
  receiveChannel.onmessage = function(event) {
    alert(event.data);
  };
};

localPeerConnection.createOffer(function(desc) {
  localPeerConnection.setLocalDescription(desc);
  remotePeerConnection.setRemoteDescription(desc);
  remotePeerConnection.createAnswer(function(desc) {
    remotePeerConnection.setLocalDescription(desc);
    localPeerConnection.setRemoteDescription(desc);
  });
});

Answer 2

您不能只创建 peerConnection、dataChannel 并立即开始使用它。 顺便说一句，你这里没有 2 个同伴......

1. 您需要在 2 个对等点中创建 peerConnections 对象
2. 转移 SDP 的
3. 获得冰候选人
4. 只有在打开数据通道之后，您才能在其上发送信息

我建议先阅读this，它会让你了解基本概念 然后继续this Sam Dutton 的 awesome code lab。

更新以回答 mhenry 的请求： 这是在一个类中设置数据通道的全部内容：https://gist.github.com/shacharz/9661930 跟随 cmets，您只需要：

1. 添加信令，将 SDP 的候选冰发送到其他对等点 (targetId)
2. 如果您想通过更高级别的逻辑来处理所有丢失的连接以及类似的事情。
3. 确保在收到 sdp 时调用“Handlmessage”方法
4. 使用该类及其公共方法：SetupCall、Send、Close