Pierwsze kroki ze zdalnymi transmisjami

Po połączeniu urządzenia RTCPeerConnection ze zdalnym urządzeniem równorzędnym możliwe jest strumieniowe przesyłanie dźwięku i wideo między nimi. To jest punkt, w którym łączymy strumień od getUserMedia() do RTCPeerConnection. Strumień multimediów składa się z co najmniej 1 ścieżki i jest dodawany do RTCPeerConnection osobno, gdy chcemy przesłać multimedia do zdalnego węzła równorzędnego.

const localStream = await getUserMedia({video: true, audio: true});
const peerConnection = new RTCPeerConnection(iceConfig);
localStream.getTracks().forEach(track => {
    peerConnection.addTrack(track, localStream);
});

Ścieżki można dodać do sieci RTCPeerConnection, zanim zostanie ona połączona z urządzeniem zdalnym. Dlatego warto przeprowadzić konfigurację jak najwcześniej, zamiast czekać na zakończenie połączenia.

Dodawanie ścieżek zdalnych

Aby odebrać ścieżki zdalne dodane przez drugiego peera, rejestrujemy na miejscowym urządzeniu RTCPeerConnection nasłuchiwanie zdarzenia track. RTCTrackEvent zawiera tablica obiektów MediaStream z tymi samymi wartościami MediaStream.id co równorzędne strumienie. W naszym przykładzie każda ścieżka jest powiązana tylko z jednym strumieniem.

Pamiętaj, że chociaż identyfikatory MediaStream są po obu stronach połączenia równorzędnego, w przypadku identyfikatorów MediaStreamTrack zasadniczo nie jest to samo.

const remoteVideo = document.querySelector('#remoteVideo');

peerConnection.addEventListener('track', async (event) => {
    const [remoteStream] = event.streams;
    remoteVideo.srcObject = remoteStream;
});