angular - 在 Angular 上刷新/丢失连接时防止数据丢失
问题描述
在 Angular 中,当您刷新页面时,您基本上会丢失整个应用程序的进度和变量。防止这种损失的最佳方法是什么?
我知道会话/本地存储,这是我们大部分时间都在使用的。但我不能认为这是一件好事,因为:
- 您的数据对前端非常可见。(我不在那里存储密码或任何东西,但这仍然很糟糕。ID、GUIDS、其他用户/表的数据非常明显)
- 您的数据也可以在系统上建立,这可能会使用户的机器/体验变慢。
总的来说,我只是有一种直觉,你应该尽量避免使用本地/会话存储。所以我只是想知道是否有人有其他解决方案。
解决方案
在客户端存储数据有 4 种主要方法
1)作为 URL 参数
您可以存储在路由中以应有的方式呈现页面所需的所有状态。您受到路由操作逻辑和大小的限制。此外,您只能存储字符串,并且必须手动序列化其他数据
2)在索引数据库中
比 localStorage 更好,动作是异步的。更难直接操作,但可以使用提供类似于 localStorage 接口的库
3)本地存储/会话存储
简单的键值存储。易于使用和更新。同步和阻塞 API。最大尺寸可能取决于浏览器。可用于存储数据。如果存储敏感数据,请考虑加密(虽然不建议开始)
4)饼干
只有大小有限的字符串才能序列化数据
您使用的所有库基本上都在使用这 4 个可用的基本结构。Best
是一个相对术语。除非您定期与服务器同步数据(例如自动保存)并在刷新服务器数据时重新水化 UI,否则您必须根据策略和数据进行选择