Questions tagged [getusermedia]

Access to media data streams--webcam video, microphone audio--from browser Javascript. Abbreviated gUM

getUserMedia provides access to data streams from media devices such as webcams and microphones. It is used from Javascript running in a user's web browser. It supports the development of front-end web application code for capturing media.

Support varies from browser to browser and device to device. See CanIUse.com for up-to-date information.

getUserMedia forms part of browser-resident WebRTC support (see ). It can be used by itself without establishing WebRTC connections.

getUserMedia is often abbreviated gUM. It's often used in conjunction with MediaRecorder; see .

Further references:

See also:

1098 questions
8
votes
1 answer

chrome.desktopCapture - can't record both system audio and microphone?

I've built a Chrome extension that captures screen activity and microphone input and outputs a video file. Since chrome.desktopCapture can't record audio input alongside screen capture, I'm getting the mic in its own, separate stream. So: //get…
8
votes
2 answers

Webcam Light Stays on Even After I run MediaStreamTrack.stop()

I am building a react app and need to access the webcam which get with the following code: navigator.mediaDevices.getUserMedia({ video: true, audio: false }) .then(function(stream) { video.srcObject = stream; window.localstream =…
pengcheng95
  • 292
  • 4
  • 13
8
votes
1 answer

Empty microphone data using Crosswalk in Ionic 2 application

In my Ionic 2 application, I use the WebAudio API to record audio (based on https://github.com/mattdiamond/Recorderjs). This is working on Chrome and, after putting the right permissions in AndroidManifest.xml:
dndr
  • 2,319
  • 5
  • 18
  • 28
8
votes
2 answers

Use getUserMedia with ionic get only black screen

Im testing some media features with ionic and im stuck while trying to set the camera output into a video tag using getUserMedia using this code: navigator.getUserMedia = navigator.getUserMedia || navigator.webkitGetUserMedia…
Vanojx1
  • 5,574
  • 2
  • 23
  • 37
8
votes
1 answer

Browser web cam stream has extremely low performance/frame rate

I am trying to test WebRTC and want to display my own stream as well as the peer's stream. I currently have a simple shim to obtain the camera's stream and pipe that into a video element, however the frame rate is extremely low. The rare thing about…
naughty boy
  • 2,089
  • 3
  • 18
  • 28
8
votes
1 answer

JS Get image directly from video stream as data url

How would I go directly from video capture to a data url in javascript? I want to display the image to the user as a resized version, but keep the full size image available. So, how would I do this? var PhotoBooth = { onMediaStream:…
HSchmale
  • 1,838
  • 2
  • 21
  • 48
8
votes
1 answer

How do I get audio data from microphone using AudioContext HTML5

I'm trying to get a stream of data from my microphone (ex. volume, pitch). For now, I've been using getUserMedia to access my microphone audio. But I couldn't find a way to extract the data from it. My code : $(function () { var audioContext = new…
DennisL
  • 157
  • 1
  • 2
  • 7
8
votes
1 answer

Modernizr getusermedia undefined

I am confused why Modernizr.getusermedia is undefined, but when I type in !!navigator.webkitGetUserMedia it returns true. I am using Chrome and I know webrtc is supported... so why does Modernizr say its undefined. The Modernizr that I downloaded…
Jupiter
  • 238
  • 1
  • 2
  • 11
7
votes
2 answers

cannot read property 'getusermedia' of undefined over https

I have a react application that should record audio from microphone and send it to a backend. The microphone input is implemented with navigator.mediaDevices.getUserMedia. The page runs perfectly over localhost and from other devices in my wifi…
guzgftt
  • 83
  • 1
  • 1
  • 4
7
votes
0 answers

Changing FocusMode not working using MediaStream API in Google Chrome

In Google Chrome Browser i was able to get live feed of my connected USB Camera using getUserMedia() API. I have a slider to change the brightness value and this is working fine. I also want focusMode to toggle from continuous to manual(The camera…
vgokul129
  • 777
  • 12
  • 31
7
votes
1 answer

Why the difference in native camera resolution -vs- getUserMedia on iPad / iOS?

I've built this web app for iPads that uses getUserMedia and streams the resulting video through to a video element on a website. The model I'm using is an iPad Air with a rear-camera resolution of 1936x2592. Currently the constraints for the…
aschmelyun
  • 93
  • 1
  • 9
7
votes
2 answers

Firefox - mediaDevices.getUserMedia throws AbortError

I get the following error in firefox (no problems in Chrome / Edge / Safari): MediaStreamError { name: "AbortError", message: "Starting video failed", constraint: "", stack: "" } Browser console only shows < unavailable > when this error is…
Benjamin
  • 147
  • 1
  • 9
7
votes
1 answer

iOS 11.3 Camera access via getUserMedia and black screens

Now that iOS 11.3 is out with the updated version of Safari. Has anybody been able to successfully use the getUserMedia APIs to display the camera output onto a canvas? e.g We've opened both https://simpl.info/getusermedia/ and…
owenmelbz
  • 6,180
  • 16
  • 63
  • 113
7
votes
1 answer

Google Chrome not showing microphone permission prompt

I have a web application that uses the microphone for WebRTC through getUserMedia. I currently have this application running on multiple subdomains, like test.example.com, staging.example.com, production.example.com, etc. On most of them, it works…
Moshe Katz
  • 15,992
  • 7
  • 69
  • 116
7
votes
1 answer

How to force a 16:9 ratio with getUserMedia on all devices?

I need to use getUserMedia while the video is set to record in 16:9 resolution. My code works on most desktops and on Android 7 and above: navigator.getUserMedia( { audio: true, video: { mandatory: { minWidth: 380, …
Koby Douek
  • 16,156
  • 19
  • 74
  • 103