前段时间升级了一波Google Chrome,发现个人JulyNovel站点Ctrl+F5也刷新不了,后来发现是新的Chrome已经支持Service Worker,而个人JulyNovel也知足https这个硬性条件。
以前加载过的css和js都被缓存了。
因此这里是有点小问题的,毕竟我服务器更新了,你service worker 没给我更新缓存,就说不过去了。css
特意跑到Google Develop去看了下到底是怎么运转的。web
1.实现离线优先(这个不谈,没网也能搞事?这妥妥的Native的能力啊)
2.容许新服务工做线程自行作好运行准备,无需中断当前的服务工做线程。(准备替换旧的service woker)
3.确保整个过程当中做用域页面由同一个服务工做线程(或者没有服务工做线程)控制。
4.确保每次只运行网站的一个版本。缓存
根据个人理解,这个环节只在第一次打开网站时加载,一系列操做保证其原子性(要么可用,要么废弃)服务器
service worker被激活,某些请求就会变成 from ServiceWorker网站
这里就是解决问题的关键了。google
首先,会触发更新的状况以下
1.导航到一个做用域内的页面。
2.更新 push 和 sync 等功能事件,除非在前 24 小时内进行了更新检查。
3.调用 .register(),仅在ServiceWorker网址已发生变化时。
4.在获取更新时遵循(长达 24 小时)服务工做线程脚本上的缓存标头。 咱们将建立此选择加入行为,由于它能够发现问题。 在您的服务工做线程脚本上,您可能须要 max-age 为 0。
更新流程
1.install
装载新的工做线程(根据个人理解,就是把css和js换个版本号,则会触发install的事件)
2.waiting
等待更新动做被触发
3.Activate
新的serviceworker替换老的
4.skipWaiting
跳过waiting
5.手动更新线程
navigator.serviceWorker.register('/sw.js').then(reg => { // sometime later… reg.update(); });