Service Worker 緩存文件處理

交代背景

前段時間升級了一波Google Chrome，發現個人JulyNovel站點Ctrl+F5也刷新不了，後來發現是新的Chrome已經支持Service Worker，而個人JulyNovel也知足https這個硬性條件。
以前加載過的css和js都被緩存了。
因此這裏是有點小問題的，畢竟我服務器更新了，你service worker 沒給我更新緩存，就說不過去了。

生命週期

特意跑到Google Develop去看了下到底是怎麼運轉的。

Service Worker生命週期的意義

1.實現離線優先（這個不談，沒網也能搞事？這妥妥的Native的能力啊）
2.容許新服務工做線程自行作好運行準備，無需中斷當前的服務工做線程。（準備替換舊的service woker）
3.確保整個過程當中做用域頁面由同一個服務工做線程（或者沒有服務工做線程）控制。
4.確保每次只運行網站的一個版本。

install

根據個人理解，這個環節只在第一次打開網站時加載，一系列操做保證其原子性（要麼可用，要麼廢棄）

Activate

service worker被激活，某些請求就會變成 from ServiceWorker

更新service worker

這裏就是解決問題的關鍵了。

首先，會觸發更新的狀況以下
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();
});