脱机时仅在index.html上可用的Service Worker缓存

问题描述

我正在尝试建立一个测试pwa。我想提供一个备用页面供离线使用。我可以为index.html缓存所有内容，并且在脱机时可以正常工作。我想在隐私页面上显示离线时的备用页面。我可以看到我的缓存和处于活动状态的sw处于联机状态，但是在强制脱机时看不到。开发工具向我展示了sw已处于活动状态并且正在运行，但是我的缓存已消失，sw.js也已退出？

if ("serviceWorker" in navigator) {
if (navigator.serviceWorker.controller) {
  console.log("active service worker found,no need to register");
} else {
  // Register the service worker
  navigator.serviceWorker
    .register("pwa_sw.js")
    .then(function (reg) {
      console.log("Service worker has been registered for scope: " + reg.scope);
    }).catch(function(error){
      console.log("Registration Failed" + error);
    });
}


self.addEventListener('install',function(event){
console.log("Installation erfolgreich" + event);
    event.waitUntil(
        caches.delete(CACHE).then(function (reg) {
          console.log("CACHE cleared"+ reg);
        }).then(
            caches.open(CACHE).then(function(cache) {
             console.log("new CACHE ");
            return cache.addAll(offline_content);    
            })
        )
      );  

self.addEventListener('fetch',function(event) {  event.respondWith(
// Try the cache
caches.match(event.request).then(function(response) {
  // Fall back to network
  return response || fetch(event.request);
}).catch(function() {
  // If both fail,show a generic fallback:
  return caches.match('/Offline.html');
})

这是即时缓存

const CACHE = "v1";  
const offline_content =[ "/img/logo_192.png","/","/Offline","/css/site.css","manifest.json","/lib/bootstrap/dist/css/bootstrap.css","/lib/jquery/dist/jquery.js","/lib/bootstrap/dist/js/bootstrap.bundle.js","/js/site.js"
                       ];

我认为可能是因为我正在缓存。帮助将不胜感激：）

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）