未捕获的 ReferenceError:进程未定义简单对等 Javascript

Dev*_*nma 3 javascript webrtc reactjs webpack simple-peer

我目前正在学习 WebRTC 并使用 simple-peer 和 React 和 Socket.io 的 npm 包。当我尝试致电用户时,就会显示此错误

_stream_readable.js:529 Uncaught ReferenceError: process is not defined
    at emitReadable (_stream_readable.js:529:1)
    at onEofChunk (_stream_readable.js:506:1)
    at readableAddChunk (_stream_readable.js:255:1)
    at Readable.push (_stream_readable.js:241:1)
    at index.js:448:1


Run Code Online (Sandbox Code Playgroud)

我的 React 组件代码

    const myVideoElement = useRef();
    const peerVideoElement = useRef();
    const chatInfo=useRef();
    const peerStream=useRef();


Run Code Online (Sandbox Code Playgroud)
function startCall(){
    const peer=new SimplePeer({
      initiator:true,
      trickle:false,
      stream:stream,
    })

    peer.on('signal',(data)=>{
      socket.emit('calluser',{userToCall:chatInfo.current.userToCall,url:chatInfo.current.url,signalData:data,from:userId});
    });
    peer.on('stream',(stream)=>{
      if(peerVideoElement.current){
        peerVideoElement.current.srcObject=stream;
      }

      socket.on('callaccepted',(data)=>{
        peer.signal(data);
      })
    })
  }

Run Code Online (Sandbox Code Playgroud)
function acceptCall(){
  setIsCallAccepted(true);
    const peer = new SimplePeer({
      initiator: false,
      trickle: false,
      stream: stream,
    });
    peer.on("signal", data => {
      socket.emit("acceptCall", { signal: data,to:chatInfo.current.userToCall})
    })

    peer.on("stream", stream => {
      peerVideoElement.current.srcObject = stream;
    });
    
    peer.signal(peerStream.current);
}

Run Code Online (Sandbox Code Playgroud)

我希望它能够像我在文档中阅读和观看教程一样连接

小智 5

请安装此包https://www.npmjs.com/package/process

如果您使用的是 React ,请将它们包含在index.js第一行。

您可能需要将其移至单独的./setup.js文件以遵循 create-react-app 规则。

import * as process from 'process';

(window as any).global = window;
(window as any).process = process;
(window as any).Buffer = [];
Run Code Online (Sandbox Code Playgroud)

如果您使用的是 Angular,您可以在 polyfill.ts 中添加这些行