Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.
The MediaDevices
.getUserMedia()
method prompts the user for permission to use a media input which produces a MediaStream
with tracks containing the requested types of media.
That stream can include, for example, a video track (produced by either a hardware or virtual video source such as a camera, video recording device, screen sharing service, and so forth), an audio track (similarly, produced by a physical or virtual audio source like a microphone, A/D converter, or the like), and possibly other track types.
It returns a Promise
that resolves to a MediaStream
object. If the user denies permission, or matching media is not available, then the promise is rejected with NotAllowedError
or NotFoundError
DOMException
respectively.
Note: It's possible for the returned promise to neither resolve nor reject, as the user is not required to make a choice at all and may ignore the request.
Generally, you will access the MediaDevices
singleton object using navigator.mediaDevices
, like this:
async function getMedia(constraints) { let stream = null; try { stream = await navigator.mediaDevices.getUserMedia(constraints); /* use the stream */ } catch(err) { /* handle the error */ } }
Similarly, using the raw promises directly, the code looks like this:
navigator.mediaDevices.getUserMedia(constraints) .then(function(stream) { /* use the stream */ }) .catch(function(err) { /* handle the error */ });
Note: If the current document isn't loaded securely, navigator.mediaDevices
will be undefined
, and you cannot use getUserMedia()
. See Security for more information on this and other security issues related to using getUserMedia()
.