Mi trabajador de servicio no muestra la página offline.html que he creado. Solo muestra la página web real antes de borrar el caché. Después de borrar el caché, muestra la página habitual de pérdida de conexión en modo sin conexión en lugar de mostrar la página offline.html que he creado. Lo he dado de baja una vez. Esa es la razón de ello. Adjunto la captura de pantalla del archivo serviceworker.js aquí: serviceworker.js . Es una aplicación de reacción que convertí a PWA.
Aquí está mi serviceworker.js:
const CACHE_NAME = "version-1"; const urlsToCache = ["index.html", "offline.html"]; const self = this; //installing SW self.addEventListener("install", event => { event.waitUntil( caches.open(CACHE_NAME) .then(cache => { console.log("Opened Cache") return cache.addAll(urlsToCache) }) ) }) //fetching request self.addEventListener("fetch", event => { event.respondWith( caches.match(event.request) .then(() => { return fetch(event.request) .catch(() => caches.match("offline.html")) }) ) }) //activating SW self.addEventListener("activate", event => { const cacheWhiteList = []; cacheWhiteList.push(CACHE_NAME) event.waitUntil( caches.keys() .then(cacheNames => Promise.all( cacheNames.map(cacheName => { if (!-cacheWhiteList.includes(cacheName)) { return caches.delete(cacheName) } }) )) ) })