Angular语言 - 存储永久用户信息的位置，但在本地存储中除外

Question

I 一个通过 JWT 进行身份验证的系统，在本地存储上，JWT 设置在一个变量上，用户角色在本地存储上的另一个变量上设置。但是，所有信息(包括 JWT (都通过CryptoJS加密，然后在侧栏上，例如，我们有ngIfs，仅用于显示具有某些角色的用户的某些菜单。所有这些 ngIf 都调用一个方法，该方法解密本地存储上的数据以获取用户角色，然后进行验证。问题是多个图标/侧边栏图标/等中的所有这些解密开始使系统非常慢。
那么有人知道在这种情况下在哪里保存用户数据吗？:)

Answer 1

您可以使用：

服务：可以从任何组件访问的共享服务(在根模块中声明(，请确保首先解密信息并将其存储在服务内的变量中。

存储：类似于Redux的东西，您可以在其中存储解密的用户信息，并从任何地方访问它。

Answer 2

我使用的一般规则是永远在诸如*ngIf之类的事情上使用函数，每个摘要周期都会处理它们。这就是为什么你的表现受到打击。尝试在解密函数中放置一个console.log()，看看每秒调用多少次。

可以将加密的值存储在本地存储中，然后使用服务将解密的值存储在内存中。然后调用服务以获取解密的值。然后，如果用户刷新页面，他们必须再次解密一次，然后传递解密的值。这是我所说的一个例子。

服务.ts

decryptedValue = null;
getDecryptedValue() {
if (!decryptedValue) {
this.decryptedValue = this.decrypt(localStorage.getItem('encryptedValueKey'));
}
return this.decryptedValue;
}

组件.ts

temp = null;
ngOnInit() {
this.temp = this.service.getDecryptedValue();
}

然后，您可以从所需的任何组件调用该服务，与现在所做的相比，它应该相当快。