Ejemplo de Dom RTCPeerConnection.addTrack

los RTCPeerConnection método addTrack() agrega una nueva pista multimedia al conjunto de pistas que se transmitirán al otro par.

Nota: Agregar una pista a una conexión desencadena la renegociación al disparar un negotiationneeded evento. Consulte Iniciar negociación en Señalización y videollamadas para obtener más detalles.

Sintaxis

rtpSender = rtcPeerConnection.addTrack(track, stream...);

Parámetros

track

A MediaStreamTrack objeto que representa la pista de medios para agregar a la conexión entre pares.

stream...Opcional

Uno o más locales MediaStream objetos a los que se debe agregar la pista.

El especificado track no necesariamente tiene que ser ya parte de ninguno de los especificados streams. En cambio, el streams son una forma de agrupar pistas en el extremo receptor de la conexión, asegurándose de que estén sincronizadas. Cualquier pista que se agregue a la misma secuencia en el extremo local de la conexión estará en la misma secuencia en el extremo remoto.

Valor devuelto

los RTCRtpSender objeto que se utilizará para transmitir los datos multimedia.

Nota: Cada RTCRtpSender está emparejado con un RTCRtpReceiver para hacer un RTCRtpTransceiver. El receptor asociado está silenciado (lo que indica que no puede entregar paquetes) hasta que el par remoto agregue una o más secuencias al receptor.

Excepciones

InvalidAccessError

La pista especificada (o todas sus transmisiones subyacentes) ya es parte de la RTCPeerConnection.

InvalidStateError

los RTCPeerConnection está cerrado.

Notas de uso

Agregar pistas a múltiples transmisiones

Después de la track parámetro, opcionalmente puede especificar uno o más MediaStream objetos a los que añadir la pista. Solo se envían pistas de un par a otro, no transmisiones. Dado que las transmisiones son específicas para cada par, especificar una o más transmisiones significa que el otro par creará una transmisión correspondiente (o transmisiones) automáticamente en el otro extremo de la conexión, y luego agregará automáticamente la pista recibida a esas transmisiones.

Pistas sin flujo

Si no se especifican transmisiones, la pista se sin corriente. Esto es perfectamente aceptable, aunque dependerá del par remoto decidir en qué secuencia insertar la pista, si corresponde. Esta es una forma muy común de usar addTrack() al crear muchos tipos de aplicaciones simples, donde solo se necesita un flujo. Por ejemplo, si todo lo que está compartiendo con el par remoto es una sola transmisión con una pista de audio y una pista de video, no necesita ocuparse de administrar qué pista está en qué transmisión, por lo que también puede dejar que la el transceptor lo maneja por usted.

Aquí hay un ejemplo que muestra una función que usa getUserMedia() para obtener una transmisión de la cámara y el micrófono de un usuario, luego agrega cada pista de la transmisión a la conexión de pares, sin especificar una transmisión para cada pista:

asyncopenCall(pc)const gumStream =await navigator.mediaDevices.getUserMedia(video:true, audio:true);for(const track of gumStream.getTracks())
    pc.addTrack(track);

El resultado es un conjunto de pistas que se envían al par remoto, sin asociaciones de transmisión. El manejador de la track El evento en el par remoto será responsable de determinar a qué flujo agregar cada pista, incluso si eso significa agregarlos todos al mismo flujo. los ontrack handler podría verse así:

let inboundStream =null;

pc.ontrack=ev=>if(ev.streams && ev.streams[0])
    videoElem.srcObject = ev.streams[0];elseif(!inboundStream)
      inboundStream =newMediaStream();
      videoElem.srcObject = inboundStream;
    inboundStream.addTrack(ev.track);

Aquí el track El controlador de eventos agrega la pista a la primera secuencia especificada por el evento, si se especifica una secuencia. De lo contrario, la primera vez ontrack se llama, se crea una nueva transmisión y se adjunta al elemento de video, y luego la pista se agrega a la nueva transmisión. A partir de ese momento, se agregan nuevas pistas a esa secuencia.

También puede crear una nueva transmisión para cada pista recibida:

pc.ontrack=ev=>if(ev.streams && ev.streams[0])
    videoElem.srcObject = ev.streams[0];elselet inboundStream =newMediaStream(ev.track);
    videoElem.srcObject = inboundStream;

Asociación de pistas con transmisiones específicas

Especificando una secuencia y permitiendo RTCPeerConnection Para crear transmisiones para usted, la infraestructura de WebRTC administra automáticamente las asociaciones de pistas de las transmisiones. Esto incluye cosas como cambios en el transceptor. direction y las pistas se detienen usando removeTrack().

Por ejemplo, considere esta función que una aplicación podría usar para comenzar a transmitir la entrada de la cámara y el micrófono de un dispositivo a través de un RTCPeerConnection a un par remoto:

asyncopenCall(pc)const gumStream =await navigator.mediaDevices.getUserMedia(video:true, audio:true);for(const track of gumStream.getTracks())
    pc.addTrack(track, gumStream);

El par remoto podría entonces usar un track controlador de eventos que se ve así:

pc.ontrack =(streams:[stream]=> videoElem.srcObject = stream;

Esto establece la transmisión actual del elemento de video en la que contiene la pista que se agregó a la conexión.

Remitentes reutilizados

Este método puede devolver un nuevo RTCRtpSender o, en circunstancias muy específicas, un remitente compatible existente que aún no se ha utilizado para transmitir datos. Compatible reutilizable RTCRtpSender instancias cumplen estos criterios:

• Ya no hay ninguna pista asociada con el remitente.
• los RTCRtpTransceiver asociado con el remitente tiene un RTCRtpReceiver cuyo track propiedad especifica una MediaStreamTrack cuyo kind es el mismo que el kind de El track parámetro especificado al llamar RTCPeerConnection.addTrack(). Esto asegura que un transceptor solo maneja audio o video y nunca ambos.
• los RTCRtpTransceiver‘s stopped la propiedad es false.
• los RTCRtpSender ser considerado nunca se ha utilizado para enviar datos. Si el transceptor currentDirection ha estado "sendrecv" o "sendonly", el remitente no se puede reutilizar.

Si se cumplen todos esos criterios, el remitente se reutiliza, lo que da como resultado que estos cambios se produzcan en el RTCRtpSender y es RTCRtpTransceiver:

• los RTCRtpSender‘s track se establece en la pista especificada.
• El conjunto de transmisiones asociadas del remitente se establece en la lista de transmisiones pasadas a este método, stream....
• La asociada RTCRtpTransceiver tiene su currentDirection actualizado para incluir el envío; si su valor actual es "recvonly", se vuelve "sendrecv", y si su valor actual es "inactive", se vuelve "sendonly".

Nuevos remitentes

Si no existe un remitente existente que pueda reutilizarse, se crea uno nuevo. Esto también da como resultado la creación de los objetos asociados que deben existir. El proceso de creación de un nuevo remitente da como resultado estos cambios:

• El nuevo RTCRtpSender se crea con el especificado track y conjunto de stream(s).
• Un nuevo RTCRtpReceiver se crea con un nuevoMediaStreamTrack como su track propiedad (no la pista especificada como parámetro al llamar addTrack()). Esta pista kind está configurado para coincidir con el kind de la pista proporcionada como parámetro de entrada.
• Un nuevo RTCRtpTransceiver se crea y se asocia con el nuevo remitente y receptor.
• El nuevo transceptor direction se establece en "sendrecv".
• El nuevo transceptor se agrega al RTCPeerConnectionconjunto de transceptores.

Ejemplo

Este ejemplo se extrae del código presentado en el artículo Señalización y videollamadas y su código de muestra correspondiente. Viene del handleVideoOfferMsg() allí, que se llama cuando se recibe un mensaje de oferta del par remoto.

var mediaConstraints =
  audio:true,// We want an audio track
  video:true// ...and we want a video track;var desc =newRTCSessionDescription(sdp);

pc.setRemoteDescription(desc).then(function()return navigator.mediaDevices.getUserMedia(mediaConstraints);).then(function(stream)
  previewElement.srcObject = stream;

  stream.getTracks().forEach(track=> pc.addTrack(track, stream));)

Este código toma SDP que se ha recibido del par remoto y construye un nuevo RTCSessionDescription pasar a setRemoteDescription(). Una vez que tiene éxito, usa MediaDevices.getUserMedia() para obtener acceso a la cámara web y al micrófono locales.

Si tiene éxito, el flujo resultante se asigna como fuente para un elemento al que hace referencia la variable previewElement.

El último paso es comenzar a enviar el video local a través de la conexión entre pares a la persona que llama. Esto se hace agregando cada pista en la secuencia iterando sobre la lista devuelta por MediaStream.getTracks() y pasándolos a addTrack() junto con stream del cual son un componente.

Especificaciones

Compatibilidad del navegador

Ver también

• WebRTC
• Introducción al protocolo de transporte en tiempo real (RTP)
• RTCPeerConnection.ontrack
• track