electron 无法在MacOS中获取桌面视频流

我使用的是electron的desktopCapturer API，它实际上在Windows上运行良好，适用于本地服务和最终的exe应用程序。但在macOS上，它只在开发应用程序或本地服务时显示流。但在最终的dmg应用程序中显示白色。更具体地说，我们能够在Mac屏幕上控制或看到窗口的屏幕，但无法在任何其他平台上控制或看到Mac屏幕（仅在生产版本中，但在本地开发中工作正常）。我试着用NSScreenCaptureUsageDescription添加Info.plist文件，但它仍然是一样的。下面是用于共享屏幕文件的package.json和代码。

在启动最终构建应用程序时，会显示一个弹出窗口，用于辅助功能设置，其中我已经选择了此应用程序来访问此设备的屏幕。
电子应用程序不显示流的可能原因是什么

import "./styles.css";
import { useState, useRef, useEffect } from "react";
import { useSelector, useDispatch } from "react-redux";
import JoinCode from "./joincode";
import Peer from "simple-peer";
import FileShare from "../fileSharing/index";
import { Button } from "antd";
import Request from "../../request";

// const { RTCPeerConnection, RTCSessionDescription } = window;

function SharingPage(props) {
  const { connectionRef, yourRoomId, answerCallDATA } = useSelector(
    (state) => ({
      connectionRef: state.global.connectionRef,
      yourRoomId: state.global.yourRoomId,
      answerCallDATA: state.global.answerCallDATA,
    })
  );
  // const [downloadInProgress, setDownloadInProgress] = useState(false)
  const [roomId, setRoomId] = useState(null);
  const [resolution, setResolution] = useState({
    width: null,
    height: null,
  });
  const [Stream, setStream] = useState();
  const [receivingCall, setReceivingCall] = useState(false);
  const [caller, setCaller] = useState("");
  const [clearConnection, setClearConnection] = useState(false);
  const [callerSignal, setCallerSignal] = useState();
  const [callAccept, setCallAccept] = useState(false);
  const [callAccepted, setCallAccepted] = useState(false);
  const [showModal, setShowModal] = useState(false);
  const [cancelSession, setCancelSession] = useState(false);
  const videoData = useRef();

  const dispatch = useDispatch();
  useEffect(() => {
    startShare();
  }, []);

  useEffect(() => {
    setReceivingCall(false);
  }, [yourRoomId]);

  useEffect(async () => {
    let { success, data } = await Request.listCSessions({
      socketid: yourRoomId,
    });
    if (success && data) {
      await Request.updateCSessions({
        socketid: yourRoomId,
        current_plan_id: answerCallDATA?.current_plan_id,
      });
    }
  }, [callAccepted]);

  useEffect(() => {
    window.ipcRenderer.on("stream", async (event, value) => {
      const stream = await navigator.mediaDevices.getUserMedia({
        audio: false,
        video: {
          mandatory: {
            chromeMediaSource: "desktop",
            chromeMediaSourceId: value?.sourceId,
            minWidth: value?.videoResolution?.width,
            maxWidth: value?.videoResolution?.width,
            minHeight: value?.videoResolution?.height,
            maxHeight: value?.videoResolution?.height,
          },
          // video: true,
        },
      });
      setStream(stream);
      setRoomId(value?.userId);
      dispatch({ type: "SET_USER_ROOMID", payload: value?.userId });
    });

    window.ipcRenderer.on("answerCall", async (event, data) => {
      setReceivingCall(true);
      setCaller(data.from);
      dispatch({ type: "SET_SOCKET_ID", payload: data.from });
      dispatch({ type: "SET_ANSWERCALL_DATA", payload: data });
      // setName(data.name)
      setCallerSignal(data.signal);
      setResolution({
        width: data.screenResolution.width,
        height: data.screenResolution.height,
      });
    });

    window.ipcRenderer.on("CallConnectDisconnnect", async (event, data) => {
      if (data == "Accept") {
        setCallAccept(true);
        setCancelSession(false);
      } else if (data == "Disconnect") {
        setCallAccept(false);
        setCancelSession(true);
      } else if (data == "Reject") {
        setReceivingCall(false);
        setCallAccept(false);
        setCancelSession(true);
        dispatch({ type: "INCOMING_ACCEPTED", payload: false });
        window.ipcRenderer.send("closedSession", {
          room: caller,
          Reject: true,
        });
      }
    });

    window.ipcRenderer.on("socketDisconneted", (event, value) => {
      setCancelSession(true);
    });

    window.ipcRenderer.on("clearConnection", (event, value) => {
      setClearConnection(true);
    });

    return () => {
      window.ipcRenderer.removeAllListeners("stream");
      window.ipcRenderer.removeAllListeners("answerCall");
      window.ipcRenderer.removeAllListeners("CallConnectDisconnnect");
      window.ipcRenderer.removeAllListeners("clearConnection");
    };
  });

  useEffect(() => {
    setReceivingCall(false);
    dispatch({ type: "SET_PEER_CONNECTION", payload: null });
    dispatch({ type: "INCOMING_ACCEPTED", payload: false });
    dispatch({ type: "SET_SOCKET_ID", payload: null });
    setStream();
  }, [clearConnection]);

  const startShare = () => {
    window.ipcRenderer.send("start-share", {});
    // setShare(true)
  };

  const accRej = () => {
    setShowModal(true);
  };

  useEffect(() => {
    if (roomId != null) {
      setInterval(() => {
        window.ipcRenderer.send("clipBoard", { roomId });
      }, 2000);
    }
  }, [roomId]);

  useEffect(() => {
    if (receivingCall == true) {
      window.ipcRenderer.send("Accept-Call", {});
    }
  }, [receivingCall]);

  useEffect(() => {
    if (callAccept == true) {
      answerCall();
      setReceivingCall(false);
      setCallAccept(false);
    }
  }, [callAccept]);

  useEffect(() => {
    if (cancelSession == true) {
      window.ipcRenderer.send("closedSession", true);
      setReceivingCall(false);
      connectionRef?.destroy();
      dispatch({ type: "SET_PEER_CONNECTION", payload: null });
      dispatch({ type: "INCOMING_ACCEPTED", payload: false });
      setStream();
      dispatch({ type: "SET_FILE_RECEIVED", payload: false });
    }
  }, [cancelSession]);

  const answerCall = () => {
    const peer = new Peer({
      initiator: false,
      trickle: false,
      stream: Stream,
    });
    peer.on("signal", (data) => {
      window.ipcRenderer.send("answerInCall", {
        signal: data,
        from: yourRoomId,
        to: caller,
        resolution: resolution,
      });
    });
    peer.on("stream", (stream) => {
      // videoData.current.srcObject = Stream;
    });

    peer.on("connect", (msg) => {
      setCallAccepted(true);
      setCancelSession(false);
      dispatch({ type: "INCOMING_ACCEPTED", payload: true });
      dispatch({ type: "SET_PEER_CONNECTION", payload: peer });

      videoData.current.srcObject = Stream;
    });

    peer._pc.ondatachannel = (data) => {
      if (data.channel.label == "mouseChannel") {
        data.channel.onmessage = (event) => {
          window.ipcRenderer.send("mouseCoords", event.data);
        };
      }
      if (data.channel.label == "mouseClickChannel") {
        data.channel.onmessage = (event) => {
          window.ipcRenderer.send("mouse-click", event.data);
        };
      }
      if (data.channel.label == "keyChannel") {
        data.channel.onmessage = (event) => {
          window.ipcRenderer.send("key-up", event.data);
        };
      }
    };

    peer._pc.onconnectionstatechange = (data) => {
      if (peer._pc.connectionState == "connected") {
        setCallAccepted(true);
        setCancelSession(false);
        dispatch({ type: "INCOMING_ACCEPTED", payload: true });
        dispatch({ type: "SET_PEER_CONNECTION", payload: peer });

        videoData.current.srcObject = Stream;
      }
      if (peer._pc.connectionState == "disconnected") {
        setCallAccepted(false);
        setCancelSession(true);
        window.ipcRenderer.send("closedSession", true);
        setStream();
        dispatch({ type: "SET_FILE_RECEIVED", payload: false });
        dispatch({ type: "SET_FILER_DATA", payload: 0 });
      }
    };

    peer.on("error", (err) => {
      // setCancelSession(true)
      console.log(err, "erroorrr");
      setStream();
      dispatch({ type: "SET_FILE_RECEIVED", payload: false });
      dispatch({ type: "SET_FILER_DATA", payload: 0 });
    });

    peer.signal(callerSignal);
  };
  return (
    <>
      <video
        ref={videoData}
        autoPlay
        style={{
          opacity: 0.6,
          zIndex: -1,
          width: "90vw",
          height: "90vh",
          position: "absolute",
          padding: 0,
        }}
      ></video>
    </>
  );
}

export default SharingPage;

electron 无法在MacOS中获取桌面视频流

1条答案

相关问题

热门标签

最新问答