getScreenId | Capture Screen on Any Domain!

HOME © Muaz Khan . @WebRTCWeb . Github . Latest issues . What's New?

YouTube video: https://www.youtube.com/watch?v=UHrsfe9RYAQ

  1. Install this: https://chrome.google.com/webstore/detail/screen-capturing/ajhifddimkapgcifgcodmmfdlknahffk
  2. Now use below codes on any HTTPs domain.
  3. Remember, HTTPs is required.
  4. getScreenId gives you "MediaStream" object; you can share that object with other users using AppRTC demo, SimpleWebRTC or EasyRTC or PeerJs libraries, or any standalone peer-to-peer demo.
  5. In simple words, you have to use RTCPeerConnection API along with getScreenId to share screen with other users.

Prerequisites

  1. Chrome? Store / Source Code
  2. Firefox? Requires version 52 or higher; and HTTPs.
  3. MS-Edge requires 17 or higher; and HTTPs.

How to use getScreenId.js?

<script src="https://cdn.WebRTC-Experiment.com/getScreenId.js"></script>
<script src="https://webrtc.github.io/adapter/adapter-latest.js"></script>
<script>
getScreenId(function (error, sourceId, screen_constraints) {
    // error    == null || 'permission-denied' || 'not-installed' || 'installed-disabled' || 'not-chrome'
    // sourceId == null || 'string' || 'firefox'

    if(navigator.userAgent.indexOf('Edge') !== -1 && (!!navigator.msSaveOrOpenBlob || !!navigator.msSaveBlob)) {
        navigator.getDisplayMedia(screen_constraints).then(stream => {
            document.querySelector('video').srcObject = stream;
        }, error => {
            alert('Please make sure to use Edge 17 or higher.');
        });
        return;
    }

    navigator.mediaDevices.getUserMedia(screen_constraints).then(function (stream) {
        document.querySelector('video').srcObject = stream;

        // share this "MediaStream" object using RTCPeerConnection API
    }).catch(function (error) {
        console.error(error);
    });
});
</script>

How to detect whether extension is installed or not? 

<script src="https://cdn.WebRTC-Experiment.com/getScreenId.js"></script>
<script>
getChromeExtensionStatus(function(status) {
    if (status === 'installed-enabled') alert('installed');
    if (status === 'installed-disabled') alert('installed but disabled');
    // etc.
});
</script>

Feedback

Enter your email too; if you want "direct" reply!

Latest Updates