服务器上有新数据时要更新localStorage？

Question

登录到应用程序（React.js）后，由于许多组件正在使用member数据，因此我希望将它们存储在localStorage中，理想情况下，仅在登录时才需要进行请求。 / p>

但是，此member对象中的一些属性可能会在后端手动更改，因此前端根本无法知道member对象是否已更改。 （同样，理想情况下，对member对象的任何更改都应通过某种形式的提交来直接更改数据库，通过该表单提交可以触发localStorage的更新，但这不是当前的选择。）< / p>

示例场景：应用程序中有一个通用表格要求额外的积分。客户服务将收到有关该请求的电子邮件。客户A的信用额将被手动更新（在数据库中）。如果客户A不重新登录（member的获取请求已完成），localStorage仍将显示旧编号。学分。

如果是这种情况，最好的解决方法是什么？

1. 根本不将member数据存储在localStorage中，以保持数据新鲜。只需在需要时调用端点。

2. 改为使用sessionStorage？

3. 当用户刷新页面/应用程序时触发重新引用（尽管用户可能不知道他们需要这样做才能更新数据）。

建议？

Answer 1

1. 如果数据将根据用户控制范围之外的内容进行更改，则在需要端点时调用端点是理想选择。
2. 会话存储只是浏览会话结束时会被擦除的本地存储，您仍然会遇到完全相同的问题
3. 这并不能真正解决问题，通常要求用户执行常规维护任务以尽其所能使用您的应用程序，这通常是糟糕的用户体验

我只想更新数据。

Answer 2

从总体上讲，您有两种选择：

• 轮询（定期调用后端以刷新数据）
• 打开与服务器的持久连接（例如Web套接字），然后将服务器 push 更新到客户端。

后一个选项将需要进行很多更改，并且会更改应用程序的可伸缩性，因此前一个选项似乎是您最合理的选择。

继续使用localStorage是很明智的做法，因此您拥有数据的脱机副本，并且不会在页面加载期间阻止呈现；您可以有一个后台定期刷新过程，同时不会干扰用户。如果您的数据是在redux或context中进行镜像的，那么当/当数据更改时，您的UI可能会更新。

Answer 3

如果您不知道member的更新时间，请不要存储它。每当您需要member时，都应该查询后端。这是保持数据与数据库同步的唯一方法。