如何解决使 Service Worker 始终从服务器加载文件,除非离线
据我所知,Service Workers 有自己的缓存。并且 HTTP 流量有一个单独的缓存。
当您离线时,浏览器拒绝向您显示来自 HTTP 缓存的网站,但它很乐意向您显示来自 Service Worker 缓存的网站。
我每天更新我的网站很多次(只有文件内容、URL 保持不变)。我的 HTTP 缓存设置为一小时。
我想提供离线模式。但在线时,网站应该始终从服务器(或 1 小时 HTTP 缓存)加载。
我应该为这样的 Service Worker 使用什么代码?我相信这里没有描述:https://web.dev/offline-cookbook
解决方法
根据您的用例,我认为您可以采用 "Network first"
方法。
self.addEventListener(’fetch’,function (event) {
event.respondWith(
fetch(event.request).catch(function() {
return caches.match(event.request)
})
)
})
在您的 fetch 事件处理程序中,我们正在做以下事情:-
- 使用
fetch
方法从服务器获取数据。 - 添加一个
catch
处理程序以防万一网络出现故障并从缓存存储中获取数据。(在offline
状态的情况下)。
注意:- 我们假设您在 Service Worker 的 install
事件中缓存数据。
如果您不是,那么我们也可以在 fetch
活动中这样做。
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。