如何在保护api密钥的同时使用javascriptapi？

Question

这里是初学者。我有一个应用程序消耗 Here's Geocoding REST API 到 node.js（w/express）。 （我的 api 密钥在服务器端，因此对客户端隐藏。）

但我意识到要向地图数据添加自定义标记和其他 UI，我还需要使用 Here's Javascript API。根据我在文档中看到的内容，我加载 API 并在客户端实现功能；但这意味着我的 api 密钥会暴露。所以，我从根本上对如何在服务器端实现这个 javascript API 感到困惑（这样 api 密钥和代码对客户端隐藏）。

bundling 或 Next.js 的 SSR 会是答案吗？

这可能有一个明显的答案，但我可以找到 none。任何见解将不胜感激。谢谢

Answer 1

如果您使用的是节点，您可能需要使用一些库，例如 dotenv，并在环境变量中包含 API 键。

通过服务器对 API 进行的调用不会暴露给客户端。

# .env file
API_KEY="your api key goes here"

# index.js
require('dotenv').configure('./path_to_dotenv_file')

const API_KEY = process.env.API_KEY;

# use API_KEY to make any calls you need.

切记不要将 .env 文件添加到您的存储库，也许可以尝试向您的项目添加一些身份验证。

Answer 2

我不知道那个特定的 API，但如果服务需要 API 密钥，那么您永远不应以任何方式将该密钥暴露给客户端。

您可以通过创建自己的 API 并将秘密存储在环境变量中来保护它：

使用 Environment Variables 的内置系统来存储机密并排除 .git 中的 .env 文件。忽略。这可以保护您免于将秘密提交到 public git 存储库（还有其他优点）。 但是，这并不能保护您免于意外地将这些秘密暴露给客户端。当您在客户端代码中使用环境变量时，它们将被嵌入到包中并发送到客户端。 Next.js 实际上通过使 env 变量仅对服务器环境可用来防止您犯此错误，除非您通过在它们前面加上 NEXT_PUBLIC_.

前缀来专门公开它们

相反，创建您自己的后端并仅在那里使用密钥。您可以使用 next.js API routes 轻松做到这一点。这样客户端就可以向您自己的 API 发出请求，然后可以使用密钥对 Here API 进行实际调用。 创建自己的后端还允许您通过限制用户可以执行的操作或使用用户身份验证来实施额外的保护。