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' },
    }
);

Answer 1

缓存控制是一个HTTP缓存标头，包含一组指令，这些指令可让您定义何时/如何缓存响应以及持续多长时间。您可以将服务器配置为在响应中附加Cache-Control标头，并指定要使用的指令。

对于此缓存控件，需要更新服务器以包括响应中的缓存控件，如下所示，其中服务器为客户端指定缓存控件类型（公共）和响应的最长期限。

其他选项是在客户端实现您自己的缓存机制，该机制将在5分钟后失效。下面的代码通过会话存储实现了缓存获取调用作为缓存存储，并且有5分钟的到期时间，如果过时，其自身将失效。