正确拆解 WebRTC RTCPeerConnection答案

【问题标题】：proper teardown of a WebRTC RTCPeerConnection正确拆解 WebRTC RTCPeerConnection
【发布时间】：2021-05-11 17:50:36
【问题描述】：

我尝试做一个简单的 WebRTC p2p 视频聊天浏览器应用程序。我设置了一个信号服务器并让两个对等方进行所有SDP 和ICE 握手。我的一些代码sn-p：

pc = new RTCPeerConnection(config);
pc.onicecandidate = (event) => {
 ...
}
pc.ontrack(event) =>{
  if (event.track.kind === 'video') {
    // add the stream as the srcObject of a video tag
  }
  event.streams[0].onremovetrack = (e) => {
    // want to remove the stream from the video tag
  }
}

当对等节点完成后，我会执行以下操作：

pc.stop();

我只是关闭了 RTCPeerConnection。但我没有看到 onremovetrack 在其他对等方上被触发。

关闭对等点以便通知另一个对等点并触发onremovetrack 的正确方法是什么？

【问题讨论】：

标签： webrtc rtcpeerconnection mediastreamtrack

【解决方案1】：

我认为你应该使用RTCPeerConnection.removeTrack() 方法，它会在另一端触发MediaStream.onremovetrack 事件。

要获取连接的轨迹，请使用RTCPeerConnection.getSenders() 方法。

RTCPeerConnection 方法 getSenders() 返回一个数组 RTCRtpSender 对象，每个对象代表 RTP 发送者负责传输一个轨道的数据。

示例

let senders = pc.getSenders()

senders.forEach((sender) => {
  pc.removeTrack(sender)
})

这将从连接中删除所有轨道。有一个实验方法可以完全关闭连接，RTCPeerConnection.close()，检查compatibility table。在移除轨道后使用它，这样您将获得onremovetrack 事件：

pc.close()

调用此方法会终止 RTCPeerConnection 的 ICE 代理，结束任何正在进行的 ICE 处理和任何活动的流。

替代方案

另一种方法是立即调用close()方法，在另一端监听RTCPeerConnection.onconnectionstatechange事件，检查example。

更多信息

getSenders()方法
removeTrack()方法
onremovetrack 事件处理程序
close()方法
onconnectionstatechange 事件处理程序

【讨论】：