将 peerjs 与 nuxtjs (vue.js) 集成时出错

Posted 2023-05-07

【中文标题】将 peerjs 与 nuxtjs (vue.js) 集成时出错

【英文标题】：Error while integrating peerjs with nuxtjs (vue.js)

【发布时间】：2021-12-05 13:13:06

【问题描述】：

安装：

npm i peerjs

/plugins/peerjs.js

import Peer from 'peerjs'

export default Peer

nuxt.config.js

plugins: [
   src: "~/plugins/peerjs.js", s-s-r: true 
],

浏览器错误：

client.js?06a0:103 TypeError: Cannot set properties of undefined （设置'_events'） 在我 (peerjs.min.js?a0​​bc:46) 在我 (peerjs.min.js?a0​​bc:66) 在 _callee2$ (index.js?f26e:87) 在 tryCatch (runtime.js?96cf:63) 在 Generator.invoke [as _invoke] (runtime.js?96cf:294) 在 Generator.eval [as next] (runtime.js?96cf:119) 在 asyncGeneratorStep (asyncToGenerator.js?1da1:3) 在 _next (asyncToGenerator.js?1da1:25) _callee$@client.js?06a0:103 [e-mail]?96cf:63 [e-mail]?96cf:294 [e-mail]?96cf:119 asyncGeneratorStep@ asyncToGenerator.js?1da1:3 _next @ asyncToGenerator.js?1da1:25 评估@asyncToGenerator.js?1da1:32 评估@asyncToGenerator.js?1da1:21 评估@client.js?06a0:65 Promise.catch (asíncrono) eval @ client.js?06a0:115 eval @ client.js:1294 ./.nuxt/[e-mail]:35 webpack_require @runtime.js:854 fn @runtime.js:151 0 @app.js:9767 webpack_require @runtime.js:854 checkDeferredModules @runtime.js:46 webpackJsonpCallback @runtime.js:33 (anónimo) @ app.js:1

【问题讨论】：

看起来服务器实际上不支持 Peerjs：github.com/peers/peerjs/issues/641 所以，你应该做相反的事情，也就是 mode: 'client'。另外，除了import 和export 之外，您不需要在这里做其他事情。另外，如果您在全球范围内不需要它，请考虑在本地使用它：***.com/a/69593428/8816585（和/或***.com/a/69572014/8816585）

将s-s-r: true 更改为mode: 'server' 似乎可行，我知道为什么

s-s-r 已弃用，应替换为 mode。然后，s-s-r: true 表示您希望您的插件同时在服务器和客户端上运行。同时，由于peerjs 依赖于window（仅在浏览器中可用），您只需在'client' 上运行即可。不知道为什么你的东西适用于'server' tho。你的问题解决了吗？介意我发布答案吗？

我理解你的意思，但它在 client 上崩溃并在 server 上运行有点奇怪

实际问题是什么？你有错误还是什么？

【参考方案1】：

设置 src: '~/plugins/peerjs.js' , mode: 'server' 解决了这个问题。

奇怪，因为它应该是 mode: 'client'，如 the documentation 所示，但我猜 PeerJS 实际上依赖于 Node 而不是客户端的窗口。