sw.js (2499B)
1 const CACHE_NAME = 'walogger-4.1.5'; // Incremented to trigger an update 2 const FONT_CACHE = 'walogger-fonts-4.1'; // New cache specifically for offline Google Fonts 3 const ASSETS = [ 4 './', 5 '<--- website link --->', 6 '<--- icon --->', 7 'https://fonts.googleapis.com/css2?family=Lexend:wght@300;400;500;600;700&display=swap', 8 'https://fonts.googleapis.com/css2?family=Material+Symbols+Rounded:opsz,wght,FILL,GRAD@24,400,0,0' 9 ]; 10 11 self.addEventListener('install', (e) => { 12 // skipWaiting ensures the new Service Worker takes control immediately 13 self.skipWaiting(); 14 e.waitUntil(caches.open(CACHE_NAME).then(cache => cache.addAll(ASSETS))); 15 }); 16 17 self.addEventListener('activate', (e) => { 18 // Automatically clean up old caches when the new one is activated 19 e.waitUntil( 20 caches.keys().then(keys => Promise.all( 21 keys.map(key => { 22 if (key !== CACHE_NAME && key !== FONT_CACHE) { 23 return caches.delete(key); 24 } 25 }) 26 )) 27 ); 28 }); 29 30 self.addEventListener('fetch', (e) => { 31 const url = new URL(e.request.url); 32 33 // Dynamic Caching for Google Fonts (CSS & WOFF2 font files) to fix offline icons 34 if (url.origin === 'https://fonts.googleapis.com' || url.origin === 'https://fonts.gstatic.com') { 35 e.respondWith( 36 caches.match(e.request).then(cachedResponse => { 37 // Return from cache if we already have it 38 if (cachedResponse) { 39 return cachedResponse; 40 } 41 42 // If it isn't cached yet, fetch it from the network and save it to the FONT_CACHE 43 return fetch(e.request).then(networkResponse => { 44 return caches.open(FONT_CACHE).then(cache => { 45 // Put a clone of the response in the cache 46 cache.put(e.request, networkResponse.clone()); 47 return networkResponse; 48 }); 49 }).catch(() => { 50 // Fallback if offline and font not previously cached 51 return new Response('', { status: 404, statusText: 'Offline' }); 52 }); 53 }) 54 ); 55 } else { 56 // Standard Strategy for app files 57 e.respondWith( 58 caches.match(e.request).then(response => response || fetch(e.request)) 59 ); 60 } 61 });