O RTCPeerConnection
é a interface central na API WebRTC. Ele representa a conexão entre o ponto local e remoto, e fornece todas as funções e eventos necessários para estabelecer a conexão.
Estabelecendo uma conexão de par
Os aplicativos que implementam a funcionalidade WebRTC geralmente dependem muito da interface RTCPeerConnection
. Do lado do chamador (ou seja, o par iniciando uma conexão), o processo para estabelecer uma conexão é geralmente o seguinte:
- Crie uma nova instância
RTCPeerConnection
com a configuração ICE apropriada. - Crie uma descrição SDP local usando
RTCPeerConnection.createOffer()
. - Defina a descrição SDP local usando
RTCPeerConnection.setLocalDescription()
. - Transfira (usando um serviço de sinalização) a descrição SDP local para o par remoto.
- Registre um ouvinte para eventos
icecandidate
noRTCPeerConnection
. - Para cada evento do
icecandidate
, transfira-o (usando um serviço de sinalização) para o par remoto. - Aguarde uma descrição SDP remota de entrada do serviço de sinalização e defina-a usando
RTCPeerConnection.setRemoteDescription()
. - Aguarde a entrada de candidatos ICE remotos do serviço de sinalização e adicione-os usando
RTCPeerConnection.addIceCandidate()
No lado do receptor, o processo é ligeiramente diferente.
- Crie uma nova instância
RTCPeerConnection
com a configuração ICE apropriada. - Aguarde uma descrição SDP remota de entrada do serviço de sinalização e defina-a usando
RTCPeerConnection.setRemoteDescription()
. - Crie uma resposta para a descrição SDP remota chamando
RTCPeerConnection.createAnswer()
. - Transfira (usando um serviço de sinalização) a resposta para o par remoto.
- Registre um ouvinte para eventos
icecandidate
noRTCPeerConnection
. - Para cada evento do
icecandidate
, transfira-o (usando um serviço de sinalização) para o par remoto. - Aguarde a entrada de candidatos ICE remotos do serviço de sinalização e adicione-os usando
RTCPeerConnection.addIceCandidate()
O desafio dessa API é que a maioria dessas operações é assíncrona, o que muitas vezes torna a implementação real de um aplicativo WebRTC complicada. Muitas das funções retornam uma Promise
que deve ser resolvida antes que a próxima etapa do processo possa continuar.
Recomenda-se que ao implementar um aplicativo usando esta API, o uso desenvolvedor marca de async
e await
em vez de registrar ouvintes (usando Promise.then()
), pois isso torna o código mais fácil de seguir. Considere o seguinte exemplo:
function createAndSendOffer(peerConnection, signallingService) {
peerConnection.createOffer()
.then(offer => {
signallingService.send({
type: 'offer',
data: offer
});
});
}
Ao escrever o código acima usando async
e await
, obtemos o seguinte:
async function createAndSendOffer(peerConnection, signallingService) {
const offer = await peerConnection.createOffer();
signallingService.send({
type: 'offer',
data: offer
});
}