控制台中的 Firebase 无效 api 密钥错误

Posted 2023-03-13

【中文标题】控制台中的 Firebase 无效 api 密钥错误

【英文标题】：Firebase invalid api key error in console

【发布时间】：2019-07-05 06:54:20

【问题描述】：

我将 Firebase-auth 用于我正在使用电子框架开发的 Web 应用程序。我使用项目设置创建了一个 API 密钥，并按照 Firebase 指南中的建议将其复制到我的 html 正文中。但是，当我在浏览器上打开 HTML 页面时，控制台显示以下错误。

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

HTML页面正文的底部如下。

 <script src="https://www.gstatic.com/firebasejs/5.8.2/firebase.js"></script>
          <script>
            // Initialize Firebase
            var config = 
              apiKey: "AIzaSyAXXXXXXXXXXXXXXXXXXXXjILO32ZDxRKY",
              authDomain: "jumbleup-773da.firebaseapp.com",
              databaseURL: "https://jumbleup-773da.firebaseio.com",
              projectId: "jumbleup-773da",
              storageBucket: "jumbleup-773da.appspot.com",
              messagingSenderId: "971123072180"
            ;
            firebase.initializeApp(config);
          </script>

注意：我通过将 20 位数字更改为 X 来混淆真正的密钥。

【问题讨论】：

它是你主进程中的脚本吗？

我在 index.html 中使用了这段代码，而 index.html 又调用了 renderer.js

尝试在render.js中写入并将这个js文件追加到index.html中

【参考方案1】：

您的 API 密钥无效，请检查您是否正确复制了它

出现此错误的原因有很多。我想解释一下我是如何解决这个问题的。

首先，我为我的网站复制了 firebaseConfig 变量单击复制按钮，并将其保存在我的源文件夹下，创建了一个名为 firebase.config.js 的文件。

export const firebaseConfig = 
    apiKey: 'AIzaSxxxxxxxxxxxxxxxxxxxxxxx',
    authDomain: 'fir-axxxxxxxxxxxxxxxxxxxxxxxxxx',
    projectId: 'fir-axxxxxxxxxxxxxxxxx',
    storageBucket: 'fir-axxxxxxxxxxxxxxxxxx',
    messagingSenderId: '106xxxxxxxxxxxxxx',
    appId: '1:1064xxxxxxxxxxxxxxxxxxxxxxxxxxxx',
;

其次，我通过将 firebaseConfig 变量导入到我的App.js 文件中来调用它。

import  firebaseConfig  from './firebase.config';

最后，我在下面这一行中使用了这个变量。

firebase.initializeApp(firebaseConfig);

如果您从这个解决方案中得到一些帮助，请按 upvote。谢谢。

【参考方案2】：

首先安装firebase，然后 首先将 firebase 导入为 import firebase from 'firebase'; 或在 js 脚本中。 下面的代码用于将应用程序连接到 firebase，其中包括 id 和连接 firebase 的所有详细信息。

const config =

    apiKey: "XXXXXXXXXXXX",
    authDomain: "app.firebaseapp.com",
    databaseURL: "https://app.firebaseio.com",
    projectId: "XXXXXX2",
    storageBucket: "XXXXXX.appspot.com",
    messagingSenderId: "5..........",
    appId: "1:52807............."


firebase.initializeApp(config);
export default firebase;

【参考方案3】：

export const environment = 
  production: false,
  firebaseConfig: 
    apiKey: "AIzxxxxxxxxxxxxxxxxxxxxxxx",
    authDomain: "chxxxxxxxxxxxxxx",
    projectId: "chxxxxxxxxxxxxxxxx",
    storageBucket: "chxxxxxxxxxxxxxxxx",
    messagingSenderId: "7xxxxxxxxxxxxxxx",
    appId: "1:7xxxxxxxxxxxxxxxxxxxxxxxxx",
    measurementId: "G-xxxxxxxxx"
  
;

将此添加到您的环境中。ts

【参考方案4】：

我正在使用 React。 我也遇到了同样的错误，因为在我的 .env 文件中，我在声明之后出现了,。

之前： REACT_APP_API_KEY="AIXXXXXXXXXXXX",

之后： REACT_APP_API_KEY="AIXXXXXXXXXXXX"