WebRTC PeerConnection的getRemoteStreams在Safari/iOS移动端未定义，求替代方案

1. 用ontrack事件实时获取远程流 #

不要等连接建立后再去PeerConnection里找远程流，直接在初始化PeerConnection时监听ontrack事件，一旦远程有媒体轨道过来就能拿到对应的流：

peerConnection.ontrack = (event) => {
  const remoteStream = event.streams[0];
  // 把流绑定到视频标签
  document.getElementById('remote-video').srcObject = remoteStream;
};

远程端调用addTrack添加音视频轨道时，本地就会触发这个事件，事件对象里的streams数组包含对应流，这是目前标准且兼容性最好的方式。

2. 通过getReceivers()提取已存在的远程流 #

如果一定要从已建立的PeerConnection里获取远程流，可以用getReceivers()拿到所有远程媒体接收器，再从接收器的轨道关联到流：

const remoteReceivers = peerConnection.getReceivers();
// 去重后得到所有远程流（一个流可能包含音轨和视频轨）
const remoteStreams = [...new Set(remoteReceivers.map(r => r.track?.stream)).filter(Boolean)];

3. 本地流直接保存引用，不用从PeerConnection取 #

本地流都是通过getUserMedia获取的，直接存好这个引用就行，没必要调用getLocalStreams()：

// 获取本地流时直接保存
const localStream = await navigator.mediaDevices.getUserMedia({ video: true, audio: true });
// 绑定到本地视频标签
document.getElementById('local-video').srcObject = localStream;
// 添加到PeerConnection时用这个保存好的流
localStream.getTracks().forEach(track => peerConnection.addTrack(track, localStream));

要是非得从PeerConnection里获取本地流，就用getSenders()：

const localSenders = peerConnection.getSenders();
const localStreams = [...new Set(localSenders.map(s => s.track?.stream)).filter(Boolean)];

兼容性说明 #

getSenders()、getReceivers()和ontrack是WebRTC的标准API，Mac Safari、iOS Chrome这些浏览器都支持，完全可以替代旧的getRemoteStreams()和getLocalStreams()解决兼容性问题。

内容的提问来源于stack exchange，提问作者agam theos