登录后的Angular JWT和用户信息存储

Posted 2023-03-05

【中文标题】登录后的Angular JWT和用户信息存储

【英文标题】：Angular JWT and user info storage after login

【发布时间】：2015-03-01 04:44:38

【问题描述】：

成功登录后将除 JWT 之外的任何其他用户信息保存在 localstorage 或 cookie 中的最佳做法是什么？ （用户配置文件对象已在 jwt 有效负载子部分中保存和加密。）我需要准备好用户配置文件对象，然后再以角度初始化任何其他内容（用于获取用户角色、登录状态等）。

如果我只在客户端保存 JWT，我需要一个额外的 ajax 请求才能在应用程序加载之前从服务器端的 JWT 解码中获取用户信息，因为令牌密钥在服务器上（仅在整页刷新之后）。令牌有效或无效，因此在这种情况下处理错误要容易得多。

如果我将 JWT 和用户配置文件对象作为字符串保存在客户端的存储中，那么这是多余的，用户可以手动更改该对象，并且应用程序可以关闭。

我更喜欢在成功登录后仅将 JWT 保存在客户端的存储中，但我需要一些建议，在这种情况下如何组织代码？整页刷新后如何获取用户配置文件对象？

请帮忙。

【问题讨论】：

JWT 允许您在令牌的标头和有效负载中都有声明。除此之外，JWT 允许您在对标头进行签名时对有效负载进行加密。这样，您可以将客户端应用程序（此处为浏览器中的角度）可以读取的信息放入令牌中，同时将其他一些信息保密且仅对服务器可用。

【参考方案1】：

最安全的解决方案是将 JWT 存储在 HTTPS-Only cookie 中，然后向服务器发出请求以获取用户对象。

如果您想避免对服务器的额外调用，您需要发挥创意。我正在尝试的一种方法是将 JWT 的声明正文存储在客户端上 - 只是正文，不包括签名。排除签名后，“令牌”不再是 JWT，不能用于身份验证，从而防止实际访问令牌从本地存储中被盗。

但是，这确实假设声明主体有两件事：

1) 信息不透明且不包含有关用户的个人身份信息 (PII)（本地存储易受 XSS 攻击）。

2) 如果此对象在本地存储中被修改，您的 Angular 应用程序不会向用户泄露敏感信息（您不应该在 Angular 应用程序中存储敏感信息，它应该受 API 保护）

3) 与所有基于 cookie 的身份验证策略一样，您可以保护自己免受 CSRF Attacks 的侵害

我在 Stormpath 工作，最近我就这个主题写了一篇博文：Token Based Authentication for Single Page Apps。

希望这会有所帮助！

【参考方案2】：

为了简单起见，我将只存储 JWT 并实现一个额外的 ajax 调用来获取用户配置文件。

但如果您绝对想避免这一调用，您可以考虑使用非对称签名的 JWT 而不是加密的 JWT，然后在客户端提取数据，假设您控制 JWT 的创建。