CDN服務工作者

Question

我在嘗試設置服務工作者使用sw-precache來緩存CDNJS中的資產以便脫機使用。不幸的是，這似乎並不奏效。這是我到目前爲止有：

之前任何腳本加載在index.html：

<script type='text/javascript'> 
    if ('serviceWorker' in navigator) { 
    navigator.serviceWorker.register('/js/service_worker.js') 
     .then(function() { 
     console.log("Service Worker Registered") 
     }) 
    } 
</script> 

而且這裏是我使用生成服務工作者咕嘟咕嘟任務：

const config = require('../config') 
const gulp = require('gulp') 
const swPrecache = require('sw-precache') 

gulp.task('serviceWorker', (callback) => { 

    swPrecache.write(config.build.serviceWorker, { 
    runtimeCaching: [ 
     { 
     urlPattern: /^https:\/\/cdnjs\.cloudflare\.com/, 
     handler: 'networkFirst' 
     } 
    ] 
    }, callback) 
}) 

當我運行該應用程序時，我看到Service Worker Registered已記錄到控制檯。但是，如果我斷開我的WiFi，應用程序無法加載腳本。我究竟做錯了什麼？

Answer 1

你在一些JS路徑/js/service_worker.js註冊服務工作者。此範圍限制服務工作人員僅控制該路徑/js/下的指定內容。

I suggest you to register service worker at root level即www.example.com/那麼您可以控制在該域下提供服務的所有頁面。