Search code examples
firefoxwebrtcpeerjs

Heroku Hosted Page throws error - navigator.mediaDevices is undefined

The following piece of code works fine when served from localhost, but when deployed to Heroku fails stating : TypeError: navigator.mediaDevices is undefined

navigator.mediaDevices.getUserMedia({audio: true, video: true}).then(function(stream){
    video = $('#myVid')[0];
    video.srcObject = stream;

    video.onloadedmetadata = function(e) {
        video.play();
    };

Including adapter.js from WebRtC does not help. Have you had a similar experience and got it resolved?

Solution

  • Like Google did years ago, Firefox is now (since v69) requiring a secure-context to access the MediaDevices API.
    You must serve your website from https.