Capture et contraintes liées à l'élément multimédia

La partie média de WebRTC couvre l'accès au matériel capable de capturer des vidéos et de l'audio, comme les caméras et les micros, ainsi que le fonctionnement des flux multimédias. Il couvre également les supports d'affichage, qui permettent à une application de capturer l'écran.

Périphériques multimédias

Tous les appareils photo et micros compatibles avec le navigateur sont accessibles et gérés via l'objet navigator.mediaDevices. Les applications peuvent récupérer la liste actuelle des appareils connectés et écouter les modifications, car de nombreuses caméras et de nombreux micros se connectent via USB et peuvent être connectés et déconnectés pendant le cycle de vie de l'application. Étant donné que l'état d'un appareil multimédia peut changer à tout moment, il est recommandé aux applications de s'enregistrer pour les modifications apportées aux appareils afin de les gérer correctement.

Contraintes

Lorsque vous accédez à des périphériques multimédias, il est recommandé de fournir des contraintes aussi détaillées que possible. Bien qu'il soit possible d'ouvrir l'appareil photo et le micro par défaut avec une simple contrainte, le flux multimédia obtenu peut être loin d'être optimal pour l'application.

Les contraintes spécifiques sont définies dans un objet MediaTrackConstraint, un pour l'audio et un pour la vidéo. Les attributs de cet objet sont de type ConstraintLong, ConstraintBoolean, ConstraintDouble ou ConstraintDOMString. Il peut s'agir d'une valeur spécifique (par exemple, un nombre, une valeur booléenne ou une chaîne), d'une plage (LongRange ou DoubleRange avec une valeur minimale et maximale) ou d'un objet avec une définition ideal ou exact. Pour une valeur spécifique, le navigateur tentera de choisir une valeur aussi proche que possible. Pour une plage, la meilleure valeur de cette plage sera utilisée. Lorsque exact est spécifié, seuls les flux multimédias qui correspondent exactement à cette contrainte sont renvoyés.

Near

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

Plage

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

Mot clé exact

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

Pour déterminer la configuration réelle d'une piste spécifique d'un flux multimédia, nous pouvons appeler MediaStreamTrack.getSettings(), qui renvoie le MediaTrackSettings actuellement appliqué.

Il est également possible de mettre à jour les contraintes d'une piste à partir d'un appareil multimédia que nous avons ouvert, en appelant applyConstraints() sur la piste. Cela permet à une application de reconfigurer un appareil multimédia sans avoir à fermer le flux existant au préalable.

Afficher les contenus multimédias

Une application qui souhaite pouvoir capturer et enregistrer l'écran doit utiliser l'API Display Media. La fonction getDisplayMedia() (qui fait partie de navigator.mediaDevices) est semblable à getUserMedia() et est utilisée pour ouvrir le contenu de l'écran (ou une partie de celui-ci, comme une fenêtre). Le MediaStream renvoyé fonctionne de la même manière que lorsque vous utilisez getUserMedia().

Les contraintes pour getDisplayMedia() diffèrent de celles utilisées pour les entrées vidéo ou audio classiques.

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

L'extrait de code ci-dessus montre comment fonctionnent les contraintes spéciales pour l'enregistrement d'écran. Notez que ces formats ne sont pas forcément compatibles avec tous les navigateurs qui acceptent les supports d'affichage.

Flux et titres

Un MediaStream représente un flux de contenu multimédia, qui se compose de pistes (MediaStreamTrack) audio et vidéo. Vous pouvez récupérer toutes les pistes de MediaStream en appelant MediaStream.getTracks(), qui renvoie un tableau d'objets MediaStreamTrack.

MediaStreamTrack

Un MediaStreamTrack possède une propriété kind qui est soit audio, soit video, indiquant le type de contenu multimédia qu'il représente. Chaque piste peut être mise en sourdine en activant ou désactivant sa propriété enabled. Une piste possède une propriété booléenne remote qui indique si elle provient d'un RTCPeerConnection et d'un pair distant.