带音频的 Opentok 屏幕共享

Question

我尝试使用 opentok JS 客户端创建一个屏幕共享应用程序，它也共享发布者音频。

屏幕共享工作正常。但音频永远不会共享。

现在，我注意到控制台 (Firefox) 中有一条警告说 Invalid audioSource passed to Publisher - when using screen sharing no audioSource may be used。那是根本不可能，还是音源无效？

Answer 1

如果您创建订阅者并将其连接到会话，它将接收来自所有发布者的音频和视频。据我所知，屏幕共享中没有音频，因此您无法发布它。那应该解决它。希望对您有所帮助。

Answer 2

我联系了 tokbox 支持，他们确认必须在其他流中发布音频。

Answer 3

在 v2.13.0 中，现在可以将 MediaStreamTrack 作为自定义 audioSource 和 videoSource 传递给 initPublisher。这意味着您可以将麦克风音频添加到屏幕共享流中。这仅适用于 Chrome 或 Firefox。 IE 不支持 MediaStreamTrack，Safari 目前不支持屏幕共享。

const publish = Promise.all([
  OT.getUserMedia({
    videoSource: 'screen'
  }),
  OT.getUserMedia({
    videoSource: null
  })
])
.then(([screenStream, micStream]) => {
  return OT.initPublisher(null, {
    videoSource: screenStream.getVideoTracks()[0],
    audioSource: micStream.getAudioTracks()[0]
  });
});

这是一个全部有效的示例 https://output.jsbin.com/wozuhuc 此示例仅适用于 Firefox，因为 Chrome 需要扩展。

Answer 4

我曾尝试在 Chrome 中完成这项工作，这可以通过使用 getDisplayMedia({video: true, audio: true}) 实现，它现在显示一个复选框以允许用户共享设备音频：

然后您可以使用它来创建一个普通的发布者，它使用来自此调用的视频和音频流，如下所示：

 let prom = navigator.mediaDevices.getDisplayMedia({ video:true, audio: true });

    prom.then(function(result) {
        console.log("Collected permission. Going to start publishing.");
        desktopStream = result;
        var audioStream = desktopStream.getAudioTracks()[0];
        var videoStream = desktopStream.getVideoTracks()[0];

        console.log(audioStream);

        // Screen sharing is available. Publish the screen.
        screenPublisher = OT.initPublisher('ownScreen',
            {
                videoSource: videoStream,
                audioSource: audioStream,
                name: 'Sharing Screen',
                maxResolution: { width: 1920, height: 1920 },
                mirror: false,
                fitMode: "contain",
            },
            function(error) {
                if (error) {
                    console.log(error);
                    // Look at error.message to see what went wrong.
                } else {
                    session.publish(screenPublisher, function(error) {
                        if (error) {
                            handleError();
                        }

                        $('#shareScreen').fadeOut(150, function(){
                            $('#stopShare').fadeIn(150);
                        });

                        $('#stopShare').addClass('blob blue');

                    });
                }
            }
        );

您还可以为屏幕共享发布者添加名称，以允许订阅者区分常规视频发布者和这个新的自定义屏幕共享发布者。

带音频的 Opentok 屏幕共享

Opentok Screen Sharing with Audio

tokbox

opentok