你在JavaScript Web应用程序中使用的第三方API ApiKey存储在哪里?

7
您好,以下是您需要翻译的内容:

在JavaScript Web应用程序中,您如何存储第三方API ApiKey(也称为AppId、AppSecret、AppKey)?如果它在fetch URL中可见并在浏览器网络选项卡中公开,我是否需要保密?

例如:在我的React应用程序中,我使用OpenWeatherMap服务。我需要在其网站上注册并获取api密钥,然后使用以下URL请求数据:

http://api.openweathermap.org/data/2.5/weather?APPID=96547d41585ab16c48ee1evtm1bb1g8&q=London,uk

上述URL中的appid与我的帐户相关联,并且我可以使用此appid进行有限数量的请求。因此,我希望将此appid隐藏起来,不让任何人看到。在React应用程序中是否可能实现这一点?

祝工作愉快!

环境变量。 - Siya Mzam
3
如果你的API密钥是一个付费服务,个人建议不要直接将其暴露给你的WebApp,而是让后端服务器来处理。基本上使用后端作为代理来连接API服务。这样你就能完全掌控了。 - Keith
3个回答

2

一种常见的解决方案是让你的应用程序用户为相关的第三方服务创建自己的API密钥。然后,用户可以将这些密钥提供给您的应用程序,并将它们存储在其个人资料中(在您的应用程序内)。

如果您想要向应用程序用户提供使用您自己的凭据访问第三方服务的权限,则唯一正确且安全的选项是通过您自己的服务器代理请求,您可以在其中安全地存储API密钥而不会暴露它们。


-1

有许多替代方案可以安全地存储API密钥和密码。其中一些允许您使用Git存储库并加密敏感数据。其他工具更为复杂,会在部署工作流程中解密敏感信息。

最受欢迎的工具是(当然,您的选择取决于您的口味和构建的内容)

  1. git-remote-gcrypt(允许您加密整个存储库。非常安全:)
  2. git-secret(允许您在推送之前本地加密特定文件)
  3. BlackBox(与#2几乎相同,但还支持加密小字符串)
  4. Heroku配置和配置变量(如果在Heroku上)(允许您通过配置变量访问敏感信息,这是您放置秘密密钥的位置)
  5. Docker Secrets(允许您定义加密变量,并在运行时将其提供给特定服务。Secrets在传输和静态状态下都进行了加密。)

在我看来,#5是最好的。但正如我所说,这完全取决于您。


5
这些选项中有哪些可以保护Web应用程序内的API密钥? - Keith
Netlify怎么样?我认为你也可以从那里创建环境变量。 - Ali Barani
嗯,我不确定。而且,当 Netlify 还只有 4 个月大时,我回答了这个问题。 - Siya Mzam

-1

谢谢,我可能会开始使用这种方法。 - Liu

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接