在 Angular2 中保护 API 密钥

Posted 2023-03-10

【中文标题】在 Angular2 中保护 API 密钥

【英文标题】：Securing API Key in Angular2

【发布时间】：2016-05-12 13:44:01

【问题描述】：

我已经在谷歌上搜索了一天多。可能是我错过了正确的关键字。

我有以下设置：

ExpressJS API（使用 pm2 在端口 3000 上运行） Angular2 应用程序 - 已服务 通过 nginx

两者都在同一台服务器上运行。

对 api (mydomain/api/) 的调用被代理到 127.0.0.1:3000

对于需要授权的 api 调用，我将使用 JWT 和用户身份验证。

我想要实现的是为我的 angular2 应用程序生成一个令牌，允许/需要它来进行公开调用（例如产品列表）。

这个令牌当然需要安全转移，因为我不希望其他人通过直接 api 调用（使用被盗令牌）获得我的产品和价格。

任何帮助表示赞赏。

【参考方案1】：

首先，正如@eesdil 所说，您必须使用 HTTPS。在这种情况下，您的所有通话都是加密且安全的。

在我的示例（Angular 2、Express 和 JWT）中，我使用了带有 pbkdf2 算法的加密模块来散列密码。

这是工作流程：

/login/signup -> 哈希密码并生成盐 -> 存储在服务器上 /login -> 根据存储的密码验证密码 -> 生成 jwt -> 将其保存在客户端的 localStorage 中 /api -> 在

Auth

标头中发送 jwt -> 在服务器上验证 -> 发送响应

工作示例在这里：https://github.com/vladotesanovic/angular2-express-starter

【讨论】：

好的，非常感谢。但是，假设您的入门应用程序将在主页上列出城市。我不希望人们直接调用 api/cities。所以我生成了一个内部分配给公共 api 调用的 JWT。我猜我可以通过 express-session 以一种安全的方式提供公共 JWT。我将在整个过程中设置 https 和我的想法，然后返回结果。

不，不要使用会话和 cookie 来存储或传输 jwt 令牌。无论他们从哪个位置调用 /api/cities，他们都需要拥有有效的 jwt。我将使用 /refresh 功能改进我的示例。您可以在客户端对 jwt 进行编码，并查看它们何时到期...

【参考方案2】：

您的令牌有望与 https 一起传播。当它出现时，他们无法得到它......

更新

来自维基：

因为 HTTPS 完全在 TLS 之上搭载 HTTP，所以整个 底层 HTTP 协议可以加密。这包括 请求 URL（请求了哪个特定网页），查询 参数，标题，

https://en.wikipedia.org/wiki/HTTPS

【讨论】：

对不起，我在这部分有点笨。我当然会设置https。但是我仍然必须将我的公共令牌包含在 Angular 应用程序的请求标头/url 参数中，因此任何人都可以看到它。还是我错过了什么？

查看 wiki，因为 https 是应用层协议，它也对标头进行加密。

是的，您在每次调用中都包含令牌。但是该令牌是在服务器上生成的......我现在有类似的设置（express - angular 2）我将在这里提交我的工作流程作为答案。

那太棒了@VladoTesanovic