Firebase DatabaseURL - 配置 firebase答案

【问题标题】：Firebase DatabaseURL - configuring firebaseFirebase DatabaseURL - 配置 firebase
【发布时间】：2018-09-29 09:23:27
【问题描述】：

我正在尝试将 Firebase 与我的 react 应用一起使用。

我有一个配置如下的文件：

import * as firebase from 'firebase';

const config = {
  apiKey: process.env.FIREBASE_API_KEY,
  authDomain: process.env.FIREBASE_AUTH_DOMAIN,
  databaseURL: process.env.FIREBASE_DB_URL,
  projectId: process.env.FIREBASE_PROJECT_ID,
  storageBucket: process.env.FIREBASE_STORAGE_BUCKET,
  messagingSenderId: process.env.FIREBASE_MESSAGE_ID,
}

if (!firebase.apps.length) {
  firebase.initializeApp(config);
}

const database = firebase.database();
const auth = firebase.auth()

export {firebase, auth, database };

当我尝试这个时，我收到一条错误消息：

FIREBASE 致命错误：无法确定 Firebase 数据库 URL。请务必在调用 firebase.initializeApp() 时包含 databaseURL 选项。

我无法理解这个错误，因为我在初始化应用程序的调用中包含了配置。 Config 包含数据库 URL。

如何初始化数据库？

【问题讨论】：

标签： firebase firebase-realtime-database

【解决方案1】：

这里也是同样的问题。上下文：盖茨比 - gatsby-node.js

出于某种原因，它不喜欢我的环境数据库网址。需要硬编码那个值。

    const config = {
      apiKey: process.env.GATSBY_FIREBASE_API_KEY,
      authDomain: process.env.GATSBY_FIREBASE_AUTH_DOMAIN,
      databaseURL: "https://blabla.firebaseio.com",
      projectId: process.env.GATSBY_FIREBASE_PROJECT_ID,
      storageBucket: process.env.GATSBY_FIREBASE_STORAGE_BUCKET,
      messagingSenderId: process.env.GATSBY_FIREBASE_MESSAGING_SENDER_ID
    }

它成功了。

嘿嘿

【讨论】：

现在知道原因了吗？ :)
虽然这是一种解决方法，但很高兴知道为什么无法访问此环境变量的值。

【解决方案2】：

您不需要在 firebase.initializeApp(config); 周围使用 if 语句

  import * as firebase from 'firebase';

  const config = {
    apiKey: process.env.FIREBASE_API_KEY,
    authDomain: process.env.FIREBASE_AUTH_DOMAIN,
    databaseURL: process.env.FIREBASE_DB_URL,
    projectId: process.env.FIREBASE_PROJECT_ID,
    storageBucket: process.env.FIREBASE_STORAGE_BUCKET,
    messagingSenderId: process.env.FIREBASE_MESSAGE_ID,
  }

  firebase.initializeApp(config);

您不需要导出这些对象，一旦您初始化应用程序，它应该可以在项目中使用而无需导出。

  const database = firebase.database();
  const auth = firebase.auth()

  export {firebase, auth, database };

【讨论】：

【解决方案3】：

不要多次初始化 firebase。

https://github.com/firebase/firebase-functions/issues/228

【讨论】：

【解决方案4】：

我认为是复制粘贴错误:)

在 .env 文件中 REACT_APP_DATABASE_URL

但我使用 process.env.REACT_APP_DB

请检查一下，效果很好

import firebase from 'firebase/app'
import 'firebase/database';
const config = {
    apiKey: process.env.REACT_APP_APIKEY,
    authDomain: process.env.REACT_APP_AUTHDOMAIN,
    databaseURL: process.env.REACT_APP_DATABASE_URL,
    projectId: process.env.REACT_APP_PID,
    storageBucket: process.env.REACT_APP_SB,
    messagingSenderId: process.env.REACT_APP_SID,
    appId: process.env.REACT_APP_APPID,
    measurementId: process.env.REACT_APP_MID
};


firebase.initializeApp(config);
const database = firebase.database();

export { database };
export default firebase;

【讨论】：

天哪，这是我的确切问题，我真的为此在背后踢自己。谢谢亲！救生员

【解决方案5】：

我知道这是一个旧线程，但我从昨晚开始就遇到了这个问题，我花了几个小时绞尽脑汁想弄清楚我的代码出了什么问题。澄清一下，所有 .env 变量都被 cra 读取，除了 firebase 数据库 url。

我尝试了以下步骤：

检查拼写错误，包括 .env 变量以及 url 是否正确。
我尝试将 .env 变量打印到控制台和屏幕，但是当我这样做时，对于所有 env 变量的值都是未定义的。这真的不应该发生，我很困惑。
尝试了各种方法，将 FIREBASE_DATABASE_URL 的 .env 变量名称更改为像 XYZ 之类的随机名称（只是为了让它以某种方式工作），因为我认为一些 env 变量由于同名而发生冲突，但仍然没有工作。
它起作用的唯一方法是对其进行 har 编码，但这是一种 hack，而不是解决方案。

需要注意的是第 2 点。即使在硬编码之后打印环境变量时，控制台上的结果也是“未定义”。所以一切都没有错，代码应该可以工作，但为什么不呢？出于纯粹的随机性，我打开了任务管理器（Windows）。我注意到节点服务器正在运行，但我已经关闭了反应开发服务器！我杀死了进程并重新启动了反应服务器，现在它可以工作了。

问题是在后台运行陈旧的节点服务器，代码没有任何问题。这也解决了第 2 点，console.log 语句现在正在工作。

这可能不是每个人的问题的解决方案，但它可能是或 3 年前提问者的问题，因为他们的代码在语法上没有任何问题。

【讨论】：

【解决方案6】：

重新启动开发服务器可以解决问题，如果您刚刚编写代码并尝试编译它会引发此错误。因此，您可以尝试退出批处理作业并再次重新启动服务器。

【讨论】：

【解决方案7】：

我也得到了这个与 firebase 相关的未捕获错误。Atlast 最终错误应该得到解决。实际上，当我们使用环境变量时，它们不应该传递给 bundle.js 文件，它是一个客户端 javascript 文件。我们可以使用“DefinePlugin”，它是一个 webpack 插件，应该手动将这些环境变量传递给 bundle.js 文件.

【讨论】：

【解决方案8】：

看起来你的代码很好。只需打印并检查 process.env.FIREBASE_DATABASE_URL ，它与 firebase 控制台中提到的完全相同。（如果您使用的是 create react app，请不要忘记将 REACT_APP_ 添加到所有环境变量中，https://create-react-app.dev/docs/adding-custom-environment-variables/）

import * as firebase from 'firebase/app';
import 'firebase/auth';
import 'firebase/firestore';
import 'firebase/functions';
import 'firebase/storage';

const appConfiguration = {
    apiKey: process.env.REACT_APP_API_KEY,
    authDomain: process.env.REACT_APP_AUTH_DOMAIN,
    databaseURL: process.env.REACT_APP_DATABASE_URL,
    projectId: process.env.REACT_APP_PROJECT_ID,
    storageBucket: process.env.REACT_APP_STORAGE_BUCKET,
    messagingSenderId: process.env.REACT_APP_MESSAGING_SENDER_ID,
    appId: process.env.REACT_APP_APP_ID,
    measurementId: process.env.REACT_APP_MEASUREMENT_ID
};

export const session_type = firebase.auth.Auth.Persistence.LOCAL;

export const app = firebase.initializeApp(appConfiguration);
export const auth = app.auth();
export const db = app.firestore();
export const storage = app.storage();

将完成工作。

【讨论】：

【解决方案9】：

我只是粘贴了硬编码配置，它对我有用

const config = {
  apiKey: "AIzaSyBA2C8S7****************-gCw",
  authDomain: "e**********-2aa4c.firebaseapp.com",
  databaseURL: "https://************.firebaseio.com",
  projectId: "ea********2aa4c",
  storageBucket: "ea************2aa4c.appspot.com",
  messagingSenderId: "1765********26",
}

【讨论】：

【解决方案10】：

这里有同样的问题，但是在将 firebaseconfig 放入 componentDidMount() 后它会解决。

componentDidMount(){

const firebaseConfig = {
  apiKey: process.env.FIREBASE_API_KEY,
  authDomain: process.env.FIREBASE_AUTH_DOMAIN,
  databaseURL:process.env.FIREBASE_DATABASE_URL,
  projectId: process.env.FIREBASE_PROJECT_ID,
  storageBucket: process.env.FIREBASE_STORAGE_BUCKET,
  messagingSenderId: process.env.FIREBASE_MESSAGING_SENDER_ID
};
firebase.initializeApp(firebaseConfig);
const myitem = firebase.database().ref('items/').once('value',snapshot=>{
  console.log(snapshot.val())
})

}

【讨论】：

componentDidMount 和这个有什么关系？

【解决方案11】：

在 firebase.js 中，当我删除 databaseURL: 和 process.env.FIREBASE_DATABASE_URL. 之间的空白时，它起作用了。

const config = {
  apiKey: process.env.FIREBASE_API_KEY,
  authDomain: process.env.FIREBASE_AUTH_DOMAIN,
  databaseURL:process.env.FIREBASE_DATABASE_URL,
  projectId: process.env.FIREBASE_PROJECT_ID,
  storageBucket: process.env.FIREBASE_STORAGE_BUCKET,
  messagingSenderId: process.env.FIREBASE_MESSAGING_SENDER_ID
};

【讨论】：

这怎么可能是一个解决方案？？