为什么 WebRTC 本地流什么也不显示？

Question

我要做的是让 p1 连接到 p2，p2 获取网络摄像头并将其流式传输到 p2。在所有同一页面上练习 webrtc。

但是onaddstream 我确实得到了一个流，它有正确的 id 和错误，但是当我将它分配给视频元素时没有任何反应。

但是，我确实从请求流的 p2 获得了有效流。如果我将视频设置为等于此流，则它会显示网络摄像头视频。

这是代码

v = $0

pc1 = new RTCPeerConnection();
pc2 = new RTCPeerConnection();

pc1.onaddstream = (s) => {
    v.src = URL.createObjectURL(s.stream);
    window.s1 = s.stream;
};

pc1.createOffer({offerToReceiveVideo: 1})
.then((offer) => {
    pc1.setLocalDescription(offer);
    pc2.setRemoteDescription(offer)
})
.then(() => navigator.mediaDevices.getUserMedia({ video: true }))
.then((stream) => {
    pc2.addStream(stream);
    window.s2 = stream;
})
.then(() => pc2.createAnswer())
.then((answer) => {
    pc2.setLocalDescription(answer);
    pc1.setRemoteDescription(answer);
})
.catch((err)=>console.log(err));

Answer 1

您不是在向 ICE 候选人发出信号。添加：

pc1.onicecandidate = e => pc2.addIceCandidate(e.candidate);
pc2.onicecandidate = e => pc1.addIceCandidate(e.candidate);

...它会起作用的。

提示：查看友好的 Web 控制台弃用警告：

⚠ onaddstream 已弃用！请改用 peerConnection.ontrack。

⚠ URL.createObjectURL(MediaStream) 已弃用，很快将被删除。

例如喜欢this。规范几乎完成evolving。