使用 WebRTC 在浏览器之间传输 JSON答案

【问题标题】：Transferring JSON between browsers with WebRTC使用 WebRTC 在浏览器之间传输 JSON
【发布时间】：2012-04-18 21:25:02
【问题描述】：

当我最初听说 WebRTC 的前景时，我感到很兴奋。这听起来像 websockets，但没有服务器。不幸的是，我能找到的所有教程都强调了 WebRTC 的视频和音频方面。我找不到任何关于在浏览器之间发送文本/数据/JSON 的信息。你能帮我写一个简单的 hello world 吗，只需使用 WebbRTC 从一个浏览器向另一个浏览器发送一些数据？

【问题讨论】：

标签： javascript webrtc

【解决方案1】：

这是一个暗中尝试，但最新的 Web API 编辑器草案有一个DataChannel 接口作为Peer-to-Peer Data API 的一部分。

但是，当前的Working Draft 没有这个 API，所以它可能是非常新的并且尚未实现。

【讨论】：

我看到一篇博文说WebRTC已经可以发送数据了，但是它侧重于视频聊天。听起来好像已经可以发送数据了，但是我找不到它的实现方式。
是什么让 Peer to Ppeer 数据 api 与 PeerConnection 不同？看起来，或者至少在 4 月 18 日草案中给出的示例中，两者都可以在没有服务器的情况下发送消息。
PeerConnection是connection-layer，不能直接用来发送数据。一旦你有了PeerConnection，你就可以将MediaStreams 附加到它上面，它提供了要发送或接收的数据。流似乎是单向的。但是 Data API 为PeerConnection 添加了一个新方法，它返回一个双向的DataChannel，它可以发送和接收任意数据。 MediaStreams 不是那样构建的。
马特，你似乎很困惑。您可以打开一个连接（如道路——数据可以在其上双向传输），并且您可以发送符合MediaStream 接口的数据（单向、多轨数据，如音频或视频），但您不能随意将字节放在一起并发送它们，也不能在没有@987654331 的情况下在同一通道（不是连接：通道）上来回发送数据@接口。
感谢您帮助我澄清这一点，我将不得不等待几个月让浏览器实现这些 api，但我对它们实现时的可能性感到兴奋

【解决方案2】：

DataChannel 现已在 Firefox (18+) 和 Chrome (25+) 中实现，但仍处于早期阶段。

有关更多信息，请参阅 HTML5 Rocks 文章 Getting Started with WebRTC。

【讨论】：

根据规范是谷歌浏览器中的数据通道。因为here 它说 SCTP 待定。那么是使用UDP还是TCP呢？
Chrome 目前仅提供不可靠 (UDP) 数据通道，等待 SCTP 支持。 Firefox 提供不可靠 (UDP) 和可靠 (TCP)。

【解决方案3】：

此功能尚未在任何发布的 WebRTC 实现中实现。正如其他发帖人所指出的，最新的 WebRTC 编辑草案中现在有一个 DataChannel API，但它的协议仍在研究中。预计今年晚些时候会在 Chrome 和 Firefox 中看到这个 API。

【讨论】：

所以你可以打开浏览器之间的连接，但是还不能发送数据？
你只能发送MediaStreams，这是数据，不能发送应用程序构造的任意数据，这是你想做的。此外，应用程序无法发送任何回复作为响应——它只能发送自己的MediaStreams，与您发送的邮件无关。

【解决方案4】：

这是一个老问题，但是因为我开始学习webRTC，所以我会尝试回答它。

首先，有些误解：

听起来像 websockets，但没有服务器

在正确交换和协商某些信息（媒体会话管理、节点的网络配置/多媒体功能）之前，无法在 WebRTC 对等点之间传输任何数据。为此，您需要一个服务器和signalling（它不是 webRTC 的一部分：您可以按照自己的方式实现它）。

当信号完成后，你需要创建RTCPeerConnection，如下所示：

if (navigator.webkitGetUserMedia) {
   RTCPeerConnection = webkitRTCPeerConnection;
} else if(navigator.mozGetUserMedia){
   RTCPeerConnection = mozRTCPeerConnection;
   RTCSessionDescription = mozRTCSessionDescription;
   RTCIceCandidate = mozRTCIceCandidate;
}

然后：

var connection = new RTCPeerConnection(servers);

在此之后，您可以将您的数据通道添加到此 PeerConnection：

var dataChannel = connection.createDataChannel("channelName",{ reliable: true });

完成后，您只需致电sendChannel.send('Any data you want');，这将发送您想要的任何数据。

如果有的话，我找到了this book really helpful。它留下了很多悬而未决的问题，但首先它是好的。

【讨论】：

【解决方案5】：

我相信 Matt 已经知道了，但对于 google 客人：是的，你可以，使用 DataChannels。

在你身边：

channel = somePeerConnection.createDataChannel("a Label");
channel.onopen = function() { channel.send("any thing") };

另一边：

somePeerConnection.ondatachannel = function (evt) {
   evt.channel.onmessage = function (evt) {
       alert( evt.data );
   };
};

看这个例子：

【讨论】：

您发布的第二个链接是 404

【解决方案6】：

http://peerjs.com/ 正在发展，并为您提供类似 websocket 的语法，用于浏览器实例之间的 p2p 数据传输

【讨论】：

【解决方案7】：

正如贾斯汀所说，协议和 API 仍在确定中；在最新的 IETF 中，我提交了一份 JS API 下的次要协议草案。最终形式可能会非常接近编辑草稿中的当前提案，但您可能还需要等待接收方的“onopened”。

API 以 WebSocket api 为模型，以简化将代码从 WebSocket 实现移动到 DataChannels，尽管并非 WebSocket 中的所有项目（例如 url）都保留，并且显然 DataChannel 增加了许多 WebSockets 中没有的功能使用不可靠或部分可靠的数据。

【讨论】：

我有一个 WebSockets 机制适用于我的网站，虽然它比 AJAX 更好，但我认为它会非常酷（更不用说我的服务器非常棒了，我不必传输这么多数据）让 WebRTC 降低我的成本，仅用于托管网站和数据库，仅此而已。