Captura de medios y restricciones

La parte de medios de WebRTC abarca cómo acceder al hardware capaz de capturar video y audio, como cámaras y micrófonos, así como el funcionamiento de los flujos de medios. También abarca los medios de visualización, que es la forma en que una aplicación puede capturar la pantalla.

Dispositivos de medios

Se accede a todas las cámaras y micrófonos compatibles con el navegador y se administran a través del objeto navigator.mediaDevices. Las aplicaciones pueden recuperar la lista actual de dispositivos conectados y también detectar cambios, ya que muchas cámaras y micrófonos se conectan a través de USB y se pueden conectar y desconectar durante el ciclo de vida de la aplicación. Dado que el estado de un dispositivo multimedia puede cambiar en cualquier momento, se recomienda que las aplicaciones se registren para recibir notificaciones sobre los cambios en el dispositivo y, así, controlarlos correctamente.

Limitaciones

Cuando accedas a dispositivos multimedia, es una buena práctica proporcionar restricciones lo más detalladas posible. Si bien es posible abrir la cámara y el micrófono predeterminados con una restricción simple, es posible que se proporcione una transmisión de medios que esté lejos de ser la más óptima para la aplicación.

Las restricciones específicas se definen en un objeto MediaTrackConstraint, uno para el audio y otro para el video. Los atributos de este objeto son de tipo ConstraintLong, ConstraintBoolean, ConstraintDouble o ConstraintDOMString. Pueden ser un valor específico (p.ej., un número, un valor booleano o una cadena), un rango (LongRange o DoubleRange con un valor mínimo y máximo) o un objeto con una definición de ideal o exact. Para un valor específico, el navegador intentará elegir algo lo más cercano posible. En el caso de un rango, se usará el mejor valor de ese rango. Cuando se especifica exact, solo se devuelven los flujos de medios que coinciden exactamente con esa restricción.

Cerca

// Camera with a resolution as close to 640x480 as possible
{
    "video": {
        "width": 640,
        "height": 480
    }
}

Rango

// Camera with a resolution in the range 640x480 to 1024x768
{
    "video": {
        "width": {
            "min": 640,
            "max": 1024
        },
        "height": {
            "min": 480,
            "max": 768
        }
    }
}

Exacta

// Camera with the exact resolution of 1024x768
{
    "video": {
        "width": {
            "exact": 1024
        },
        "height": {
            "exact": 768
        }
    }
}

Para determinar la configuración real que tiene un determinado segmento de una transmisión de medios, podemos llamar a MediaStreamTrack.getSettings(), que devuelve el objeto MediaTrackSettings aplicado actualmente.

También es posible actualizar las restricciones de un segmento llamando a applyConstraints() en el segmento de un dispositivo multimedia que abrimos. Esto permite que una aplicación vuelva a configurar un dispositivo multimedia sin tener que cerrar primero la transmisión existente.

Mostrar contenido multimedia

Una aplicación que quiera poder realizar capturas y grabaciones de pantalla debe usar la API de Display Media. La función getDisplayMedia() (que forma parte de navigator.mediaDevices) es similar a getUserMedia() y se usa para abrir el contenido de la pantalla (o una parte de ella, como una ventana). El MediaStream que se devuelve funciona de la misma manera que cuando se usa getUserMedia().

Las restricciones para getDisplayMedia() difieren de las que se usan para la entrada de audio o video normal.

{
    video: {
        cursor: 'always' | 'motion' | 'never',
        displaySurface: 'application' | 'browser' | 'monitor' | 'window'
    }
}

En el fragmento de código anterior, se muestra cómo funcionan las restricciones especiales para la grabación de pantalla. Ten en cuenta que es posible que no todos los navegadores que admiten medios de visualización sean compatibles con estos formatos.

Transmisiones y pistas

Un objeto MediaStream representa un flujo de contenido multimedia, que consta de pistas (MediaStreamTrack) de audio y video. Puedes recuperar todos los segmentos de MediaStream llamando a MediaStream.getTracks(), que devuelve un array de objetos MediaStreamTrack.

MediaStreamTrack

Un objeto MediaStreamTrack tiene una propiedad kind que es audio o video, lo que indica el tipo de medio que representa. Puedes silenciar cada pista activando o desactivando su propiedad enabled. Un segmento tiene una propiedad booleana remote que indica si proviene de un objeto RTCPeerConnection y de un par remoto.