'how to add screen share function using PeerJS?

Currently, i am working on a webRTC project where you can give call and receive call.i also want to add screen share functionality to it.

can anyone provide me a good documentation link? i am currently following the official documentation of peerJS. i was able to do audio-video calling but stuck on the screen sharing part. Help Me!

webrtcpeerjs


Solution 1:[1]

You need to get stream just like you do with getUserMedia and then you give that stream to PeerJS.

It should be something like this:

var displayMediaOptions = {
    video: {
        cursor: "always"
    },
    audio: false
};

navigator.mediaDevices.getDisplayMedia(displayMediaOptions)
.then(function (stream) {
    // add this stream to your peer 
});

Solution 2:[2]

I'm working with and learning about WebRTC. From what I've read, I think the solution here probably hinges on getDisplayMedia. That's also what this React, Node and peerJS tutorial suggests (though I haven't tried it myself yet).

Solution 3:[3]

let screenShare = document.getElementById('shareScreen');
    screenShare.addEventListener('click', async () => {
        captureStream = await navigator.mediaDevices.getDisplayMedia({
            audio: true,
            video: { mediaSource: "screen" }
        });
        //Instead of adminId, pass peerId who will taking captureStream in call
        myPeer.call(adminId, captureStream);
    })

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 Velexior
Solution 2 Dharman
Solution 3

Related Questions