NextJS:如何将 Firebase 分析正确添加到 NextJS 应用程序

时间:2021-03-26 07:15:12

标签: javascript reactjs vue.js google-cloud-firestore next.js

我有一个 react/nextjs 应用程序,我有 firebase.js 如下:

import firebase from 'firebase/app'
import 'firebase/auth'
import 'firebase/analytics'
import 'firebase/firestore'

const firebaseConfig = {
  apiKey: '...'
}
try {
  firebase.initializeApp(firebaseConfig)
  firebase.analytics()
} catch (err) {
  if (!/already exists/.test(err.message)) {
    console.error('Firebase initialization error', err.stack)
  }
}

export default firebase

我一直在接受

<块引用>

Firebase 初始化错误 ReferenceError: navigator is not defined

将分析添加到 firebase.js 文件后。向应用添加分析的正确方法是什么?

2 个答案:

答案 0 :(得分:0)

ReferenceError: navigator is not defined 因为在 Nextjs 应用程序的服务器端渲染期间没有窗口对象存在。

试试:

if(typeof window != undefined){
     firebase.analytics()
}

答案 1 :(得分:0)

试试这个配置

import firebase from 'firebase/app';

const config = {
 ...your firebase config
};

const initializeFirebaseApp = () => {
  if (!firebase.apps.length) {
    return firebase.initializeApp(config);
  }

  return firebase.app();
};

const firebaseApp = initializeFirebaseApp();

export { firebaseApp };