เมื่อ RTCPeerConnection
เชื่อมต่อกับแอปเทียบเท่าระยะไกลแล้ว คุณจะสตรีมเสียงและวิดีโอระหว่างอุปกรณ์ได้ เป็นจุดที่เราเชื่อมต่อสตรีมที่ได้รับจาก getUserMedia()
ไปยังRTCPeerConnection
สตรีมสื่อประกอบด้วยแทร็กสื่ออย่างน้อย 1 แทร็ก ซึ่งระบบจะเพิ่มลงใน 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
const remoteVideo = document.querySelector('#remoteVideo');
peerConnection.addEventListener('track', async (event) => {
const [remoteStream] = event.streams;
remoteVideo.srcObject = remoteStream;
});