在反应 ssr 应用程序中调用 Firebase 消息传递方法时，未定义如何修复自我?

Question

我正在尝试在我的SSR应用程序中使用Firebase按摩，该应用程序是使用 https://github.com/jaredpalmer/razzle with-react-router-3创建的。我已经在使用火力基地，它工作得很好，包括托管。但是当我开始在应用程序中添加消息时开始抛出错误。

我的入口点是这样的，

import firebase from 'firebase/app';
import 'firebase/auth';
import 'firebase/database';
import 'firebase/storage';
import 'firebase/firestore';
import 'firebase/messaging';
import FirebaseConfig from 'config/firebase-config.json';
if (!firebase.apps.length) {
firebase.initializeApp(FirebaseConfig);
}
const messaging = firebase.messaging();

当我使用razzle start启动服务器时，我收到波纹管错误

/Users/subkundu/Desktop/Work/Projects/React/ownerstown/node_modules/@firebase/messaging/index.ts:75
if (self && 'ServiceWorkerGlobalScope' in self) {
^
ReferenceError: self is not defined

我该如何解决？任何线索都会令人惊叹。谢谢。:)

Answer 1

我相信您必须提供检查以查看window是否可用。

let Messaging;
if (YOUR_CHECK_HERE) {
Messaging = firebase.messaging();
}
// Then you can use "Messaging"

我不熟悉拉兹尔。访问window因服务器端渲染 (SSR( 框架而异。我从这篇文章中得到了这个想法。当我在使用nuxt时遇到此问题时.js我能够使用此process.browser检查window。希望这有帮助！