时间戳

首页 > 解决方案 > FirebaseError：Firebase：没有创建 Firebase 应用“[DEFAULT]”（在 NextJS 上）

firebase - FirebaseError：Firebase：没有创建 Firebase 应用“[DEFAULT]”（在 NextJS 上）

问题描述

在尝试将 Firebase 身份验证与我的项目集成时，我遇到了这个错误：

FirebaseError: Firebase: No Firebase App '[DEFAULT]' has been created - call Firebase App.initializeApp() (app/no-app).
    at app (/Volumes/MacOS/Projects/Projects/3. PriceTag/pricetag/node_modules/@firebase/app/dist/index.node.cjs.js:356:33)
    at Object.serviceNamespace [as auth] (/Volumes/MacOS/Projects/Projects/3. PriceTag/pricetag/node_modules/@firebase/app/dist/index.node.cjs.js:406:51)
    at eval (webpack-internal:///./lib/firebase.js:28:66)
    at Object../lib/firebase.js (/Volumes/MacOS/Projects/Projects/3. PriceTag/pricetag/.next/server/pages/enter.js:22:1)
    at __webpack_require__ (/Volumes/MacOS/Projects/Projects/3. PriceTag/pricetag/.next/server/webpack-runtime.js:33:42)
    at eval (webpack-internal:///./pages/enter.js:7:71)
    at Object../pages/enter.js (/Volumes/MacOS/Projects/Projects/3. PriceTag/pricetag/.next/server/pages/enter.js:33:1)
    at __webpack_require__ (/Volumes/MacOS/Projects/Projects/3. PriceTag/pricetag/.next/server/webpack-runtime.js:33:42)
    at __webpack_exec__ (/Volumes/MacOS/Projects/Projects/3. PriceTag/pricetag/.next/server/pages/enter.js:87:52)
    at /Volumes/MacOS/Projects/Projects/3. PriceTag/pricetag/.next/server/pages/enter.js:88:28
    at Object.<anonymous> (/Volumes/MacOS/Projects/Projects/3. PriceTag/pricetag/.next/server/pages/enter.js:91:3)
    at Module._compile (internal/modules/cjs/loader.js:1133:30)
    at Object.Module._extensions..js (internal/modules/cjs/loader.js:1153:10)
    at Module.load (internal/modules/cjs/loader.js:977:32)
    at Function.Module._load (internal/modules/cjs/loader.js:877:14)
    at Module.require (internal/modules/cjs/loader.js:1019:19) {
  code: 'app/no-app',
  customData: { appName: '[DEFAULT]' }

每当我请求时，我都会收到此错误localhost:3000/enter

这是Javascript代码：

firebase.js

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

var firebaseConfig = {
  apiKey: process.env.FIREBASE_API_KEY,
  authDomain: process.env.FIREBASE_AUTH_DOMAIN,
  projectId: process.env.FIREBASE_PROJECT_ID,
  storageBucket: process.env.FIREBASE_STORAGE_BUCKET,
  messagingSenderId: process.env.FIREBASE_MESSAGING_SENDER_ID,
  appId: process.env.FIREBASE_APP_ID
};

if (!firebase.app.length) {
  firebase.initializeApp(firebaseConfig)
}

export const auth = firebase.auth()
export const googleAuthProvider = new firebase.auth.GoogleAuthProvider()

输入.js

import { auth, googleAuthProvider } from '../lib/firebase'

export default function SignInPage() {
  return (
    <>
      <SignInButton />
    </>
  )
}

// Google Sign In Component
const SignInButton = () => {
  const signInWithGoogle = async () => {
    await auth.signInWithPopup(googleAuthProvider)
  }
  return (
    <button onClick={signInWithGoogle}>Sign in with Google</button>
  )
}

// Sign Out Button component
export const SignOutButton = () => {
  return (
    <button onClick={() => auth.signOut}>Sign in with Google</button>
  )
}

我似乎无法弄清楚导致错误的原因。我确实初始化了一个 firebase 应用程序，所以我不确定这里发生了什么。

标签： firebasenext.js

解决方案

对于使用 firebase V9 的任何人。这是你需要做的。

import { initializeApp } from 'firebase/app';
import { getFirestore } from "firebase/firestore";

const clientCredentials = {
  apiKey: process.env.NEXT_PUBLIC_FIREBASE_API_KEY,
  authDomain: process.env.NEXT_PUBLIC_FIREBASE_AUTH_DOMAIN,
  projectId: process.env.NEXT_PUBLIC_FIREBASE_PROJECT_ID,
  storageBucket: process.env.NEXT_PUBLIC_FIREBASE_STORAGE_BUCKET,
  messagingSenderId: process.env.NEXT_PUBLIC_FIREBASE_MESSAGING_SENDER_ID,
  appId: process.env.NEXT_PUBLIC_FIREBASE_APP_ID,
  measurementId: process.env.NEXT_PUBLIC_FIREBASE_MEASUREMENT_ID,
};

const app = initializeApp(firebaseConfig);
const firestore = getFirestore();
export { firestore }

你应该没事

推荐阅读