Question

我已经成功使用videoroomtest和集成视频会议。但是我也想在我的视频室中集成屏幕共享。如何在连接用户的视频室中开始屏幕共享。

屏幕共享还使用videoroom插件。这该怎么做。请帮忙。

任何帮助将不胜感激。

关于，阿卡什（Aakash）

Answer 1

在创建商品时将“视频”设置为“屏幕”：

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

Answer 2

您可以使用navigator.mediaDevices.displayMedia（）获取屏幕。 https://developer.mozilla.org/en-US/docs/Web/API/MediaDevices/getDisplayMedia

Answer 3

您必须为屏幕共享创建单独的报价，例如在处理程序onMessage事件中进行视频会议。

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。

Answer 4

您可以使用：

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

这将返回一个承诺，即解决后将返回用户选择的屏幕中的 MediaStream 和可选的音轨（某些浏览器不支持）。

示例：

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

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

摘录自：https://developer.mozilla.org/en-US/docs/Web/API/MediaDevices/getDisplayMedia

视频室集成中的屏幕共享

4 个答案: