安全的 API 密钥。环境变量。部署安全密钥的正确方法答案

【问题标题】：Secure API keys. Environment variables. Proper way to deploy securing keys安全的 API 密钥。环境变量。部署安全密钥的正确方法
【发布时间】：2021-06-10 23:26:50
【问题描述】：

我有一个使用 Angular 构建的项目。我想托管它，但它使用 API KEY 调用 API。据我了解，没有办法从客户端保护您的密钥。我一直在研究如何做到这一点，但我找不到任何有用的东西。

我想将这个小应用程序部署到 Heroku 以了解如何执行此操作。在我的 environment.ts 文件中，我是否应该用 .env 文件中的变量替换这些值，构建应用程序，然后将键/值对添加到 Heroku 的 Config Vars 中？

【问题讨论】：

标签： node.js angular heroku dotenv

【解决方案1】：

您是否考虑过为 API 调用创建后端？您的服务器可以充当中间人来验证您的用户，并且只对您的代码进行 API 调用。目前尚不清楚您的应用中使用了哪种 API，但公开不打算公开使用的 API 密钥可能会很危险（与旨在公开的 Firebase API 密钥不同）。

无论如何，您不应该存储硬编码或通过配置文件提交到存储库的凭据。基本步骤是：

在您的项目根目录中创建一个.env 文件并将其添加到.gitignore。这是为了本地开发。
在 Heroku CLI 或仪表板中设置生产 config vars。
更新environment.ts:

export const environment = {
  ...rest,
  exampleApiKey: process.env.EXAMPLE_API_KEY,
};

【讨论】：

【解决方案2】：

您可以创建两个环境文件。一种用于开发，一种用于生产：

environment.dev.ts：

export const environment = {
  API_KEY: "XXX"
};

environment.prod.ts：

export const environment = {
  API_KEY: process.env.API_KEY
};

在 angular.cli.json 中定义这些文件：

"environments": {
  "dev": "environment.dev.ts",
  "prod": "environment.prod.ts"
}

将 --prod 添加到 postinstall 脚本，以便在 package.json 中部署 Heroku：

"postinstall": "ng build --aot --prod"

最后，在 Heroku 仪表板中添加 Config Vars 或使用 heroku-cli：

heroku config:set API_KEY=PROD_XXX

【讨论】：