FirebaseError:Firebase:在未通过源部署到托管时需要提供选项。(应用程序/无选项)

muk*_*nda 20 javascript firebase firebase-authentication next.js react-context

我创建了一个 Next.js 应用程序并使用 Firebase 身份验证。我使用 useContext 挂钩来管理应用程序中的用户状态。AuthContext的代码如下:

auth.js

import { createContext, useState, useEffect, useContext } from "react";
import { getAuth, onIdTokenChanged } from "firebase/auth";

const AuthContext = createContext({});

export const AuthProvider = ({children}) => {
    
    const auth = getAuth();
    const [user, setUser] = useState(null);

    useEffect(() => {
        return(onIdTokenChanged(auth, (user) => {
            if(user) {
                setUser(user);
            } else {
                setUser(null);
            }
        }))
    },[]);

    return(<AuthContext.Provider value={{user}}>{children}</AuthContext.Provider>);
}

export const useAuth = () => useContext(AuthContext);
Run Code Online (Sandbox Code Playgroud)

但是,我在auth.js文件中收到以下错误: 在此输入图像描述

  1. 我不明白如何解决它。
  2. 另外,我想知道使用 useContext() 钩子是否比在浏览器中存储用户会话 cookie 并从那里验证它更适合路由保护。

编辑:我已经在 firebaseConfig.js 中配置了 Firebase。其代码如下:

firebaseConfig.js

import { initializeApp } from "firebase/app";
import { getAuth } from "firebase/auth";


const firebaseConfig = {
    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,
};

// Initialize Firebase
export const app = initializeApp(firebaseConfig);
export const auth = getAuth(app);
Run Code Online (Sandbox Code Playgroud)

小智 20

我刚刚遇到了同样的错误,我设法通过执行以下操作来解决此问题:

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

const firebaseConfig{
...
}
Run Code Online (Sandbox Code Playgroud)

并像这样添加这些行:

const app = initializeApp(firebaseConfig);
const auth = getAuth(app);
const db = getFirestore();

export { auth, db };
Run Code Online (Sandbox Code Playgroud)