服務工作者在默認情況下應該駐留在應用程序的根。要將服務工作人員註冊到默認位置以外的其他位置,可以使用以下代碼。
if ('serviceWorker' in navigator) {
navigator.serviceWorker.register('/sw-test/sw.js', {scope: '/sw-test/'})
.then(function(reg) {
// registration worked
console.log('Registration succeeded. Scope is ' + reg.scope);
}).catch(function(error) {
// registration failed
console.log('Registration failed with ' + error);
});
}
From MDN,
- 外塊執行特徵檢測測試,以確保服務人員的支持嘗試註冊一個之前。接下來,我們使用ServiceWorkerContainer.register()函數註冊該站點的服務工作人員,這只是一個駐留在我們的應用程序內的JavaScript 文件(注意這是該文件的URL相對於 的起源而不是JS文件引用它。)
- 範圍參數是可選的,可以用來指定要的服務人員來控制你的內容的子集。在 這種情況下,我們指定了'/ sw-test /',這意味着該應用程序的所有內容 。如果您將其忽略掉,它將默認爲這個值,但我們在此處指定它用於說明目的。
- 的。然後()承諾函數用於鏈成功的情況下到我們的承諾結構。當承諾解析成功時,其中的 代碼將執行。
- 最後,我們鏈接一個.catch()函數,如果上的承諾被拒絕,將運行結束。
此註冊服務工人,它運行在一個工人上下文,並且因此 沒有DOM的訪問。然後,你正常的網頁,以控制其負載之外運行的服務人員 代碼。