RTCPeerConnection è l'interfaccia centrale dell'API WebRTC. Rappresenta la connessione tra il peer locale e quello remoto e fornisce tutte le funzioni e gli eventi necessari per stabilire la connessione.
Stabilire una connessione peer
Le applicazioni che implementano la funzionalità WebRTC in genere si basano molto sull'interfaccia
RTCPeerConnection. Dal lato del chiamante (ovvero il peer
che avvia una connessione), la procedura per stabilire una connessione è in genere la
seguente:
- Crea una nuova istanza
RTCPeerConnectioncon la configurazione ICE appropriata. - Crea una descrizione SDP locale utilizzando
RTCPeerConnection.createOffer(). - Imposta la descrizione SDP locale utilizzando
RTCPeerConnection.setLocalDescription(). - Trasferisci (utilizzando un servizio di segnalazione) la descrizione SDP locale al peer remoto.
- Registra un listener per gli eventi
icecandidatesuRTCPeerConnection. - Per ogni evento
icecandidate, trasferiscilo (utilizzando un servizio di segnalazione) al peer remoto. - Attendi una descrizione SDP remota in entrata dal servizio di segnalazione e
impostala utilizzando
RTCPeerConnection.setRemoteDescription(). - Attendi i candidati ICE remoti in arrivo dal servizio di segnalazione e aggiungili
utilizzando
RTCPeerConnection.addIceCandidate()
Per il destinatario della chiamata, la procedura è leggermente diversa.
- Crea una nuova istanza
RTCPeerConnectioncon la configurazione ICE appropriata. - Attendi una descrizione SDP remota in entrata dal servizio di segnalazione e
impostala utilizzando
RTCPeerConnection.setRemoteDescription(). - Crea una risposta per la descrizione SDP remota chiamando
RTCPeerConnection.createAnswer(). - Trasferisci (utilizzando un servizio di segnalazione) la risposta al peer remoto.
- Registra un listener per gli eventi
icecandidatesuRTCPeerConnection. - Per ogni evento
icecandidate, trasferiscilo (utilizzando un servizio di segnalazione) al peer remoto. - Attendi i candidati ICE remoti in arrivo dal servizio di segnalazione e aggiungili
utilizzando
RTCPeerConnection.addIceCandidate()
Il problema con questa API è che la maggior parte di queste operazioni sono asincrone,
il che spesso complica l'implementazione effettiva di un'applicazione WebRTC.
Molte delle funzioni restituiscono un Promise che deve essere risolto prima che
possa continuare il passaggio successivo della procedura.
Quando implementi un'applicazione utilizzando questa API, ti consigliamo di utilizzare async e await anziché registrare listener (utilizzando Promise.then()), in quanto ciò rende il codice più facile da seguire. Considera
l'esempio seguente:
function createAndSendOffer(peerConnection, signallingService) {
peerConnection.createOffer()
.then(offer => {
signallingService.send({
type: 'offer',
data: offer
});
});
}
Quando scriviamo il codice precedente utilizzando async e await, otteniamo quanto segue:
async function createAndSendOffer(peerConnection, signallingService) {
const offer = await peerConnection.createOffer();
signallingService.send({
type: 'offer',
data: offer
});
}