用户配置文件信息 - 将其保存在 localStorage 或 Ngrx [关闭]答案

【问题标题】：User Profile Information - Save it in localStorage or Ngrx [closed]用户配置文件信息 - 将其保存在 localStorage 或 Ngrx [关闭]
【发布时间】：2020-02-19 18:16:00
【问题描述】：

我目前正在从事一个较小的项目，我开始进行一些用户管理。有很多选择，但我想遵循良好的代码实践。

通常将用户配置文件信息存储在商店 (Ngrx) 中更好还是我应该使用 localStorage。

interface Profile {
    nickname: String;
    profileImage: String;
    slogan: String;
}

什么时候应该使用 localStorage 而不是 ngrx 存储？

提前谢谢你。希望这个问题不要太笼统。

【问题讨论】：

根据你的需要，参考这个medium.com/frontend-fun/…

标签： javascript angular ngrx

【解决方案1】：

问题不在于选择哪个，而是齐头并进。

例如，您可以将状态保存在 ngrx 存储中，并且可以将完全相同的状态保存到本地存储中。这样，您就可以使用本地存储中的状态重新补充您的存储状态。

用户信息应该存在于内存中，因此处于存储状态。

它可能是应用程序多个部分的共享状态
存储在内存中更安全

【讨论】：

这就是我想知道的。感谢分享。
@LingVu 这个答案很有帮助，谢谢。一个后续问题：如果某些组件需要这些数据，最好从存储（或服务）而不是本地存储加载，对吗？否则，商店（或在我的情况下的服务）是无用的

【解决方案2】：

刷新页面后，Ngrx 存储将被删除，而 localStorage 即使在刷新后仍保留在浏览器上。虽然 localStorage 是按域和浏览器保存的，因此它仅适用于当前浏览器，并且仅适用于该特定域。

如果您希望数据在用户刷新页面后仍然存在，您应该使用 localStorage。

如果您想在 localStorage 上保留您的信息，有一个很棒的线程。查看基尔：Ngrx Store Resets after browser refresh. How to make the application preserve the state?

此外，您可以查看一个名为 ngrx-store-localstorage 的库，如果您使用 rehydrate 选项，此模块会自动将 ngrx-store 与 localstorage 同步。

【讨论】：

【解决方案3】：

您也可以使用 Cookie。用于 Cookie 的 npm（模块）也可用。请搜索 npm cookie。

【讨论】：