时间戳

首页 > 解决方案 > Firebase Modular SDK V9.0.0+ TypeError：无法读取未定义 Firebase 的属性“应用程序”

javascript - Firebase Modular SDK V9.0.0+ TypeError：无法读取未定义 Firebase 的属性“应用程序”

问题描述

尝试运行 next.js 应用程序时出现此错误。我尝试了很多方法，但我无法解决这个问题。我正在使用 Firebase 9.0.1

Server Error
TypeError: Cannot read property 'apps' of undefined

This error happened while generating the page. Any console logs will be displayed in the terminal window.
Source
.next\server\pages\_app.js (14:13) @ Object../firebase.js

  12 | };
  13 |
> 14 | const app = !firebase.apps.length
     |             ^
  15 |   ? firebase.initializeApp(firebaseConfig)
  16 |   : firebase.app();

这是我的 firebase.js

import firebase from "firebase/app";

// For Firebase JS SDK v7.20.0 and later, measurementId is optional
const firebaseConfig = {
  apiKey: "",
  authDomain: "",
  projectId: "",
  storageBucket: "",
  messagingSenderId: "",
  appId: "",
  measurementId: ""
};

const app = !firebase.apps.length
  ? firebase.initializeApp(firebaseConfig)
  : firebase.app();

const db = app.firestore();
const auth = app.auth();
const provider = new firebase.auth.GoogleAuthProvider();

export { db, auth, provider };

标签： javascriptfirebasenext.js

解决方案

由于您使用的v9.0.1是不使用firebase.命名空间的新模块化 SDK，因此您应该getApps()使用firebase.apps.

import { initializeApp, getApps } from "firebase/app"
import { getFirestore } from "firebase/firestore"
import { getAuth } from "firebase/auth"

const firebaseConfig = {...}

if (!getApps().length) {
  //....
}

const app = initializeApp(firebaseConfig)

const db = getFirestore(app)
const auth = getAuth(app)

export {db, auth}

但是，您无需检查 Firebase 是否已在此新 SDK 中初始化。您可以在文档中了解有关新语法的更多信息。

另请查看：Web 版 Firebase 入门

推荐阅读