electron Uncaught(in promise)DOMException:不支持(使用WebRTC进行屏幕共享)

gkn4icbw  于 2023-06-20  发布在  Electron
关注(0)|答案(1)|浏览(627)

我有MAC Catalyst的Electronjs应用程序。我已经实现了音频/视频通话功能。这些工作很好。
我还实现了通过使用下面的代码共享屏幕的功能。

navigator.mediaDevices.getDisplayMedia(options).then((streams) => {
    var peer_connection = session.sessionDescriptionHandler.peerConnection;
    var video_track = streams.getVideoTracks()[0];
    var sender_kind = peer_connection.getSenders().find((sender) => {
        return sender.track.kind == video_track.kind;
    });
    sender_kind.replaceTrack(video_track);

    video_track.onended = () => {
    };
},
    () => {
        console.log("Error occurred while sharing screen");
    }
);

但当我点击按钮共享屏幕使用上述代码,我得到下面的错误.

Uncaught (in promise) DOMException: Not supported

我也试过navigator.getUserMedia(options,success,error)。它由Mac Catalyst桌面应用程序支持。但它只提供网络摄像头的流。
我还在网上检查了Mac Catalyst是否支持navigator.mediaDevices.getDisplayMedia(options)。它在Mac Catalyst中提供支持。但我仍然面临这个问题。
我也尝试过使用electronjs的desktopCapturer API。但我不知道怎么才能得到它的信息流。

//CODE OF 'main.js'

ipcMain.on("ask_permission", () => {
  desktopCapturer
    .getSources({ types: ["window", "screen"] })
    .then(async (sources) => {
      for (const source of sources) {
        // console.log(source);
        if (source.name === "Entire screen") {
          win.webContents.send("SET_SOURCE", source.id);
          return;
        }
      }
    });
});

我已经尝试过在preload.js中使用下面的代码来获取流。但是我得到了错误Cannot read property 'srcObject' of undefined

window.addEventListener("DOMContentLoaded", (event) => {
  ipcRenderer.on("SET_SOURCE", async (event, sourceId) => {
    try {
      const stream = await navigator.mediaDevices.getUserMedia({
        audio: false,
        video: {
          mandatory: {
            chromeMediaSource: "desktop",
            chromeMediaSourceId: sourceId,
            minWidth: 1280,
            maxWidth: 1280,
            minHeight: 720,
            maxHeight: 720,
          },
        },
      });
      handleStream(stream);
    } catch (e) {
      handleError(e);
    }
  });
  let btn = document.getElementById("btnStartShareOutgoingScreens");
  btn.addEventListener("click", () => {
    if (isSharing == false) {
      ipcRenderer.send("ask_permission");
    } else {
      console.error("USer is already sharing the screen..............");
    }
  });
});

function handleStream(stream) {
  const video = document.createElement("video");
  video.srcObject = stream;
  video.muted = true;
  video.id = "screenShareVideo";
  video.style.display = "none";
  const box = document.getElementById("app");
  box.appendChild(video);
  isSharing = true;
}

我该怎么解决。如果MAC Catalyst不支持此功能,是否有其他方法可以通过使用WebRTC从MAC Catalyst应用程序共享屏幕。

c90pui9n

c90pui9n1#

Mac Catalyst桌面应用程序似乎不支持getDisplayMedia()方法。您可以尝试使用ElectronJS的desktopCapturer API来获取屏幕共享流。
main.js文件中,可以使用desktopCapturer.getSources()方法获取可用源的列表,然后将源ID发送到渲染器进程。在preload.js文件中,可以使用navigator.mediaDevices.getUserMedia()方法和chromeMediaSourcechromeMediaSourceId约束来获取屏幕共享流。
但是,在preload.js文件中似乎出现错误“Cannot read property 'srcObject' of undefined”。这可能是因为视频元素尚未被创建。您可以尝试在调用handleStream()之前将创建video元素的代码移动到handleStream()函数之外并将其添加到HTML中。

相关问题