Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Screen capture using WEBRTC, Get to know user stream selection

Hey I am using WEBRTC for screen share. But I am stuck at point where i need user entire screen, but browser is providing user with more options like application and browser tabs, so i want to check what option is user selecting from the popup produce by the browser if its not entire screen then i can generate a error message to user, Please see this popup image

const constraints = {
          audio: false,
          video: {
            width: { max: 1920 },
            height: { max: 1080 },
            frameRate: { max: 10 }
          }
        }
const stream = await navigator.mediaDevices.getDisplayMedia(constraints);
like image 355
Rajneesh Kumar Sharma Avatar asked Oct 26 '25 14:10

Rajneesh Kumar Sharma


1 Answers

After searching for a long time I found something that works for me. if it works for you that's great.

const isFirefox = typeof InstallTrigger !== 'undefined';
const isChrome = !!window.chrome && (!!window.chrome.webstore || !!window.chrome.runtime);
const videoTrack = mediaStream.getVideoTracks()[0];
if (isFirefox) {
    if(videoTrack.label === "Primary Monitor"){
        return true;
    } else {
        return false;
    }
} else if (isChrome) {
    const videoSetting = videoTrack.getSettings();
    if (videoSetting && videoSetting.displaySurface !== "monitor") {
        return false;
    } else {
        return true;
    }
}
like image 67
Rajneesh Kumar Sharma Avatar answered Oct 28 '25 03:10

Rajneesh Kumar Sharma