Add extra message to +error.svelte to handle, and clarify 'OFFLINE' error.

This commit is contained in:
2026-05-14 19:43:22 +01:00
parent 25b64edabd
commit 1105a9f7c5
6 changed files with 111 additions and 120 deletions

View File

@@ -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;
}
});