如何解决脱机时仅在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 举报,一经查实,本站将立刻删除。