caching - 5 分钟后反应 fetch() 缓存过期

Question

任何人都可以分享一些关于如何在浏览器中缓存呼叫并让它持续 5 分钟、30 秒、真的任何时候的指导吗？

我在这方面遇到了一些真正的困难。

这有效，但无法弄清楚如何使其过期

fetch(
    '/get/id',
    {
        method: 'GET',
        headers: { 'Content-Type': 'application/json' },
        cache: 'force-cache'
    }
);

这根本不起作用

fetch(
    '/get/id',
    {
        method: 'GET',
        headers: { 'Content-Type': 'application/json', 'Cache-Control': 'max-age=30' },
    }
);

score 0 · Accepted Answer

Cache-Control是一个 HTTP 缓存标头，由一组指令组成，允许您定义何时/如何缓存响应以及缓存多长时间。您可以将服务器配置为在响应中附加 Cache-Control 标头，指定要使用的指令。

对于此缓存控件，需要更新服务器以在响应中包含缓存控件，如下所示，服务器为客户端指定缓存控件类型（公共）和最大响应时间。

另一种选择是在客户端实现自己的缓存机制，该机制在 5 分钟后到期。下面是实现缓存获取调用的代码，其中会话存储作为缓存存储和 5 分钟到期，如果陈旧，则自身无效。

1 回答 1