1. Web
  2. Les API Web
  3. Navigator
  4. Navigator.getUserMedia()

Cette page a été traduite à partir de l'anglais par la communauté. Vous pouvez contribuer en rejoignant la communauté francophone sur MDN Web Docs.

View in English Always switch to English

Navigator.getUserMedia()

Obsolète: Cette fonctionnalité n'est plus recommandée. Même si certains navigateurs la prennent encore en charge, elle a peut-être déjà été supprimée des standards du web, est en passe d'être supprimée ou n'est conservée qu'à des fins de compatibilité. Évitez de l'utiliser et mettez à jour le code existant si possible ; consultez le tableau de compatibilité au bas de cette page pour vous aider à prendre votre décision. Sachez que cette fonctionnalité peut cesser de fonctionner à tout moment.

La méthode obsolète Navigator.getUserMedia() demande à la personne la permission d'utiliser une entrée vidéo (par exemple une caméra ou un écran partagé) et une entrée audio (par exemple un microphone) comme source pour un flux média (MediaStream).

Si la permission est accordée, un objet MediaStream dont les pistes proviennent de ces appareils est transmis à la fonction de rappel. Si la permission est refusée, que le périphérique n'existe pas, ou qu'une erreur quelconque se produit, c'est la fonction de rappel d'erreur qui est exécutée, avec comme paramètre un objet MediaStreamError qui décrit l'erreur qui vient de se produire. Si l'utilisatrice ou l'utilisateur ne fait aucun choix, aucune des deux fonctions de rappel n'est exécutée.

Note : Il s'agit d'une méthode historique, veuillez utiliser la méthode navigator.mediaDevices.getUserMedia() à la place. Bien qu'elle ne soit pas techniquement obsolète, l'utilisation de fonctions de rappels pour celle-ci est indiqué comme obsolète dans la spécification qui encourage l'utilisation de la nouvelle version utilisant les promesses.

Syntaxe

js
navigator.getUserMedia(constraints, successCallback, errorCallback);

Paramètres

constraints

Un objet spécifiant les types de médias à récupérer, ainsi que les contraintes pour chaque type de média. Pour plus de détails, voir la section contraintes de la méthode MediaDevices.getUserMedia(), ainsi que l'article Capacités, constraintes, et configurations.

successCallback

Une fonction qui est invoquée lorsque la demande d'accès aux entrées média est acceptée. Cette fonction est appelée avec un paramètre : l'objet MediaStream qui contient les flux de médias. La fonction de rappel peut alors affecter le flux à l'objet souhaité (par exemple un élément <audio> ou <video>), comme dans l'exemple suivant :

js
function(stream) {
   var video = document.querySelector('video');
   video.src = window.URL.createObjectURL(stream);
   video.onloadedmetadata = function(e) {
      // Faire quelque chose avec la vidéo.
   };
}
errorCallback

Lorsque l'appel échoue, la fonction indiquée par cet argument est appelée, avec comme seul paramètre l'objet MediaStreamError. Cet objet ressemble à DOMException.

Valeur de retour

undefined.

Exemples

Largeur et hauteur

Voici un exemple d'utilisation de getUserMedia() qui contient notamment les techniques pour gérer la compatibilité avec les différents préfixes des navigateurs. On notera bien que ce qui suit correspond à la façon déconseillée de procéder. Consultez ces exemples de la page MediaDevices.getUserMedia() pour de meilleures pratiques.

js
navigator.getUserMedia =
  navigator.getUserMedia ||
  navigator.webkitGetUserMedia ||
  navigator.mozGetUserMedia;

if (navigator.getUserMedia) {
  navigator.getUserMedia(
    { audio: true, video: { width: 1280, height: 720 } },
    function (stream) {
      var video = document.querySelector("video");
      video.src = window.URL.createObjectURL(stream);
      video.onloadedmetadata = function (e) {
        video.play();
      };
    },
    function (err) {
      console.log("L'erreur suivante s'est produite : " + err.name);
    },
  );
} else {
  console.log("getUserMedia n'est pas pris en charge");
}

Permissions

Pour utiliser getUserMedia() dans une application installable, vous devez spécifier un ou plusieurs des champs suivants dans le fichier de manifeste.

js
"permissions": {
  "audio-capture": {
    "description": "Required to capture audio using getUserMedia()"
  },
  "video-capture": {
    "description": "Required to capture video using getUserMedia()"
  }
}

Voir permission: audio-capture et permission: video-capture pour plus d'informations.

Compatibilité des navigateurs

Attention : Du nouveau code devrait utiliser MediaDevices.getUserMedia() à la place.

Voir aussi

Help improve MDN

Learn how to contribute

Cette page a été modifiée le par les contributeurs du MDN.

View this page on GitHub • Report a problem with this content