los MediaDevices La interfaz proporciona acceso a dispositivos de entrada de medios conectados, como cámaras y micrófonos, así como para compartir la pantalla. En esencia, le permite obtener acceso a cualquier fuente de hardware de datos multimedia.

Propiedades

Hereda propiedades de su interfaz principal, EventTarget.

Eventos

devicechange
Se activa cuando un dispositivo de entrada o salida de medios está conectado o retirado de la computadora del usuario.
También disponible a través de ondevicechange propiedad.

Métodos

Hereda métodos de su interfaz principal, EventTarget.

enumerateDevices()
Obtiene un array de información sobre los dispositivos de entrada y salida de medios disponibles en el sistema.
getSupportedConstraints()
Devuelve un objeto conforme a MediaTrackSupportedConstraints que indica qué propiedades restringibles se admiten en el MediaStreamTrack interfaz. Consulte Capacidades y restricciones en Media Capture y Streams API (Media Stream) para obtener más información sobre las restricciones y cómo usarlas.
getDisplayMedia()
Solicita al usuario que seleccione una pantalla o parte de una pantalla (como una ventana) para capturar como MediaStream para compartir o grabar. Devuelve una promesa que se resuelve en un MediaStream.
getUserMedia()
Con el permiso del usuario a través de un mensaje, enciende una cámara y / o un micrófono en el sistema y proporciona un MediaStream que contiene una pista de vídeo y / o una pista de audio con la entrada.

Ejemplo

'use strict';// Put variables in global scope to make them available to the browser console.var video = document.querySelector('video');var constraints = window.constraints =
  audio:false,
  video:true;var errorElement = document.querySelector('#errorMsg');

navigator.mediaDevices.getUserMedia(constraints).then(function(stream)var videoTracks = stream.getVideoTracks();
  console.log('Got stream with constraints:', constraints);
  console.log('Using video device: '+ videoTracks[0].label);
  stream.onremovetrack=function()
    console.log('Stream ended');;
  window.stream = stream;// make variable available to browser console
  video.srcObject = stream;).catch(function(error)if(error.name ==='ConstraintNotSatisfiedError')errorMsg('The resolution '+ constraints.video.width.exact +'x'+
        constraints.video.height.exact +' px is not supported by your device.');elseif(error.name ==='PermissionDeniedError')errorMsg('Permissions have not been granted to use your camera and '+'microphone, you need to allow the page access to your devices in '+'order for the demo to work.');errorMsg('getUserMedia error: '+ error.name, error););functionerrorMsg(msg, error)
  errorElement.innerHTML +='

'+ msg +'

'
;if(typeof error !=='undefined') console.error(error);

Especificaciones

Especificación Estado Comentario
Captura de medios y transmisiones
La definición de ‘MediaDevices’ en esa especificación.
Recomendación candidata Definición inicial

Compatibilidad del navegador

Escritorio Móvil
Cromo Borde Firefox explorador de Internet Ópera Safari WebView Android Chrome Android Firefox para Android Opera Android Safari en IOS Internet de Samsung
MediaDevices 47 12 33 No 30 11 47 47 36 30 11 5,0
devicechange_event 57 12 52 No 34 11 No No ? 43 11 No
enumerateDevices 47 12 3963 Antes de Firefox 63, enumerateDevices() solo devolvió los dispositivos de entrada. A partir de Firefox 63, los dispositivos de salida también se incluyen si el media.setsinkid.enabled la preferencia está habilitada. No 34 11 47 47 3963 Antes de Firefox 63, enumerateDevices() solo devolvió los dispositivos de entrada. A partir de Firefox 63, los dispositivos de salida también se incluyen si el media.setsinkid.enabled la preferencia está habilitada. 34 11 5,0
getDisplayMedia 72 7917 Disponible como miembro de Navigator en lugar de MediaDevices. 6633-66 Desde Firefox 33 puede capturar datos de la pantalla usando getUserMedia(), con un video restricción llamada mediaSource. Antes de 52 se basaba en una lista de sitios permitidos configurable por el cliente. No 60 13 NoAPI está disponible, pero siempre fallará con NotAllowedError. No NoAPI está disponible, pero siempre fallará con NotAllowedError. No No No
getSupportedConstraints 53 12 44 No 40 11 53 52 50 41 11 6.0
getUserMedia 53 Si necesita esta capacidad antes de la versión 53, consulte navigator.webkitGetUserMedia, una forma prefijada de la obsoleta navigator.getUserMedia API. 12 36[“If you need this capability before version 36, refer to navigator.mozGetUserMedia, a prefixed form of the deprecated navigator.getUserMedia API.”, “Before Firefox 55, getUserMedia() incorrectly returns NotSupportedError when the list of constraints specified is empty, or has all constraints set to false. Starting in Firefox 55, this situation now correctly calls the failure handler with a TypeError.”, “When using the Firefox-specific video constraint called mediaSource to request display capture, Firefox 66 and later consider values of screen and window to both cause a list of screens and windows to be shown.”, “Starting in Firefox 66, getUserMedia() can no longer be used in sandboxed