RTCPeerConnection
es la interfaz central en la API de WebRTC. Representa la conexión entre el par local y remoto, y proporciona todas las funciones y eventos necesarios para establecer la conexión.
Establecer una conexión entre pares
Las aplicaciones que implementan la funcionalidad WebRTC generalmente dependerán en gran medida de la interfaz RTCPeerConnection
. Desde el lado de las personas que llaman (es decir, el par que inicia una conexión), el proceso para establecer una conexión suele ser el siguiente:
- Cree una nueva instancia de
RTCPeerConnection
con la configuración de ICE adecuada. - Cree una descripción SDP local mediante
RTCPeerConnection.createOffer()
. - Establezca la descripción SDP local mediante
RTCPeerConnection.setLocalDescription()
. - Transfiera (utilizando un servicio de señalización) la descripción SDP local al par remoto.
- Registre un oyente para eventos
icecandidate
enRTCPeerConnection
. - Para cada evento
icecandidate
, transfiéralo (usando un servicio de señalización) al par remoto. - Espere una descripción SDP remota entrante del servicio de señalización y
RTCPeerConnection.setRemoteDescription()
usandoRTCPeerConnection.setRemoteDescription()
. - Espere los candidatos ICE remotos entrantes del servicio de señalización y agréguelos usando
RTCPeerConnection.addIceCandidate()
En el lado del destinatario, el proceso es un poco diferente.
- Cree una nueva instancia de
RTCPeerConnection
con la configuración de ICE adecuada. - Espere una descripción SDP remota entrante del servicio de señalización y
RTCPeerConnection.setRemoteDescription()
usandoRTCPeerConnection.setRemoteDescription()
. - Cree una respuesta para la descripción SDP remota llamando a
RTCPeerConnection.createAnswer()
. - Transferir (mediante un servicio de señalización) la respuesta al par remoto.
- Registre un oyente para eventos
icecandidate
enRTCPeerConnection
. - Para cada evento
icecandidate
, transfiéralo (usando un servicio de señalización) al par remoto. - Espere los candidatos ICE remotos entrantes del servicio de señalización y agréguelos usando
RTCPeerConnection.addIceCandidate()
El desafío con esta API es que la mayoría de estas operaciones son asincrónicas, lo que a menudo complica la implementación real de una aplicación WebRTC. Muchas de las funciones devuelven una Promise
que debe resolverse antes de que pueda continuar el siguiente paso del proceso.
Se recomienda que al implementar una aplicación usando esta API, el desarrollador utilice async
y await
lugar de registrar oyentes (usando Promise.then()
), ya que esto hace que su código sea más fácil de seguir. Considere el siguiente ejemplo:
function createAndSendOffer(peerConnection, signallingService) {
peerConnection.createOffer()
.then(offer => {
signallingService.send({
type: 'offer',
data: offer
});
});
}
Al escribir el código anterior usando async
y await
, obtenemos lo siguiente:
async function createAndSendOffer(peerConnection, signallingService) {
const offer = await peerConnection.createOffer();
signallingService.send({
type: 'offer',
data: offer
});
}