將 RTCPeerConnection
連線至遠端對等點之後,即可在串流之間傳輸音訊和視訊。這是指從 getUserMedia()
串流收到的串流連結至 RTCPeerConnection
。媒體串流包含至少一個媒體播放軌,而我們想要將媒體傳輸到遠端對等節點時,就會將這些個別串流新增至 RTCPeerConnection
。
const localStream = await getUserMedia({video: true, audio: true});
const peerConnection = new RTCPeerConnection(iceConfig);
localStream.getTracks().forEach(track => {
peerConnection.addTrack(track, localStream);
});
音軌會先新增至 RTCPeerConnection
,再連線到遠端對等節點,因此請盡早執行此設定,而非等待連線完成。
新增遠端測試群組
要接收其他人的添加遠程曲目,我們
在本地 RTCPeerConnection
上註入收音器
收聽 track
事件。RTCTrackEvent
包含 MediaStream
物件的陣列,這些陣列的 MediaStream.id
值與對等點的本機串流相同。在我們的範例中,每個音軌都只與一個串流相關聯。
請注意,雖然 MediaStream
編號在對等點的兩端相符,但 MediaStreamTrack
ID 通常也是如此。
const remoteVideo = document.querySelector('#remoteVideo');
peerConnection.addEventListener('track', async (event) => {
const [remoteStream] = event.streams;
remoteVideo.srcObject = remoteStream;
});