Screen Sharing in Video Room Integration

Question

I have used the videoroomtest and integrated video conferencing successfully. But I want to integrate the screen sharing also in my video room. How can I start the screen sharing in the video room where users are connected.

Screensharing also uses videoroom plugin. How to do this. Please help.

Any help will be appreciated.

Regards, Aakash

jannik · Answer 1 · 2020-08-14T15:27:24.723

2

Set "video" to "screen" when you create an offer:

var media = { audioRecv: false, videoRecv: false, audioSend: useAudio, videoSend: true, data: true, video: "screen" }

edited Aug 14 '20 at 15:27

answered Jul 12 '20 at 21:34

jannik

36
1
3

score 1 · Answer 2 · answered Aug 10 '20 at 11:30

You have to create separate offer for screen sharing like video conferencing inside handler onMessage event.

janus.attach({
    plugin: "janus.plugin.videoroom",
    opaqueId: opaqueId,
    success: function(pluginHandle) { ... },
    error: function(error) { ... },
    consentDialog: function(on) { ... },
    mediaState: function(medium, on) { ... },
    webrtcState: function(on) { ... },
    onmessage: function(msg, jsep) {
        ...
        //video conference
        publishOwnfeed(true, false);
        //Screen sharing
        publishOwnfeed(false, true);
        ...
    }
    onlocalstream: function(stream) {
        //This event will be called for two times
        //one time with video stream
        //second time with screen stream
    },
    onremotestream: function(stream) { ... },
    oncleanup: function() { ... }
});

function publishOwnFeed(useAudio, isScreenSharing) {
    ...
    sfutest.createOffer({
        media: {
            video: isScreenSharing ? "screen" : true // video constraint
            audioRecv: false,
            videoRecv: false,
            audioSend: useAudio,
            videoSend: true
        },
        simulcast: doSimulcast,
        success: function(jsep) { ... },
        error: function(error) { ... }
            ...
    });
}

you can create separate hanldler with same plugin(plugin: "janus.plugin.videoroom") for screen sharing.If you want to handle(Ex. start,stop) separately.

score 0 · Answer 3 · answered Jul 11 '20 at 07:07

0

you can use navigator.mediaDevices.displayMedia() to get the screen. https://developer.mozilla.org/en-US/docs/Web/API/MediaDevices/getDisplayMedia

answered Jul 11 '20 at 07:07

Dirk V

1,373
12
24

score 0 · Answer 4 · answered Aug 10 '20 at 20:00

You can use:

  var promise = navigator.mediaDevices.getDisplayMedia(constraints);

This will return a promise that when resolved returns a MediaStream that comes from the screen that the user selected, and an optional audio track (Not supported by some browsers).

Example:

async function startCapture(displayMediaOptions) {
  let captureStream = null;

  try {
    captureStream = await navigator.mediaDevices.getDisplayMedia(displayMediaOptions);
  } catch(err) {
    console.error("Error: " + err);
  }
  return captureStream;
}

Exctracted from: https://developer.mozilla.org/en-US/docs/Web/API/MediaDevices/getDisplayMedia

Screen Sharing in Video Room Integration

4 Answers4