Add extra message to +error.svelte to handle, and clarify 'OFFLINE' error.
This commit is contained in:
@@ -7,87 +7,77 @@ import { build, files, version } from '$service-worker';
|
||||
const sw = self as unknown as ServiceWorkerGlobalScope;
|
||||
const CACHE_NAME = `owlboard-cache-${version}`;
|
||||
const ASSETS = [
|
||||
...build,
|
||||
...files.filter(file =>
|
||||
!file.endsWith('manifest.json') &&
|
||||
!file.startsWith('/icons/')
|
||||
),
|
||||
'/',
|
||||
...build,
|
||||
...files.filter((file) => !file.endsWith('manifest.json') && !file.startsWith('/icons/')),
|
||||
'/'
|
||||
];
|
||||
|
||||
sw.addEventListener('install', (event) => {
|
||||
sw.skipWaiting();
|
||||
event.waitUntil(
|
||||
caches.open(CACHE_NAME).then((cache) => cache.addAll(ASSETS))
|
||||
);
|
||||
sw.skipWaiting();
|
||||
event.waitUntil(caches.open(CACHE_NAME).then((cache) => cache.addAll(ASSETS)));
|
||||
});
|
||||
|
||||
sw.addEventListener('activate', (event) => {
|
||||
event.waitUntil(
|
||||
Promise.all([
|
||||
caches.keys().then((keys) => {
|
||||
return Promise.all(
|
||||
keys.filter((key) => key !== CACHE_NAME).map((key) => caches.delete(key))
|
||||
);
|
||||
}),
|
||||
sw.clients.claim()
|
||||
])
|
||||
);
|
||||
event.waitUntil(
|
||||
Promise.all([
|
||||
caches.keys().then((keys) => {
|
||||
return Promise.all(
|
||||
keys.filter((key) => key !== CACHE_NAME).map((key) => caches.delete(key))
|
||||
);
|
||||
}),
|
||||
sw.clients.claim()
|
||||
])
|
||||
);
|
||||
});
|
||||
|
||||
sw.addEventListener('fetch', (event) => {
|
||||
const { request } = event;
|
||||
if (request.method !== 'GET') return;
|
||||
|
||||
const url = new URL(request.url);
|
||||
const { request } = event;
|
||||
if (request.method !== 'GET') return;
|
||||
|
||||
// Uncached static assets
|
||||
if (url.pathname.endsWith('manifest.json') || url.pathname.includes('/icons/')) {
|
||||
event.respondWith(fetch(request));
|
||||
return;
|
||||
}
|
||||
const url = new URL(request.url);
|
||||
|
||||
// 1. Static Assets (Cache-First)
|
||||
if (ASSETS.includes(url.pathname) || url.pathname.startsWith('/_app/')) {
|
||||
event.respondWith(
|
||||
caches.match(request).then((res) => res || fetch(request))
|
||||
);
|
||||
return;
|
||||
}
|
||||
// Uncached static assets
|
||||
if (url.pathname.endsWith('manifest.json') || url.pathname.includes('/icons/')) {
|
||||
event.respondWith(fetch(request));
|
||||
return;
|
||||
}
|
||||
|
||||
// 2. Offline API Fallback (Network-First)
|
||||
if (url.pathname.startsWith('/api') || url.hostname.includes('api')) {
|
||||
event.respondWith(
|
||||
fetch(request).catch(() => {
|
||||
const errorObject: ApiEnvelope.Envelope = {
|
||||
e: {
|
||||
code: "NETWORK_DISCONNECTED",
|
||||
msg: "Cannot connect to the OwlBoard server"
|
||||
},
|
||||
t: Math.floor(Date.now() / 1000)
|
||||
};
|
||||
return new Response(
|
||||
JSON.stringify(errorObject),
|
||||
{
|
||||
status: 503,
|
||||
headers: { 'Content-Type': 'application/json' }
|
||||
}
|
||||
);
|
||||
})
|
||||
);
|
||||
return;
|
||||
}
|
||||
// 1. Static Assets (Cache-First)
|
||||
if (ASSETS.includes(url.pathname) || url.pathname.startsWith('/_app/')) {
|
||||
event.respondWith(caches.match(request).then((res) => res || fetch(request)));
|
||||
return;
|
||||
}
|
||||
|
||||
// 3. Navigation Fallback (The Offline 404 Catch-All)
|
||||
// This catches top-level page navigations and hard refreshes
|
||||
if (request.mode === 'navigate' || request.headers.get('accept')?.includes('text/html')) {
|
||||
event.respondWith(
|
||||
fetch(request).catch(() => {
|
||||
// The network request failed entirely (offline).
|
||||
// Serve the cached root shell so SvelteKit can boot.
|
||||
return caches.match('/') as Promise<Response>;
|
||||
})
|
||||
);
|
||||
return;
|
||||
}
|
||||
});
|
||||
// 2. Offline API Fallback (Network-First)
|
||||
if (url.pathname.startsWith('/api') || url.hostname.includes('api')) {
|
||||
event.respondWith(
|
||||
fetch(request).catch(() => {
|
||||
const errorObject: ApiEnvelope.Envelope = {
|
||||
e: {
|
||||
code: 'NETWORK_DISCONNECTED',
|
||||
msg: 'Cannot connect to the OwlBoard server'
|
||||
},
|
||||
t: Math.floor(Date.now() / 1000)
|
||||
};
|
||||
return new Response(JSON.stringify(errorObject), {
|
||||
status: 503,
|
||||
headers: { 'Content-Type': 'application/json' }
|
||||
});
|
||||
})
|
||||
);
|
||||
return;
|
||||
}
|
||||
|
||||
// 3. Navigation Fallback (The Offline 404 Catch-All)
|
||||
// This catches top-level page navigations and hard refreshes
|
||||
if (request.mode === 'navigate' || request.headers.get('accept')?.includes('text/html')) {
|
||||
event.respondWith(
|
||||
fetch(request).catch(() => {
|
||||
// The network request failed entirely (offline).
|
||||
// Serve the cached root shell so SvelteKit can boot.
|
||||
return caches.match('/') as Promise<Response>;
|
||||
})
|
||||
);
|
||||
return;
|
||||
}
|
||||
});
|
||||
|
||||
Reference in New Issue
Block a user