VueJS：缓存 http 响应数据的最佳方式

Posted 2023-02-23

【中文标题】VueJS：缓存 http 响应数据的最佳方式

【英文标题】：VueJS: Best way to Cache http response data

【发布时间】：2019-05-01 07:23:01

【问题描述】：

我正在寻找一种在 VueJS 中缓存 http 响应数据的最佳方式，现在我将 Vuex Store 用于我的博客。我想在请求到服务器时缓存所有响应数据。

具体来说，这是我的博客：

当我使用 1、3、4 通过路由器向博客详细信息请求数据时，我有响应数据。如何缓存它然后我在同一个会话中重新路由到 1、3、4，它不会重新获取数据并获取数据缓存以显示？

现在我使用 Vuex，如果必须存储太多数据，我认为它会很慢。

【问题讨论】：

Vuex 并不慢。缓慢的是一次又一次地从 API 中获取数据。你用<keep-alive><router-view /></keep-alive>吗？

【参考方案1】：

Service Workers 就是为此而构建的。他们可以拦截和缓存您页面上的所有请求。通过一些额外的工作，您可以轻松添加离线功能。

您也可以将Cache API 与window.caches 一起使用，但请注意浏览器支持。

另一种方法是使用 LocalStorage/IndexedDB 手动存储您的响应，但这需要更多的工作。

【讨论】：

Instagram 是否使用服务人员，兄弟？我们可以检查一下吗？

Redis 是一个选项。

@Eric 你能详细说明你的第三个选择吗？我知道这是已解决的问题，但我有同样的情况。你如何实现它？请在同样的情况下帮助我。这是我的开放线程 [***.com/questions/64296962/…