Question

在this document中，它使用URL.createObjectURL来设置视频源。（这是接听电话的代码）。

var offer = getOfferFromFriend();
navigator.getUserMedia({video: true}, function(stream) {
  pc.onaddstream = e => video.src = URL.createObjectURL(e.stream);
  pc.addStream(stream);

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

我希望video.src成为检索远程视频的地址。所以它应该由连接的另一端（无论是谁发起呼叫）修复和给出。但是URL.createObjectURL的值是在回答方的侧面生成的，它的事件取决于函数的调用时间。如何使用它来获取远程视频流？

编辑： URL.createObjectURL的结果看起来像blob：http://some.site.com/xxxx-the-token-xxxx。使用此字符串，视频组件如何知道加载远程流的位置？是否存在{url：stream}的哈希映射？如果是这样，视频组件如何访问hashmap？

流对象确实存储了一个令牌字符串，您可以使用stream.toURL获得该字符串。但它与URL.createObjectURL的结果不同。 URL.createObjectURL的值取决于时间。如果连续两次调用它，则会得到不同的值。

Answer 1

URL.createObjectURL(stream)是一个黑客。停止使用它。正在努力remove it。

直接使用video.srcObject = stream。它是标准的，并且实施得很好。

本地资源的分配首先应该不是URL，并且是了解WebRTC如何工作的红色鲱鱼。

WebRTC是一种传输API，直接从一个对等方发送数据到另一个对等方。不涉及内容网址。您从stream获得的远程onaddstream是本地对象接收方，是传输的实时流式传输结果，可以播放。

您阅读的文档陈旧且过时。谢谢你指出来，我会解决它。它还有其他问题：你应该立即调用setRemoteDescription ，而不是等待接收器共享他们的摄像头，否则会错过传入的候选者。而不是您显示的代码，执行此操作：

pc.onaddstream = e => video.srcObject = e.stream;

function getOfferFromFriend(offer) {
  return pc.setRemoteDescription(new RTCSessionDescription(offer))
    .then(() => navigator.getUserMedia({video: true}))
    .then(stream => {
      pc.addStream(stream);
      return pc.createAnswer();
    })
    .then(answer => pc.setLocalDescription(answer))
    .then(() => {
      // send the answer to a server to be forwarded back to the caller (you)
    })
    .catch(error);
}

它使用srcObject，避免使用已弃用的回调API，并且不会导致间歇性ICE失败。

Answer 2

因为WebRTC连接涉及几个步骤，所以从这种连接获得的是流。但src标记的video属性不接受流，而是接受URL。这是将流“转换”为URL的方法。

为什么WebRTC远程视频源由URL.createObjectURL生成

2 个答案: