【问题标题】:Nuxt.js SSR with firebase - ReferenceError: navigator is not defined带有 Firebase 的 Nuxt.js SSR - ReferenceError:未定义导航器
【发布时间】:2021-04-24 01:05:33
【问题描述】:

我使用 Nuxt(SSR) 和 firebase(firestore 和托管)制作了一个简单的网络应用程序。它有一些页面,如索引、关于、联系和文本编辑器。
当我做npm run build 时,它可以正常工作。 但是对于npm run generate,它有如下错误信息:

ReferenceError: navigator is not defined
at Object.areCookiesEnabled (C:\app\node_modules\@firebase\util\dist\index.node.cjs.js:656:5)
at warnOnBrowserContextMismatch (C:\app\node_modules\@firebase\analytics\dist\index.cjs.js:1072:15)
at factory (C:\app\node_modules\@firebase\analytics\dist\index.cjs.js:1086:5)
at Component.instance.INTERNAL.registerComponent.component.Component.setServiceProps.settings [as instanceFactory] (C:\app\node_modules\@firebase\analytics\dist\index.cjs.js:1165:16)
at Provider.getOrInitializeService (C:\app\node_modules\@firebase\component\dist\index.cjs.js:222:39)
at Provider.getImmediate (C:\app\node_modules\@firebase\component\dist\index.cjs.js:120:33)
at FirebaseAppImpl._getService (C:\app\node_modules\@firebase\app\dist\index.node.cjs.js:230:49)
at FirebaseAppImpl.firebaseAppImpl.<computed> [as analytics] (C:\app\node_modules\@firebase\app\dist\index.node.cjs.js:442:39)
at Object.serviceNamespace [as analytics] (C:\app\node_modules\@firebase\app\dist\index.node.cjs.js:422:45)
at Object.<anonymous> (plugins/firebase.js:22:0)
at __webpack_require__ (webpack/bootstrap:25:0)
at Module.<anonymous> (server.js:2766:16)
at __webpack_require__ (webpack/bootstrap:25:0)
at Object.<anonymous> (server.js:639:18)
at __webpack_require__ (webpack/bootstrap:25:0)
at server.js:118:18

实际上,当我在开发模式下运行应用程序时,此消息偶尔会出现,而当我刷新时,它通常会消失。
这是我为修复它所做的:

  1. 再次删除 package.json 文件和npm install 中我最终不使用的 node_module 文件夹和依赖项。我什至删除了与 firebase 相关的文件和文件夹,并重新安装了 firebase 工具并再次初始化。
  2. 起初,错误消息仅出现在 /about 页面,其他任何页面都正常,因此我删除了 about 页面 - 然后错误再次出现在另一个页面。
  3. 在 #2 之前,我认为会发生此错误,因为只有 about 页面没有 .我做了一些研究,发现这是因为页面只是客户端或服务器端等等等等……所以我故意添加了一些脚本代码,但它也不起作用。

我在此处或其他论坛上查找了数十篇文章,但实际上没有一篇有助于找出我做错了什么。
这个问题似乎与节点或服务器端的事情有关,但我对 Vue 和 Node 都很陌生,所以我无法完全理解我必须做什么以及应该在哪里修改代码。
顺便说一句,我的节点是最新的 LTS 版本,而 vue、nuxt 和所有依赖项也是最新版本。
提前致谢。

【问题讨论】:

    标签: javascript node.js firebase vue.js nuxt.js


    【解决方案1】:

    嘿,不知道这是否有帮助,我在使用 NextJs 时遇到了同样的问题。这是我解决它的方法。我也没有在我的任何 SSR 代码中使用它,但我不知道发生了什么。

    const analytics = (): firebase.analytics.Analytics =&gt; firebase.analytics();

    然后在你的代码中使用它

    analytics().logEvent();
    

    【讨论】:

    • 这有助于部署功能。但是通过https调用调用函数时问题仍然存在
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 2019-02-20
    • 1970-01-01
    • 2023-04-11
    • 1970-01-01
    • 2018-04-16
    • 2019-09-17
    • 1970-01-01
    相关资源
    最近更新 更多