Połączenia równorzędne

RTCPeerConnection to centralny interfejs interfejsu WebRTC API. Reprezentuje połączenie między lokalnym a zdalnym peerem i zawiera wszystkie funkcje oraz zdarzenia potrzebne do ustanowienia połączenia.

Nawiązywanie połączenia równorzędnego

Aplikacje korzystające z funkcji WebRTC zwykle w dużej mierze polegają na interfejsie RTCPeerConnection. Po stronie wywołującego (czyli peera inicjującego połączenie) proces nawiązywania połączenia wygląda zwykle tak:

1. Utwórz nową instancję RTCPeerConnection z odpowiednią konfiguracją ICE.
2. Utwórz lokalny opis SDP za pomocą RTCPeerConnection.createOffer().
3. Ustaw lokalny opis SDP za pomocą parametru RTCPeerConnection.setLocalDescription().
4. Przesyłaj (za pomocą usługi sygnalizacji) lokalny opis SDP do odległego peera.
5. Zarejestruj detektor dla zdarzeń icecandidate w komponencie RTCPeerConnection.
6. W przypadku każdego zdarzenia icecandidate prześlij je (za pomocą usługi sygnalizacji) do odległego peera.
7. Zaczekaj na przychodzący z usługi sygnalizacji opis zdalnego SDP i ustaw go za pomocą RTCPeerConnection.setRemoteDescription().
8. Zaczekaj na przybycie kandydatów ICE z usługi sygnalizacji i dodaj ich za pomocą RTCPeerConnection.addIceCandidate()

W przypadku wywoływanej strony proces przebiega nieco inaczej.

1. Utwórz nową instancję RTCPeerConnection z odpowiednią konfiguracją ICE.
2. Zaczekaj na przychodzący z usługi sygnalizacji opis zdalnego SDP i ustaw go za pomocą RTCPeerConnection.setRemoteDescription().
3. Aby utworzyć odpowiedź na opis zdalnego SDP, wywołaj funkcję RTCPeerConnection.createAnswer().
4. Przesyła (za pomocą usługi sygnalizacyjnej) odpowiedź do odległego urządzenia.
5. Zarejestruj detektor dla zdarzeń icecandidate w komponencie RTCPeerConnection.
6. W przypadku każdego zdarzenia icecandidate prześlij je (za pomocą usługi sygnalizacji) do odległego partnera.
7. Zaczekaj na przybycie kandydatów ICE z usługi sygnalizacji i dodaj ich za pomocą RTCPeerConnection.addIceCandidate()

Problem z tym interfejsem API polega na tym, że większość tych operacji jest asynchronicznych, co często komplikuje implementację aplikacji WebRTC. Wiele funkcji zwraca wartość Promise, która musi zostać rozwiązana, zanim można przejść do następnego kroku procesu.

Podczas implementowania aplikacji korzystającej z tego interfejsu API zalecamy, aby deweloper używał funkcji async i await zamiast rejestrować słuchaczy (za pomocą funkcji Promise.then()), ponieważ dzięki temu kod jest łatwiejszy do odczytania. Rozważ ten przykład:

function createAndSendOffer(peerConnection, signallingService) {
    peerConnection.createOffer()
                  .then(offer => {
                      signallingService.send({
                          type: 'offer',
                          data: offer
                      });
                  });
}

Gdy napiszemy powyższy kod, używając async i await, otrzymamy:

async function createAndSendOffer(peerConnection, signallingService) {
    const offer = await peerConnection.createOffer();
    signallingService.send({
        type: 'offer',
        data: offer
    });
}