如何在 Firebase 主机上设置私有环境变量？

Question

随着 Divshot 最近关闭，我已将许多应用程序切换到 Firebase 托管。其中一些应用程序连接到外部 API，因此我需要一种在 Firebase 托管上存储私有环境变量（例如，用于 S3 访问的密钥）的方法——有人有什么想法吗？有这篇文章 - https://www.firebase.com/blog/2015-10-29-managing-development-environments.html - 但这仅适用于非私有环境变量。

谢谢！

Answer 1

Firebase 托管无法存储私有环境变量。它仅用于静态托管。如果要使用私有变量，则需要在服务器端进行。

如果您想要“Firebase 方式”来处理机密，您可以使用 Firebase Cloud Functions，并在云函数中设置环境变量。这是有关如何执行此操作的文档的链接：https://firebase.google.com/docs/functions/config-env

如果您没有将云功能添加到您的 Firebase 托管，您可以通过 Firebase cli 工具进行添加：

firebase init functions
npm install --save firebase-functions@latest
npm install -g firebase-tools

在此处了解更多信息：https://firebase.google.com/docs/hosting/functions

为了在云函数中设置环境变量，您可以从命令行进行，如下所示：

firebase functions:config:set someservice.key="THE API KEY" someservice.id="THE CLIENT ID"

然后您可以像这样从函数中访问变量：

const functions = require('firebase-functions');
const request = require('request-promise');

exports.userCreated = functions.database.ref('/users/{id}').onWrite(event => {
  let email = event.data.child('email').val();

  return request({
    url: 'https://someservice.com/api/some/call',
    headers: {
      'X-Client-ID': functions.config().someservice.id,
      'Authorization': `Bearer ${functions.config().someservice.key}`
    },
    body: {email: email}
  });
});

Answer 2

你可以试试谷歌的Secret Manager API。

这比将其作为环境变量存储在 Firebase Cloud Functions 中更安全的原因是：

1. Secret Manager API 强制执行最小权限原则。这意味着您可以限制对机密的访问，因此只允许授权用户查看/编辑机密。
2. 秘密使用 AES-256 加密。
3. 有一个审核日志记录功能可用于异常检测。

有关源代码的更多示例，您可以查看 Google Cloud 的 Secret Manager NPM 包文档here。

希望对你有帮助！

Answer 3

根据这篇文章，我有一个适合我的解决方案： https://victorbruce82.medium.com/how-to-deploy-a-react-app-to-different-firebase-hosting-environments-dev-and-prod-da3f4cae9a1e

它使用env-cmd，您不需要云函数来获取当前运行站点的firebase 上的正确环境变量（因为NODE_ENV 在部署到firebase 时总是返回production）

基于使用两个独立的 firebase 项目，一个用于生产，一个用于开发。所以在添加第二个firebase项目后，用于开发：

将开发项目添加到您当前的项目中：firebase use --add，并使用别名 dev。

创建两个 .env 文件：.env.production 和 .env.development，每个文件都有一个变量，例如：

APP_ENV="production"

（在.env.development文件中改成development）

（您还可以将 API 密钥添加到这些 .env 文件中，确保您 .gitignore 他们，这样您的代码库中就没有秘密了）

现在在您的代码中，您可以使用process.env.APP_ENV 引用它：

const websiteConfig = process.env.APP_ENV=== 'production' ? {
  themeColor: '#fff'
} : {
  themeColor: '#ccc'
}

（您也可以选择在您的 .env 文件中添加 APP_THEME_COLOR 并直接访问它，具体取决于您的偏好）

安装env-cmd

npm i -D env-cmd

现在将 2 个脚本添加到您的 package.json：

"build:dev":"env-cmd -f .env.development npm run build && firebase deploy -P dev",
"build:prod":"env-cmd -f .env.production npm run build && firebase deploy -P prod"

现在您可以将代码部署到两个字面上不同的环境，但也可以让它们具有不同的环境变量。

（注意：在您的 .env 文件中使用 NODE_ENV 不起作用，当部署在 Firebase 主机上时，它将始终返回 production）

Answer 4

如果您希望使用 GitHub 操作部署到 Firebase，可以考虑在构建和部署之前创建 .env 变量。

只需在 GitHub 存储库设置和 .github/workflows/{action}.yml 中将环境变量设置为机密，添加此步骤

...
- name: Create env file
    run: |
      touch .env
      echo API_ENDPOINT=${{ secrets.API_ENDPOINT }} >> .env
      echo API_KEY=${{ secrets.API_KEY }} >> .env
      cat .env
...

在您的代码库中，只需调用 process.env.API_KEY 即可使用该变量！

感谢@sugarcane 并找到原始答案here