我正在开发一个Nuxt 3应用程序,并集成Firebase进行身份验证。我已经在Nuxt插件中设置了我的Firebase配置,从Nuxt 3的运行时配置中提取了Firebase API密钥。该设置允许我使用Firebase成功创建一个用户(我可以在Firebase侧看到一个创建的用户);然而,尽管操作成功,我还是遇到了一个“auth/valid api key”错误。以下是我的设置的简要概述:
nuxt.config.ts
export default defineNuxtConfig({
// Other config...
runtimeConfig: {
firebaseApiKey: '', // Expected to be overridden by NUXT_FIREBASE_API_KEY env variable
}
});
插件/firebase-auth.ts
import { defineNuxtPlugin } from '#app';
import { initializeApp } from 'firebase/app';
import { useRuntimeConfig } from '#imports';
export default defineNuxtPlugin(() => {
const config = useRuntimeConfig();
const firebaseConfig = {
apiKey: config.firebaseApiKey,
// Other Firebase config...
};
const app = initializeApp(firebaseConfig);
// Setup for auth, firestore...
});
问题:
尽管我可以成功创建一个用户(在firebase端验证),但我收到了
Firebase: Error (auth/invalid-api-key)
错误尝试在插件中直接使用process.env并结合dotenv加载环境变量可以消除错误,但会引入与path等模块的浏览器兼容性问题。
问题
为什么我能够在Nuxt 3应用程序中使用Firebase创建用户,尽管收到了“auth/invalid api key”错误,以及如何在不采取导致浏览器兼容性问题的解决方案的情况下解决此错误?