带有托管 URLS 的 Firebase 实时数据库设置答案

【问题标题】：Firebase Realtime Database setup with hosting URLS带有托管 URLS 的 Firebase 实时数据库设置
【发布时间】：2020-10-29 22:46:15
【问题描述】：

我是 Firebase 新手，正在构建一个由 Firebase 实时数据库支持的 React 应用。

根据docs - 您可以使用保留的托管 URL 来初始化 Firebase SDK。用他们的话说：

要在您的应用中初始化 Firebase，您需要提供应用的 Firebase 项目配置。如果您使用保留的托管 URL，您的 Firebase 配置会自动从您的 Firebase 项目中提取，因此您无需在代码中明确提供该对象。

但是，在他们的 Realtime Database Initialization 文档中，他们说使用以下代码 sn-p 初始化您的 SDK：

  // TODO: Replace with your project's config object
  var config = {
    apiKey: "apiKey",
    authDomain: "projectId.firebaseapp.com",
    databaseURL: "https://databaseName.firebaseio.com",
    storageBucket: "bucket.appspot.com"
  };
  firebase.initializeApp(config);

  // Get a reference to the database service
  var database = firebase.database();

这看起来像一个配置对象。但是，如果您使用托管 URL，这些 URL 不是从您的 Firebase 项目中提取的吗？有没有人举例说明如何将保留的托管 URL 与实时数据库一起使用？

【问题讨论】：

标签： javascript reactjs firebase firebase-hosting

【解决方案1】：

见https://firebase.google.com/docs/web/setup#add-sdks-initialize

如何将 Firebase SDK 添加到您的应用取决于您是否选择为您的应用使用 Firebase 托管、您在应用中使用的工具（如捆绑程序），或者您是否正在配置节点。 js 应用程序。

来自托管 URL
来自 CDN
使用模块捆绑器
Node.js 应用程序

如果您使用保留的托管网址，您的 Firebase 配置会自动从您的 Firebase 项目中提取，因此您无需在代码中明确提供该对象。

仅适用于From Hosting URLs。

在您的应用中初始化 Firebase（使用保留的托管 URL 时无需包含您的 Firebase 配置对象）：

你应该像下面的代码一样初始化 Firebase。

<body>
  <!-- Previously loaded Firebase SDKs -->

  <!-- Initialize Firebase -->
  <script src="/__/firebase/init.js"></script>
</body>

您可以查看__/firebase/init.js 示例https://friendly-pix.com/__/firebase/init.js

From Hosting URLs样本：

你能检查一下其他样本吗？

【讨论】：

【解决方案2】：

为了让 Firebase SDK 能够在服务器上找到您的 Firebase 项目，它需要某些配置数据。它有多种方法可以获取此数据。在您的场景中，两种相关方式是：

您可以使用从 Firebase 控制台复制的 JSON 的 sn-p 指定代码中的配置数据
当您使用 Firebase 模拟器和/或部署到 Firebase 托管时，它可以通过名为 /__/firebase/init.js 的“神奇”文件 automatically get the configuration data

这两个选项也列在 adding the Firebase SDKs to a web app 的文档中，位于 From Hosting URLs 和 From the CDN 下。根据该文档，这是您自动配置加载的 SDK 的方式：

<body>
  <!-- Previously loaded Firebase SDKs -->

  <!-- Initialize Firebase -->
  <script src="/__/firebase/init.js"></script>
</body>

【讨论】：