MediaDevices
Baseline
Widely available
*
Cette fonctionnalité est bien établie et fonctionne sur de nombreux appareils et versions de navigateurs. Elle est disponible sur tous les navigateurs depuis septembre 2017.
* Certaines parties de cette fonctionnalité peuvent bénéficier de prise en charge variables.
L'interface MediaDevices permet d'accéder aux périphériques média d'entrée tels que les caméras, micros, mais aussi le partage d'écran. Autrement dit, elle fournit un accès à toute source matérielle de données média.
Propriétés des instances
Hérite des propriétés de son interface parente, EventTarget.
Méthodes des instances
Hérite des méthodes de son interface parente, EventTarget.
enumerateDevices()-
Fournit un tableau d'informations sur les appareils média (en entrée et en sortie) disponibles sur le système.
getSupportedConstraints()-
Renvoie un objet dont le format respecte
MediaTrackSupportedConstraintset qui indique les propriétés contraintes qui sont prises en charge par l'interfaceMediaStreamTrack. Voir l'API Media Streams pour en savoir plus à propos des contraintes et leur utilisation. getDisplayMedia()-
Demande à la personne de sélectionner un affichage ou une portion d'un affichage (par exemple une fenêtre) pour le/la capturer comme
MediaStreamà des fins de partage ou d'enregistrement. Cette méthode renvoie une promesse qui se résout enMediaStream. getUserMedia()-
Après avoir demandé la permission à la personne, active la caméra ou le micro du système et fournit un flux
MediaStreamcontenant une piste vidéo et/ou audio correspondante. selectedAudioOutput()Expérimental-
Demande à la personne de sélectionner un appareil de sortie audio en particulier.
Évènements
devicechange-
Déclenché lorsqu'un média d'entrée ou de sortie de l'appareil est connecté ou débranché de l'ordinateur de la personne.
Exemple
// On place ces variables dans la portée globale afin d'y avoir
// accès dans la console du navigateur.
const video = document.querySelector("video");
const constraints = {
audio: false,
video: true,
};
navigator.mediaDevices
.getUserMedia(constraints)
.then((stream) => {
const videoTracks = stream.getVideoTracks();
console.log("Flux obtenu avec des contraintes :", constraints);
console.log(`Utilisation de l'appareil vidéo : ${videoTracks[0].label}`);
stream.onremovetrack = () => {
console.log("Flux terminé");
};
video.srcObject = stream;
})
.catch((error) => {
if (error.name === "ConstraintNotSatisfiedError") {
console.error(
`La résolution ${constraints.video.width.exact}x${constraints.video.height.exact} px n'est pas prise en charge par votre appareil.`,
);
} else if (error.name === "PermissionDeniedError") {
console.error(
"Les permissions nécessaires pour utiliser votre caméra ou votre micro " +
"n'ont pas été fournies. Vous devez autoriser l'accès à vos appareils " +
"depuis cette page afin que la démonstration fonctionne.",
);
} else {
console.error(`Erreur getUserMedia : ${error.name}`, error);
}
});
Spécifications
| Specification |
|---|
| Media Capture and Streams # mediadevices |
Compatibilité des navigateurs
Chargement…
Voir aussi
- L'API de capture et des flux multimédia : l'API à laquelle appartient cette interface.
- L'API de capture d'écran : l'API qui définit la méthode
getDisplayMedia(). - L'API WebRTC
Navigator.mediaDevicesqui fournit une référence à un objetMediaDevicespermettant d'accéder aux appareils.