在 angular 中验证 JWT 令牌

Question

我的应用程序后端运行在 Django Rest Framework 上，前端运行在 Angular。

我已经在使用 JWT 进行身份验证并且工作正常。

我的要求是调用特定的 API（与身份验证无关），这会以纯文本形式为我提供一些详细信息。我不想要它的纯文本形式，所以我想我会创建一个 JWT 令牌并发送它作为响应并使用密钥在前端对其进行解码。

解码部分我是用jwt-decode实现的，没有秘钥。我担心的是，如果攻击者拦截了我的响应并修改了令牌，我该如何应对这种情况？

这就是我在 angular

中解码令牌的方式

try {
  decoded = jwt_decode(token);
  return decoded;
} catch (Error) {
  return null;
}

有什么方法可以 verify/decode 我的令牌在 Angular 中的秘密？类似于：

data = jwt.decode(encoded_token, 'SECRET_KEY', algorithms=['algo']) # Python Code

请在这里指导我。如果有任何其他方法可以实现我想要的，请告诉我

Answer 1

I don't want it in plain text, So I was thinking I would create a JWT Token and send it in response and decode it in frontend using the secret key.

JWT 令牌通常是 plain-text。有两种类型的 JWT——JWS（签名 JWT）和 JWE（加密 JWT）。后者对内容进行了加密，因此除非拥有解密密钥，否则任何人都无法阅读它。但是，加密很难配置和管理，因此 JWE 并不经常使用。您需要一个非常充分的理由来使用 JWE。签名的 JWT (JWS) 更为常见。事实上，当人们使用 JWT 这个术语时，他们通常指的是 JWS。签名的 JWT 是 integrity-protected。使用签名，您可以验证 JWT 是否未被攻击者更改，但它们是 plain-text。任何人都可以阅读 JWT 的内容，只是不能修改它。

另请记住，Angular 应用程序的所有代码都可供用户使用，这意味着它不能保留任何秘密。如果您在 Angular 应用程序中放置了一个秘密，那么任何人都可以读取该秘密并使用它来解密您的 JWE，或者在您使用对称签名（例如 HS256 算法）的情况下伪造新的 JWS。

I achieved the decoding part using jwt-decode without the secret. My concern is, if an attacker intercepts my response and modifies the token, How do I tackle that situation?

如果您担心 Man-in-the-middle 攻击，有人会修改您服务器的响应，那么您只需要一个 HTTPS 连接。如果您使用 HTTPS 连接到您的 API，那么您可以确定没有人修改或阅读响应。

如果您担心您的响应会在 HTTPS 终止后被修改（例如浏览器中的恶意代码运行），那么您可以使用 JWS 来确保响应的完整性。您只需要记住使用非对称签名，这样 Angular 应用程序只会保留 public 密钥。

我不知道您在 Angular 中使用的是哪个 JWT 库，但我认为它们都能够验证签名，所以这应该不是问题。

在 angular 中验证 JWT 令牌

Verify JWT Token in angular

python

jwt

django-rest-framework

angular