保护用户详细信息并在 Angular 应用程序中实现 JWT 令牌和 NgRx

Question

我担心 Angular 应用程序的安全性。目前，我将 isAdmin、isLoggedIn、电子邮件等用户详细信息存储在本地存储中。但是，我担心与手动更新此存储数据相关的安全风险，特别是因为我的应用程序的授权依赖于 isAdmin 的值。

我的问题：考虑到 isAdmin 值和其他敏感数据，如何在 Angular 中安全地存储用户详细信息以防止未经授权的访问和操纵？

我尝试实现 JWT 令牌：我考虑过使用 JWT 令牌，但我担心它们的安全性。如果我将 JWT 令牌放在 JWT 网站上，它可以轻松解码，从而显示所有数据。有没有更安全的方法在我的应用程序中实现 JWT 令牌？

我尝试实现NgRx：我也尝试过使用NgRx进行状态管理，但我遇到了一个问题，即NgRx管理的状态位于内存中，并且在浏览器刷新后不会持续存在。如何确保包括关键用户授权数据的状态即使在页面刷新后也保持一致？

我非常感谢任何指导或最佳实践来解决这些问题并提高我的 Angular 应用程序的安全性。预先感谢您的见解！

Answer 1

1. 我讨厌 ngrx，所以这是我给出的任何回复的第一点 - 不要使用它。如果您正确设置应用程序，这将是一个很多的复杂化，但没有任何好处。

2. 欢迎来到“我所做的一切都不足以达到安全目的”的世界。

正如您所指出的，一旦解码，JWT 就是完全可读的纯文本。因此，您不应在其中包含任何类型的敏感信息。

某人的各种主张，例如“isAdmin”应该与任何人都可以阅读的内容无关。很高兴知道，这个人是管理员，哇。 好吧，这是选择目标的一步，但仅此而已。

令牌本身已签名，因此除您之外的任何人对令牌的任何修改（假设您是唯一拥有签署该令牌的密钥的人），都意味着您知道这不是最初提供的东西，并且可以引发您的所有警报想要它。

现在，下一个问题是，仅仅拥有 JWT 就像窃取某人的支持 NFC 的借记卡/信用卡。只要他们不超过

的限制，他们就可以厚颜无耻地使用您的卡进行购物。

这就是过期的地方。你应该努力让你的代币的生命周期较短，这样即使有人抓住了该代币，他们在过期前的短暂时间内所能造成的损害也是有限的。

一种超安全的方法？那么，您可以加密 JWT 本身吗？你必须用两种方法来做。 使用服务器的私钥进行加密，然后使用 UI 的公钥进行加密。 只要 UI 拥有（或可以请求）服务器的公钥，并且知道自己的私钥，它就可以撤消加密并读取有效负载...... 尽管如此，如果用户界面知道一些东西，那么用户只要仔细观察就知道一些东西，所以我想双重加密并没有多大意义......

TL;DR：只要您使用较短的到期时间并且不将任何您并不真正需要的敏感信息放入其中，JWT 就可以。将其限制为有关用户的基本的、与应用程序相关的信息。