Google si impegna a far progredire equità razziale per le comunità nere. Vedi come.
Questa pagina è stata tradotta dall'API Cloud Translation.
Switch to English

Iniziare con connessioni peer

le connessioni peer è la parte delle specifiche WebRTC che si occupa di collegare due applicazioni su diversi computer di comunicare utilizzando un protocollo peer-to-peer. La comunicazione tra pari può essere video, dati audio o arbitraria binario (per i client che supportano il RTCDataChannel API). Al fine di scoprire come due coetanei in grado di connettersi, sia i clienti devono fornire una configurazione ICE Server. Questo è sia uno STUN o di un turn-server e il loro ruolo è quello di fornire ai candidati di ghiaccio per ogni cliente che viene poi trasferito al peer remoto. Questo trasferimento di candidati ICE è comunemente chiamato segnalazione.

segnalazione

La specifica WebRTC include API per comunicare con un ICE (Internet Connectivity Establishment) Server, ma la componente di segnalazione non è parte di esso. Segnalazione è necessaria per due coetanei a parlare di come si dovrebbe connettersi. Solitamente questo è risolto tramite un normale Web API HTTP-based (cioè, un servizio RIPOSO o altro meccanismo RPC) viene avviato quando applicazioni Web possono inoltrare le informazioni necessarie prima della connessione peer.

Il codice follow frammento di codice mostra come questo servizio di segnalazione fittizio può essere utilizzato per inviare e ricevere messaggi in modo asincrono. Questo verrà utilizzato negli esempi rimanenti della guida ove necessario.

 // Set up an asynchronous communication channel that will be
// used during the peer connection setup
const signalingChannel = new SignalingChannel(remoteClientId);
signalingChannel.addEventListener('message', message => {
    // New message from remote client received
});

// Send an asynchronous message to the remote client
signalingChannel.send('Hello!');
 

Segnalazione può essere implementato in molti modi diversi, e la specifica WebRTC non preferisce una soluzione specifica.

Avvio di connessioni peer

Ogni peer è gestita da un RTCPeerConnection oggetto. Il costruttore di questa classe prende un singolo RTCConfiguration oggetto come parametro. Questo oggetto definisce come la connessione peer è istituito e deve contenere le informazioni sui server di ghiaccio per l'uso.

Una volta che il RTCPeerConnection è stato creato abbiamo bisogno di creare un'offerta SDP o di risposta, a seconda se siamo il peer chiamante o la ricezione di peer. Una volta che l'offerta SDP o risposta viene creato, deve essere inviato al peer remoto attraverso un canale differente. Passando SDP contesta peer remoti è chiamato segnalazione e non è coperto dalla specifica WebRTC.

Per avviare la configurazione della connessione tra pari dal lato chiamando, creiamo un RTCPeerConnection oggetto e quindi chiamare createOffer() per creare un RTCSessionDescription oggetto. Questa descrizione sessione è impostata come la descrizione locale utilizzando setLocalDescription() e viene quindi inviato attraverso il nostro canale di segnalazione al lato ricevente. Abbiamo anche istituito un ascoltatore al nostro canale di segnalazione per quando una risposta alla nostra descrizione della sessione offerto è ricevuto dal lato ricevente.

 async function makeCall() {
    const configuration = {'iceServers': [{'urls': 'stun:stun.l.google.com:19302'}]}
    const peerConnection = new RTCPeerConnection(configuration);
    signalingChannel.addEventListener('message', async message => {
        if (message.answer) {
            const remoteDesc = new RTCSessionDescription(message.answer);
            await peerConnection.setRemoteDescription(remoteDesc);
        }
    });
    const offer = await peerConnection.createOffer();
    await peerConnection.setLocalDescription(offer);
    signalingChannel.send({'offer': offer});
}
 

Sul lato ricevente, ci aspettiamo un'offerta in arrivo prima creiamo la nostra RTCPeerConnection esempio. Una volta fatto ciò abbiamo impostato le offerte ricevute utilizzando setRemoteDescription() . Avanti, che noi chiamiamo createAnswer() per creare una risposta alla offerta ricevuta. Questa risposta è impostato come la descrizione locale utilizzando setLocalDescription() e poi inviato al lato chiamando sul nostro server di segnalazione.

 const peerConnection = new RTCPeerConnection(configuration);
signalingChannel.addEventListener('message', async message => {
    if (message.offer) {
        peerConnection.setRemoteDescription(new RTCSessionDescription(message.offer));
        const answer = await peerConnection.createAnswer();
        await peerConnection.setLocalDescription(answer);
        signalingChannel.send({'answer': answer});
    }
});
 

Una volta che i due coetanei hanno fissato entrambe le sessione descrizioni locali e remoti che conoscono le capacità del peer remoto. Questo non significa che la connessione tra i coetanei è pronto. Per questo lavoro abbiamo bisogno di raccogliere i candidati ghiaccio a ogni peer e il trasferimento (oltre il canale di segnalazione) al altri peer.

candidati ICE

Prima di due coetanei possono communitcate utilizzando WebRTC, hanno bisogno di informazioni di connettività scambio. Poiché le condizioni di rete possono variare dependning su un certo numero di fattori, un servizio esterno è di solito utilizzato per scoprire le possibili candidati per il collegamento ad un peer. Questo servizio si chiama ICE e sta utilizzando uno STUN o un server TURN. STUN acronimo di Session Traversal Utility per NAT, e di solito è usato indirettamente nella maggior parte delle applicazioni WebRTC.

TURNO (Traversal Utilizzando Relay NAT) è la soluzione più avanzata che incorpora i protocolli stordenti e la maggior parte dei servizi basati WebRTC commerciale utilizzano un server TURN per stabilire le connessioni tra coetanei. L'API WebRTC supporta sia STUN e rivolgersi direttamente, ed è raccolto sotto il termine più completo a Internet Connectivity Establishment. Quando si crea un collegamento WebRTC, di solito fornendo uno o più server ICE nella configurazione per l' RTCPeerConnection oggetto.

trickle ICE

Una volta che un RTCPeerConnection si crea oggetto, il quadro di fondo utilizza i server ICE previste per raccogliere i candidati per la connettività stabilimento (candidati ICE). L'evento icegatheringstatechange su RTCPeerConnection segnali in quale stato il raduno ICE è ( new , gathering o complete ).

Mentre è possibile che un peer di aspettare fino a quando la raccolta ICE è completa, di solito è molto più efficiente di utilizzare una tecnica di "ghiaccio trickle" e trasmettere ogni candidato ICE per il peer remoto, come si arriva scoperto. Questo ridurrà notevolmente il tempo di messa a punto per la connettività peer e consentire una videochiamata per iniziare con meno ritardi.

Per raccogliere i candidati ICE, è sufficiente aggiungere un listener per l' icecandidate evento. La RTCPeerConnectionIceEvent emesso su tale ascoltatore conterrà candidate proprietà che rappresenta un nuovo candidato che deve essere inviato al peer remoto (See Signalling).

 // Listen for local ICE candidates on the local RTCPeerConnection
peerConnection.addEventListener('icecandidate', event => {
    if (event.candidate) {
        signalingChannel.send({'new-ice-candidate': event.candidate});
    }
});

// Listen for remote ICE candidates and add them to the local RTCPeerConnection
signalingChannel.addEventListener('message', async message => {
    if (message.iceCandidate) {
        try {
            await peerConnection.addIceCandidate(message.iceCandidate);
        } catch (e) {
            console.error('Error adding received ice candidate', e);
        }
    }
});
 

Connessione stabilita

Una volta che i candidati ICE vengono ricevuti, dovremmo aspettarci lo stato per la nostra connessione peer finirà per cambiare ad uno stato connesso. Per rilevare questo, aggiungiamo un ascoltatore al nostro RTCPeerConnection dove ascoltiamo per connectionstatechange eventi.

 // Listen for connectionstatechange on the local RTCPeerConnection
peerConnection.addEventListener('connectionstatechange', event => {
    if (peerConnection.connectionState === 'connected') {
        // Peers connected!
    }
});
 

RTCPeerConnection documentazione API