Question

我知道adapter.js，试图：

将应用程序与规范更改和前缀差异隔离开来。

但是adpater.js只涵盖了非常基本的WebRTC API。我只是以setRemoteDescription为例。

在2013中，它被称为：

pc.setRemoteDescription(offer);

根据https://developer.mozilla.org/en-US/docs/Web/API/RTCPeerConnection，当前的API是？

  pc.setRemoteDescription(new RTCSessionDescription(offer), function() {
    pc.createAnswer(function(answer) {
      pc.setLocalDescription(new RTCSessionDescription(answer), function() {
        // send the answer to a server to be forwarded back to the caller (you)
      }, error);
    }, error);
  }, error);

我目前正在阅读an article from 2015，似乎是：

pc2.setRemoteDescription(pc1_offer).then(step3, failed);

我在哪里可以找到最新的＆＃34;官方＆＃34; WebRTC API的文档？
您如何跟上这些频繁的变化？

修改

http://www.w3.org/TR/webrtc/并不遥远，但我宁愿寻找可以遵循Firefox和Chrome当前API实施状态的内容（是< / strong>超过将如果有意义的话。）

Answer 1

WebRTC仍处于开发阶段，因此目前没有比规范更好的资源，并且最新的变更地点是：http://w3c.github.io/webrtc-pc

当涉及到个人浏览器以及实施的内容时，它会变得更难。请看：http://iswebrtcreadyyet.com

您在问题中观察到的主要API差异是2014年对promises的支持。现在，所有异步方法都返回Promise，而不是进行一对成功和失败的回调。 Chrome尚未实现此功能，但Firefox确实如此。

以下是在Firefox中运行的完整WebRTC调用（注意：使用arrow functions）：

var pc1 = new mozRTCPeerConnection(), pc2 = new mozRTCPeerConnection();

pc1.onicecandidate = e => !e.candidate ||
    pc2.addIceCandidate(e.candidate).catch(failed);
pc2.onicecandidate = e => !e.candidate ||
    pc1.addIceCandidate(e.candidate).catch(failed);
pc2.onaddstream = e => v2.mozSrcObject = e.stream;

function start() {
  navigator.mediaDevices.getUserMedia({ video: true, audio: true })
  .then(stream => pc1.addStream(v1.mozSrcObject = stream))
  .then(() => pc1.createOffer())
  .then(offer => pc1.setLocalDescription(offer))
  .then(() => pc2.setRemoteDescription(pc1.localDescription))
  .then(() => pc2.createAnswer())
  .then(answer => pc2.setLocalDescription(answer))
  .then(() => pc1.setRemoteDescription(pc2.localDescription))
  .then(() => log("Connected!"))
  .catch(failed);
}

var log = msg => div.innerHTML += "<p>" + msg + "</p>";
var failed = e => log(e.name +": "+ e.message +" line "+ e.lineNumber);

<video id="v1" height="120" width="160" autoplay></video>
<video id="v2" height="120" width="160" autoplay></video><br>
<button onclick="start()">Start!</button><div id="div"></div>

这是20行代码，比您可能看到的其他版本小很多。

如果它看起来很神秘，请不要绝望，因为承诺和箭头功能是需要一些习惯的新概念，特别是当像这样组合使用时。我建议使用上面的链接分别阅读它们。

旧的回调版本仍可用于所有RTCPeerConnection方法，因此promises的使用是可选的。 Chrome支持浏览器中的承诺（仅适用于WebRTC），但不支持箭头功能，因此在上述内容变得普遍之前可能需要一段时间。

除此之外，Chrome和Firefox在高级呼叫设置，甚至重新协商方面都非常稳定。规范中仍在变化的区域与RTCRtpSender等新的低级控制界面有关，还有指定流指定曲目的重新聚焦（使用addTrack而不是addStream等）。

不幸的是，我知道没有特定于浏览器的文档链接。正如您所指出的那样，MDN链接已过时（尽管最近更新了getUserMedia的MDN链接，因此希望这会改变）。我发现在查看不同浏览器支持的内容时，查看工作演示和示例仍然是最有帮助的。

我知道的一些差异：

getUserMedia constaints - Chrome在此处实现了大约2013年的规范，而Firefox实现了规范（但仅限于宽度/高度/ frameRate和facingMode）。
getStats - Chrome的实现虽然比较成熟，但却是非标准的，而Firefox则实现了规范（但仅限于rtp / rtcp，候选冰和其他一些内容）。
RTCOfferOptions - Chrome会对这些产品造成阻塞， { offerOptions: true }使用较旧的{ mandatory: OfferOptions: true }（请注意区分“o”与“O”），因为这适用于两种浏览器。
addTrack/removeTrack暂时坚持addStream(stream)（虽然Firefox没有实现removeStream所以请在那里使用removeTrack。

由于前缀和其他差异，您仍然需要adapter.js，但有更多的adapter.js可以而且应该这样做。希望它的新版本能够通过为上述一些差异提供填充来进一步缩小这一差距。

我对Firefox的了解比Chrome好，所以如果我错过了什么，我很抱歉。

我希望其中一些有帮助。

我在哪里可以找到WebRTC API的官方和最新文档？

1 个答案: