getUserMedia() not supported in chrome

Question

I am trying to access my webcam using the getUserMedia() using my own website that run using my own ip address.

it was working fine until i tried my website again. i

Answer 1

I am not sure if this exactly solves your problem. However, it might be helpful to someone who is struggling to have getUserMedia() in a working state.

I came across a medium link that helped me solve this issue.

Go to : chrome://flags/#unsafely-treat-insecure-origin-as-secure

Enable the option.

Also, there will be a checkbox provided below. Use that to provide the link to your HTTP server.

Referr to this image for better clarity

Provide the port number too. (In my case it is 8000)

Source: https://medium.com/@Carmichaelize/enabling-the-microphone-camera-in-chrome-for-local-unsecure-origins-9c90c3149339

Answer 2

Chrome finally implemented the new navigator.mediaDevices.getUserMedia() method, but they added a security that will prevent the calls from unsecure address (non https or non localhost servers)

You will call it like this :

var video = document.querySelector('video');
navigator.mediaDevices.getUserMedia({video:true}).then(function(mediaStream){
    window.stream = mediaStream;
    video.src = URL.createObjectURL(mediaStream);
    video.play();
});

Or you can use the official webRTC polyfill adpater.js library.

var constraints = { video: true, audio: true };

navigator.mediaDevices.getUserMedia(constraints)
  .then(stream => video.srcObject = stream)
  .catch(e => console.error(e));

Answer 3

Chrome is requiring secure origins (HTTPS) for getUserMedia.

Starting with Chrome 47, getUserMedia() requests are only allowed from secure origins: HTTPS or localhost.

https://developers.google.com/web/updates/2015/10/chrome-47-webrtc?hl=en