I am trying to build a web app that could capture the user's desktop. I found this web api that should do the job perfectly, but I can't seem to make it work. Right now it should be supported both on the latest version of Edge and on Chrome 70 through enabling a flag, but on both browsers if I am looking at the navigator object the getDisplayMedia() function is not in there. I also tried calling the function, but I get an error saying that it is not a function(which confirms that it is actually not in the navigator). What could be the problem?

Thanks in advance!

edit: Here is my javascript

function na() {
    navigator.mediaDevices.getDisplayMedia({
        video: {
            mandatory: {
                chromeMediaSource: 'desktop',
                minWidth: 1280,
                maxWidth: 1280,
                minHeight: 720,
                maxHeight: 720
            }
        }
    }).then((stream)=>console.log(stream))
    console.log(navigator)

}

na();

I am trying to build a web app that could capture the user's desktop. I found this web api that should do the job perfectly, but I can't seem to make it work. Right now it should be supported both on the latest version of Edge and on Chrome 70 through enabling a flag, but on both browsers if I am looking at the navigator object the getDisplayMedia() function is not in there. I also tried calling the function, but I get an error saying that it is not a function(which confirms that it is actually not in the navigator). What could be the problem?

Thanks in advance!

edit: Here is my javascript

function na() {
    navigator.mediaDevices.getDisplayMedia({
        video: {
            mandatory: {
                chromeMediaSource: 'desktop',
                minWidth: 1280,
                maxWidth: 1280,
                minHeight: 720,
                maxHeight: 720
            }
        }
    }).then((stream)=>console.log(stream))
    console.log(navigator)

}

na();

• javascript
• webrtc
• get-display-media

• Hard to tell if you don't share any code. – Jim B. Commented Nov 24, 2018 at 23:08
• Ok, I've posted my code. Is just some example code I tried to use – Adrian Pascu Commented Nov 24, 2018 at 23:19
• 1 Odd, not finding anything about the flag to turn it on. What's it supposed to be? – Jim B. Commented Nov 24, 2018 at 23:39
• I read somewhere that by enabling this flag: #enable-experimental-web-platform-features I can use the api on chrome,but it didn't change anything – Adrian Pascu Commented Nov 24, 2018 at 23:42
• I can't find where this is supported by chrome yet. You're a trailblazer, I think. – Jim B. Commented Nov 24, 2018 at 23:44

1 Answer 1

While not available yet, getDisplayMedia can be polyfilled. This is described in this blog post. In Chrome this requires an extension so if you start to develop just now it might be better to wait until getDisplayMedia is available in Chrome (it should be in Chrome Canary without flags soon)

Note that you are mixing old constraints (which were required to get desktop sharing from navigator.mediaDevices.getUserMedia in Chrome) with navigator.mediaDevices.getDisplayMedia which is not going to work.