Chrome: navigator.mediaDevices.getUserMedia is not a function

Question

I\'m on localhost and trying to use the MediaDevices.getUserMedia method in Chrome. I receive the error as titled. I understand that in Chrome it is only possible to use thi

Answer 1

I too had the same problem in my chrome browser. first check your phone is supported by testing it in https://test.webrtc.org/

if your phone passes all the cases, then check step 2

step 2: If your hosting a webpage or running a third party webpage,see whether camera permissions are enabled on your phone.

Also the main issue is WEBRTC is not supported in HTTP site and it is supported only in HTTPS site

This is the https site which allows web This is the http site which gives a error

Answer 2

On some latest browsers navigator.getUserMedia does not perform well. So, try using navigator.mediaDevices.getUserMedia. Or, better you check if navigator.mediaDevices.getUserMedia is available for the browser use navigator.mediaDevices.getUserMedia or else use navigator.getUserMedia.

navigator.getWebcam = (navigator.getUserMedia || navigator.webKitGetUserMedia || navigator.moxGetUserMedia || navigator.mozGetUserMedia || navigator.msGetUserMedia);
if (navigator.mediaDevices.getUserMedia) {
    navigator.mediaDevices.getUserMedia({  audio: true, video: true })
    .then(function (stream) {
                  //Display the video stream in the video object
     })
     .catch(function (e) { logError(e.name + ": " + e.message); });
}
else {
navigator.getWebcam({ audio: true, video: true }, 
     function (stream) {
             //Display the video stream in the video object
     }, 
     function () { logError("Web cam is not accessible."); });
}

Hope this will solve your problem.

Answer 3

Have you tried to include adapter.js polyfill ? Check this page : https://developer.mozilla.org/en-US/docs/Web/API/MediaDevices/getUserMedia#Browser_compatibility

It looks like this or enabling chrome://flags/#enable-experimental-web-platform-features as per @Simon Malone's note, is needed for Chrome.

Answer 4

I was having this problem too and changing flags didn't seem to work. I came across this chrome extension — Web Server for Chrome in Google's WebRTC tutorial which seemed to do the trick.

Answer 5

I got stuck in the same issue. One solution is to follow and download the extension Web Server for Chrome shared in the comment above by @ellerynz, or

if you have python installed you could also do

python -m SimpleHTTPServer [port]

After you hit enter, you should see the following message:

Serving HTTP on 0.0.0.0 port 8000 ...

Open the browser and put

http://127.0.0.1:[port]

Answer 6

Use navigator.getUserMedia() instead.

navigator.getUserMedia(constraints, successCallback, errorCallback);