javascript – 如何刪除錯誤的服務工作者,或實現“殺死切換”？

我正在使用我的電腦中的服務工作者API,所以我可以掌握如何從現實世界的應用程式中受益.

我遇到了一個奇怪的情況,我註冊了一個攔截提取事件的服務工作者,以便在向請求傳送請求之前檢查其請求的內容快取.

問題是這個程式碼有一個錯誤,阻止函式發出請求,所以我的頁面留空;什麼都沒發生.

當服務工作者已經註冊時,第二次載入頁面時,它攔截了第一個請求(載入HTML的請求).因為我有這個錯誤,那個抓取事件失敗,它從來沒有請求HTML,所有我看到它的空白頁.

在這種情況下,我知道刪除不好的服務工作者指令碼的唯一方法是通過chrome：// serviceworker-internals / console.

如果這個錯誤得到一個實時的網站,哪個是最好的解決方法？

謝謝！

我想擴大這裡的其他一些答案,從“從服務員到生產時可以使用什麼策略以確保我可以進行任何需要的更改”這一觀點呢？這些更改可能包括修復您在生產中發現的任何小錯誤,或者可能(但希望不會)包括中和服務工作者,因為一個不可逾越的錯誤 – 所謂的“殺死切換”.

為了這個答案的目的,我們假設你打電話

navigator.serviceWorker.register('service-worker.js');

在您的網頁上,意味著您的服務工作者JavaScript資源是service-worker.js.

我的第一條建議是閱讀標準的HTTP快取如何影響服務工作者的JavaScript保持最新的方式.有一個相當大的錯誤資訊浮在這個周圍,我希望ofollow,noindex" target="_blank">this Stack Overflow answer 清除一些,並解釋如何和何時檢查服務人員的更新.為了總結不要點選到其他答案的人,瀏覽器會在確定是否請求服務工作者JavaScript的新副本或使用快取副本時,遵守最長為1天的HTTP快取指令.因此,如果您希望能夠靈活地快速推出新的服務工作者JavaScript來修復錯誤,請使用HTTP快取指令為service-worker.js提供最短時間或0的最短時間.

一旦您的service-worker.js提供了適當的HTTP快取指令,該問題歸結為如何解決您的service-worker.js程式碼中的初始問題.如果它是一個小錯誤修復,那麼您可以顯然只是進行更改,並將您的service-worker.js重新部署到您的託管環境.如果沒有明顯的錯誤修復,並且您不想讓您的使用者執行錯誤的服務工作者程式碼,而您花時間制定解決方案,最好保持一個簡單的no-op service-worker.js方便,如下所示：

// A simple, no-op service worker that takes immediate control.

self.addEventListener('install', () => {
// Skip over the "waiting" lifecycle state, to ensure that our
// new service worker is activated immediately, even if there's
// another tab open controlled by our older service worker code.
self.skipWaiting();
});

/*
self.addEventListener('activate', () => {
// Optional: Get a list of all the current open windows/tabs under
// our service worker's control, and force them to reload.
// This can "unbreak" any open windows/tabs as soon as the new
// service worker activates, rather than users having to manually reload.
self.clients.matchAll({type: 'window'}).then(windowClients => {
windowClients.forEach(windowClient => {
windowClient.navigate(windowClient.url);
});
});
});
*/

這應該是你所有的no-op service-worker.js需要包含的.因為沒有註冊處理程式,所以所有來自受控頁面的導航和資源請求最終都將直接針對網路,如果沒有任何服務工作者,那麼您將得到相同的行為.

可以進一步,強制刪除使用Cache Storage API 或explicitly unregister the service worker 全部儲存的所有內容.對於大多數常見的情況,這可能是過度的,並且遵循上述建議應該足以使您處於當前使用者獲得預期行為的狀態,並且一旦修正了錯誤,您就可以重新部署更新.即使是沒有服務的工作人員,啟動也有一定程度的開銷,所以如果您沒有計劃重新部署有意義的服務工作者程式碼,您可以去unregistering the service worker 的路線.

如果您已經在使用HTTP快取指令服務於service-worker.js的情況下使用它的使用壽命長於使用者可以等待的時間,請記住,桌面瀏覽器上的Shift + Reload 將強制頁面在服務工作者控制之外重新載入.不是每個使用者都會知道如何做到這一點,但是在移動裝置上是不可能的.所以不要依賴Shift Reload作為一個可行的回滾計劃.