所以，我正在开发一个仅供自己使用的小应用程序，也许是 Git 上的一个开源项目。我正在使用 Envato Marketplaces 的 API，众所周知，有些操作不需要任何密钥，但同时也有一些需要。
我首先用 PHP 为 Envato API 制作了一个很好的 API 包装器，但后来我决定用 JavaScript 进行一些试验，所以我正在用 JavaScript 开发相同的包装器。到目前为止，我对公共操作没有任何问题，但我现在必须使用 API 密钥。
我的问题是是否有一种方法可以保护 JavaScript 中的 API 密钥。我不能只是把它以纯文本形式放在那里，因为它可以被看到代码的其他人使用。那么会不会有 API 保密的实现呢？也许使用 XHR 从 JSON 文本文件中获取它？
简答：否
无论你做什么来混淆密钥，你仍然必须以某种方式发送它以使其在客户端可用，因此可以使用 fx 提取它。萤火虫
即使你设计了一种很棒的神奇方法来保密密钥，在某些时候你也必须发出实际的 API 请求，因为它必须从浏览器发送，攻击者将能够读出在 Firebugs 网络选项卡中键入纯文本。
正确的做法是围绕需要密钥的 API 调用创建一个 PHP 包装器，然后从 Javascript 调用该包装器。
我现在的解决方案是用 Rust 编写一个小包装器，然后将其放入 /cgi-bin 并对其进行调用。这应该使 api-key、api creds 和会话数据与客户端分开。
在使用 JS 时，您的代码通常在两种环境中执行 - 客户端（浏览器）或服务器（节点）。
要使 API 密钥保密，您首先需要确保它永远不会到达客户端。任何到达客户端的代码都可以轻松调试 API 密钥等
那么，如何实现API key隐藏呢？
将 API 密钥存储在后端，让后端为您发出请求。
例如 而不是像这样从客户端/前端直接与第三方 API 交互：
axios.get('https://api.some-weather api.com/weather?lat={lat}&lon={lon} &api_key={API_KEY}`)
你可以调用你的后端 API，它可以像这样调用 3rd-party API:
axios.get('https://api.your-project.com/ weather?lat={lat}&lon={lon}`)
您的后端 api 然后可以使用通过 env 文件存储的 API 密钥调用第 3 方 API（仅存在于后端）：
axios.get('https://api.some-weather api.com/weather?lat={lat}&lon={lon} &api_key={API_KEY}`)
这样您就不会公开您的 API 密钥，它们不会包含在您的 Web 应用程序的构建中，因此它们不会出现在开发人员工具中。
一旦您尝试在前端代码中直接使用环境变量，您就会将它们暴露给网络。通常通过捆绑工具/生态系统将 env var 从 .env 文件中提取出来，并将值烘焙到捆绑的前端代码中。
注意： 既然你提到了开源，我还要补充一点，让特定于环境的数据和机密不直接进入源代码控制是一种很好的做法。
Env 变量（带有被 gitignored 的 .env 文件）主要在源代码中对其他开发人员隐藏它，比如 git repo 和部署日志。
session context是一个有点迷失的概念。但是，如果您的异步请求调用可以跟踪您的活动会话的服务器，那么在服务器进行 API 调用之前，服务器可以在向服务提供商发送请求时为该请求添加一个映射的 API 密钥。服务提供商可以验证接收请求的域，这将是保护 API 密钥和请求欺骗的更有效方法。