Firebase登录在Localhost上失败，但在生产中有效

Question

与问题相关的代码

<SimpleButton
onClick={this.onClickLogin}
disabled={!this.isEmailPasswordValid()}
style={{ width: '50%' }}
id="gi-auth-modal-log-in-button">
Log In
</SimpleButton>

async onClickLogin() {
const that = this;
this.props
.loginWithPassword(that.state.email, that.state.password)
.then(() => {
that.props.closeModal();
})
.catch(e => console.log(e))
}

export const loginWithPassword = (email, password) => async (dispatch) => {
return await firebase
.auth()
.signInWithEmailAndPassword(email, password)
.then(async (userData) => {
await dispatch(login(userData));
})
.catch(handleFirebaseError);
};

当我在localhost上运行此项目并尝试登录(使用有效凭据(时，onClickLogin会捕获以下错误：

{
"code": "auth/invalid-api-key",
"message": "Your API key is invalid, please check you have copied it correctly."
}

错误消息看起来很简单，但关键是：在生产中也可以使用相同的代码。我的假设是，由于这段代码在生产环境中工作，但在本地主机上不工作，这是某种环境配置问题。

请帮助我了解它可能是什么，以及开发人员和生产人员之间的登录行为是否存在任何差异(假设两者使用相同的数据库(。

Firebase参考代码：

import * as firebaseAdmin from 'firebase-admin';
const firebaseConfig = {
apiKey: process.env.FIREBASE_KEY,
projectId: process.env.FIREBASE_PROJECT_ID
};
firebaseAdmin.initializeApp(firebaseConfig);

Answer 1

答案很晚，但我也遇到了同样的问题。您是否安装了Allow CORS扩展？尝试将其切换到关闭状态，然后重试。

Answer 2

确保您在firebase项目的授权域列表中添加了localhost