Question

我正在做一个项目，在该项目中，我们已有Firebase使用的预先存在的云功能。我们正在添加一个使用Firebase云托管的小型React SPA，该SPA将与一些现有的公共云功能进行交互。

到目前为止，我们的工作方式是，在Firebase中有一个dev项目和一个production项目。对于云功能，这很好用，我们使用firebase functions:config:set设置了特定于环境的配置，以区分产品服务器和开发服务器。

问题与托管的SPA联系云功能有关。我已经看到了很多有关如何在托管代码中访问环境配置的问题，例如：How to reference Firebase Functions config variables from a Firebase-hosted application?，其中的答案似乎是具有返回环境变量值的firebase函数，但对于对我来说，这只是使问题进一步发展。我完全理解，由于SPA在浏览器中运行，因此可以访问此代码的环境变量将是一个严重的安全问题。

我真正需要托管SPA的唯一特定于环境的配置是云功能的基址。

例如，如果我在云功能中拥有

const functions = require('firebase-functions');
const express = require('express');
const test = express();
test.on('/hello/:target', (req, res) => {
  res.send(`Hello ${req.params.target}`);
})
exports.test = functions.https.onRequest(test);

然后已部署，此云功能可在https://us-central1-DEV-PROJECT-NAME.cloudfunctions.net/test/hello/world和https://us-central1-PROD-PROJECT-NAME.cloudfunctions.net/test/hello/world上使用。如何最好地为SPA部署到的项目获取适当的根URL（https://us-central1-DEV-PROJECT-NAME.cloudfunctions.net或https://us-central1-PROD-PROJECT-NAME.cloudfunctions.net）？

例如我可以在前端js代码中访问一些全局代码，例如：

const url = `${__FIREBASE_GLOBALS__.cloudFunctions.baseUrl}/test/hello/${input}`;

是否根据托管应用程序部署到哪个项目正确定义了URL？

Answer 1

我在这里假设您不是在SPA中以其他任何方式使用Firebase，而是要调用Cloud Functions（因为您没有另外说）。

阅读Firebase web setup docs for Firebase Hosting，尤其是关于SDK imports and implicit initialization的部分。当您使用Firebase Hosting托管网站时，会有一些特殊的URL为您提供该项目的配置。其中包括一些特殊脚本，可让您访问Firebase产品。特别要注意的是，相对路径URI /__/firebase/init.js将产生JavaScript，该JavaScript使用项目的默认设置初始化Firebase JavaScript SDK。继续并在指向您的Web应用程序的浏览器中访问它。您可能对配置的projectId属性感兴趣。

如果您想保留该值，则可以使用Firebase SDK，它将由上面第一个链接中的脚本进行初始化。最少可以添加：

<script src="/__/firebase/5.8.2/firebase-app.js"></script>
<script src="/__/firebase/init.js"></script>

然后稍后在（see API docs）：

firebase.app().options.projectId

获取Firebase托管服务内容的项目的ID。您可以使用它来构建函数的URL。

将HTTP函数移植到callable functions并使用Firebase SDK从网站调用它们以调用kthem可能也很方便。是否。

Answer 2

我能够从环境变量中获取区域和appId。

例如：

console.log(process.env);

检查您的Firebase日志

{ ...
  ENTRY_POINT: 'server',
  X_GOOGLE_FUNCTION_TRIGGER_TYPE: 'HTTP_TRIGGER',
  FIREBASE_CONFIG: '{"projectId":"pid","databaseURL":"https://pid.firebaseio.com","storageBucket":"pid.appspot.com","locationId":"europe-west"}',
  X_GOOGLE_FUNCTION_NAME: 'server',
  FUNCTION_TRIGGER_TYPE: 'HTTP_TRIGGER',
  X_GOOGLE_GCLOUD_PROJECT: 'pid',
  FUNCTION_NAME: 'server',
  X_GOOGLE_GCP_PROJECT: 'pid',
  X_GOOGLE_FUNCTION_REGION: 'us-central1',
  FUNCTION_REGION: 'us-central1',
  X_GOOGLE_ENTRY_POINT: 'server',
  GCLOUD_PROJECT: 'pid',
  GCP_PROJECT: 'pid',
  ... ommited
}

在这些GCP_PROJECT，GCLOUD_PROJECT，FUNCTION_REGION，FUNCTION_NAME中应该起作用。因此，例如。 process.env.FUNCTION_REGION

不确定这将有多可靠。

如何在Firebase托管的Webapp中获取Firebase函数URL？

2 个答案: