Peer-Verbindungen

Die RTCPeerConnection ist die zentrale Schnittstelle in der WebRTC API. Sie stellt die Verbindung zwischen dem lokalen und dem Remote-Peer dar und gibt alle Funktionen und Ereignisse weiter, die zum Herstellen der Verbindung erforderlich sind.

Peer-Verbindung herstellen

Anwendungen, die WebRTC-Funktionen implementieren, benötigen in der Regel stark die RTCPeerConnection-Schnittstelle. Auf der Anruferseite, d. h. der Peer, der eine Verbindung initiiert, beginnt der Prozess zum Herstellen einer Verbindung in der Regel so:

  1. Erstellen Sie eine neue RTCPeerConnection-Instanz mit der entsprechenden ICE-Konfiguration.
  2. Erstellen Sie mit RTCPeerConnection.createOffer() eine lokale SDP-Beschreibung.
  3. Legen Sie die Beschreibung der lokalen SDP mit RTCPeerConnection.setLocalDescription() fest.
  4. Übertragen Sie die lokale SDP-Beschreibung (über einen Signalisierungsdienst) an den Remote-Peer.
  5. Registriere einen Listener für icecandidate-Ereignisse in RTCPeerConnection.
  6. Übertragen Sie die Ereignisse mithilfe von Signalsignalen bei allen icecandidate-Ereignissen an den Remote-Peer.
  7. Warten Sie auf eine eingehende Remote-SDP-Beschreibung aus dem Signaling-Dienst und legen Sie sie mit RTCPeerConnection.setRemoteDescription() fest.
  8. Warten Sie auf eingehende Remote-ICE-Kandidaten aus dem Signalisierungsdienst und fügen Sie sie mit RTCPeerConnection.addIceCandidate() hinzu

Aufseiten des Aufrufers ist der Ablauf etwas anders.

  1. Erstellen Sie eine neue RTCPeerConnection-Instanz mit der entsprechenden ICE-Konfiguration.
  2. Warten Sie auf eine eingehende Remote-SDP-Beschreibung aus dem Signaling-Dienst und legen Sie sie mit RTCPeerConnection.setRemoteDescription() fest.
  3. Erstelle eine Antwort für die Remote-SDP-Beschreibung, indem du RTCPeerConnection.createAnswer() aufrufst.
  4. Überlassen Sie die Antwort mit einem Signalisierungsdienst an den Remote-Peer.
  5. Registriere einen Listener für icecandidate-Ereignisse in RTCPeerConnection.
  6. Übertragen Sie die Ereignisse mithilfe von Signalsignalen bei allen icecandidate-Ereignissen an den Remote-Peer.
  7. Warten Sie auf eingehende Remote-ICE-Kandidaten aus dem Signalisierungsdienst und fügen Sie sie mit RTCPeerConnection.addIceCandidate() hinzu

Die Verwendung einer API besteht darin, dass die meisten dieser Vorgänge asynchron sind. Das macht die eigentliche Implementierung einer WebRTC-Anwendung häufig kompliziert. Viele der Funktionen geben eine Promise zurück, die vor dem nächsten Schritt im Prozess aufgelöst werden muss.

Bei der Implementierung einer App über diese API sollte der Entwickler async und await verwenden, statt Listener (mit Promise.then()) zu registrieren. Das vereinfacht deinen Code. Hier ein Beispiel:

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

Wenn Sie den Code oben mit async und await schreiben, erhalten wir Folgendes:

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