如何修复Firebase 9.0无效的API密钥

Question

我的API密钥存储在我的React项目的本地.env文件中，并且它是直接从我的firebase控制台设置页面正确粘贴的。然而，我收到这个错误:

Firebase: Error (auth/invalid-api-key).
createErrorInternal
D:/src/core/util/assert.ts:101
98 |   );
99 | }
100 | 
> 101 | return _DEFAULT_AUTH_ERROR_FACTORY.create(
| ^  102 |   authOrCode,
103 |   ...(rest as AuthErrorListParams<K>)
104 | );

我不明白为什么React给我一个错误。我在以下文件中初始化了Firebase:

import { initializeApp } from "firebase/app";
import { getAuth } from "firebase/auth";
const firebaseConfig = {
apiKey: process.env.REACT_APP_FIREBASE_API_KEY,
authDomain: process.env.REACT_APP_FIREBASE_AUTH_DOMAIN,
projectId: process.env.REACT_APP_FIREBASE_PROJECT_ID,
storageBucket: process.env.REACT_APP_FIREBASE_STORAGE_BUCKET,
messagingSenderId: process.env.REACT_APP_FIREBASE_MESSAGING_SENDER_ID,
appId: process.env.REACT_APP_FIREBASE_APP_ID,
};
const app = initializeApp(firebaseConfig);
export const auth = getAuth();
export default app;

Answer 1

看来你的env变量无效。

你可以检查一些东西。

1. 如果您的服务器已经在运行并且您正在更改/添加env变量，则必须重新启动服务器。
   
2. 确保你的env变量名称是正确的。
3. 确保你的env文件是在根文件夹意味着它应该与你的src和public文件夹。
   

Answer 2

出现此问题是因为您可能以错误的方式编写了env文件，如:

// Wrong: 
REACT_APP_FIREBASE_KEY=”AHEHEHR”
// Right:
REACT_APP_FIREBASE_KEY=AHEHEHR

你没有使用任何尾随逗号或引号，在你的API密钥之后或周围，并在修改你的env文件后，你必须重新启动服务器

Answer 3

你可以通过在CMD中点击npm start来重启你的react应用。设置环境变量后，同样的事情也发生在我身上。希望这能奏效。

Answer 4

确保正确地给出了。env的名称。本地文件