有没有办法从浏览器缓存中获取 add/remove 条目?
Is there a way to add/remove entries from the browser cache?
场景:
- 用户搜索所有以单词
test
开头的标签。
- 服务器 returns
["test1", "test2", "test3"]
,Cache-Control: max-age=86400
(1 天或其他一些合适的大值)。
- 用户添加了一个新标签:
test4
。
- 用户从第 1 步开始重复搜索。浏览器 returns 来自第 2 步的缓存值。
是否可以在步骤 3 中更新浏览器缓存以执行以下操作之一?
- 更新缓存响应以包含
test4
或
- 立即使步骤 1 中的缓存无效。
是否有某种 Javascript API 可以让人们与浏览器缓存交互?我对所有请求都使用 Fetch API。
解决方案是在第 4 步发出 XHR 请求并添加一个参数,该参数将使请求对浏览器唯一(新)。例如 ?whatever
.
如果唯一影响服务器状态的是单个用户,那么 JavaScript 可以跟踪他们何时影响状态,以便开始使用新的 "cache buster" 参数。
另一方面,如果任何人都可以更新服务器状态,那么您唯一(简单)的解决方案就是始终使用新参数请求服务器状态。为此使用当前时间戳(例如 ?1568952442135
)通常效果很好。
当然,这并不能完全满足您的要求,但它解决了客户端上陈旧数据的问题。
另一种解决方案是使用服务工作者拦截所有这些请求并即时重写响应。这可能可以通过 https://whosebug.com/a/42846899/72478 and https://developer.mozilla.org/en-US/docs/Web/API/Headers/delete
您总是会从服务器响应中删除缓存 header,因此浏览器永远不会将它们缓存在常规页面缓存中(您无法完全控制),而是将它们缓存在服务工作者中"Cache Storage"。然后 service worker 将完全控制它 return 对客户端的响应。
场景:
- 用户搜索所有以单词
test
开头的标签。 - 服务器 returns
["test1", "test2", "test3"]
,Cache-Control: max-age=86400
(1 天或其他一些合适的大值)。 - 用户添加了一个新标签:
test4
。 - 用户从第 1 步开始重复搜索。浏览器 returns 来自第 2 步的缓存值。
是否可以在步骤 3 中更新浏览器缓存以执行以下操作之一?
- 更新缓存响应以包含
test4
或 - 立即使步骤 1 中的缓存无效。
是否有某种 Javascript API 可以让人们与浏览器缓存交互?我对所有请求都使用 Fetch API。
解决方案是在第 4 步发出 XHR 请求并添加一个参数,该参数将使请求对浏览器唯一(新)。例如 ?whatever
.
如果唯一影响服务器状态的是单个用户,那么 JavaScript 可以跟踪他们何时影响状态,以便开始使用新的 "cache buster" 参数。
另一方面,如果任何人都可以更新服务器状态,那么您唯一(简单)的解决方案就是始终使用新参数请求服务器状态。为此使用当前时间戳(例如 ?1568952442135
)通常效果很好。
当然,这并不能完全满足您的要求,但它解决了客户端上陈旧数据的问题。
另一种解决方案是使用服务工作者拦截所有这些请求并即时重写响应。这可能可以通过 https://whosebug.com/a/42846899/72478 and https://developer.mozilla.org/en-US/docs/Web/API/Headers/delete
您总是会从服务器响应中删除缓存 header,因此浏览器永远不会将它们缓存在常规页面缓存中(您无法完全控制),而是将它们缓存在服务工作者中"Cache Storage"。然后 service worker 将完全控制它 return 对客户端的响应。