过去几周,WebRTC 取得了诸多进展。该更新啦!
特别是,我们非常高兴看到 WebRTC 即将出现在多个浏览器和平台上。
现在,在 Chrome 中使用 getUserMedia
时不带标志,以及 Opera 和 Firefox Nightly/Aurora(但对于 Firefox,您需要设置偏好设置)。请访问 simpl.info/gum 看看 getUserMedia
的跨浏览器演示,并查看 Chris Wilson 提供的精彩示例,了解如何使用 getUserMedia
作为网络音频的输入。
webkitRTCPeerConnection
现已在 Chrome 稳定版中推出,并且无标记。Chrome 24 及更高版本支持 TURN 服务器。欢迎前往 simpl.info/pc 访问 Chrome 的 RTCPeerConnection 实现方式的超级简单演示,并访问 apprtc.appspot.com 访问这个超棒的视频聊天应用(简单说明这个名称:经过多次迭代,目前称为 webkitRTCPeerConnection
。其他名称和实现已弃用。当标准流程稳定后,webkit
前缀将被移除。)
此外,目前还在 Firefox Nightly 和 Aurora 的桌面设备上实现了 WebRTC,通过 Ericsson Bowser 浏览器为 iOS 和 Android 设备实现了 WebRTC。
DataChannel
DataChannel 是一种 WebRTC API,用于任意数据的高性能、低延迟、点对点通信。该 API 与 WebSocket 类似,但通信是直接在浏览器之间进行的,因此 DataChannel 即使需要中继 (TURN) 服务器,也会比 WebSocket 快得多(当针对防火墙的“打孔”失败且 NAT 失败时)。
我们计划在 Chrome 版本 25 中使用 DataChannel,但版本带有标志,不过可能会错过此版本。这仅用于实验目的,可能无法完全正常运行,而且无法与 Firefox 实现进行通信。更高版本中的 DataChannel 应该更加稳定,并且将实现该值以支持在 Firefox 中与 DataChannel 进行交互。
Firefox Nightly/Aurora 支持 mozGetUserMedia
、mozRTCPeerConnection
和 DataChannel
(但别忘了设置您的 about:config 偏好设置!)
以下是在 Firefox 中运行的 DataChannel 的屏幕截图:
此演示位于 http://mozilla.github.com/webrtc-landing/data_test.html。以下是一段代码:
pc1.onconnection = function() {
log("pc1 onConnection ");
dc1 = pc1.createDataChannel("This is pc1",{}); // reliable (TCP-like)
dc1 = pc1.createDataChannel("This is pc1",{outOfOrderAllowed: true, maxRetransmitNum: 0}); // unreliable (UDP-like)
log("pc1 created channel " + dc1 + " binarytype = " + dc1.binaryType);
channel = dc1;
channel.binaryType = "blob";
log("pc1 new binarytype = " + dc1.binaryType);
// Since we create the datachannel, don't wait for onDataChannel!
channel.onmessage = function(evt) {
if (evt.data instanceof Blob) {
fancy_log("*** pc2 sent Blob: " + evt.data + ", length=" + evt.data.size,"blue");
} else {
fancy_log('pc2 said: ' + evt.data, "blue");
}
}
channel.onopen = function() {
log("pc1 onopen fired for " + channel);
channel.send("pc1 says Hello...");
log("pc1 state: " + channel.state);
}
channel.onclose = function() {
log("pc1 onclose fired");
};
log("pc1 state:" + channel.readyState);
}
要获得有关 Firefox 实施的更多信息和演示,请访问 hacks.mozilla.org 博客。我们将于 2013 年初在 Firefox 18 中发布基本的 WebRTC 支持,并计划支持其他功能,包括 getUserMedia
和 createOffer/Answer 约束条件,以及 TURN(以允许受防火墙保护的浏览器之间进行通信)。
如需详细了解 WebRTC,请参阅 WebRTC 使用入门。甚至有 WebRTC 图书,提供印刷版和多种电子书格式。
分辨率限制
Chrome 24 及更高版本中已实现限制。这些可用于设置 getUserMedia()
和 RTCPeerConnection addStream()
调用的视频分辨率值。
simpl.info/getusermedia/constraints 是一个示例。通过设置断点并调整值来尝试不同的约束条件。
有几个问题... 在一个浏览器标签页中设置的 getUserMedia
限制条件会影响后续打开的所有标签页的约束条件。为约束条件设置不允许的值会产生相当隐蔽的错误消息:
navigator.getUserMedia error: NavigatorUserMediaError {code: 1, PERMISSION_DENIED: 1}
同样,如果您尝试从本地文件系统(而不是在服务器上)使用 getUserMedia
,也会看到此错误!
流式屏幕截图
“标签页捕获”功能现已在 Chrome 开发者版中提供。这样,您就能够将标签页的可见区域作为数据流捕获,然后可在本地或通过 RTCPeerConnection 的 addStream()
使用。对于场景拍摄和网页共享非常有用。如需了解详情,请参阅 WebRTC 标签页内容捕获提案。
请对本次更新发表评论,让我们随时了解最新进展:我们很想了解您对这些 API 有何看法。
...同时别忘了在 chromiumbugs.appspot.com 上提交遇到的任何错误!