diff --git a/offline/offline.web.ts b/offline/offline.web.ts index d037d213f7..0181e45552 100644 --- a/offline/offline.web.ts +++ b/offline/offline.web.ts @@ -1,11 +1,6 @@ -namespace $ { - - interface FetchEvent extends Event { - request: Request - respondWith(response: Response | Promise | null): void - waitUntil(promise: Promise): void - } +/// +namespace $ { export class $mol_offline_web extends $mol_offline { web_js() { return 'web.js' } @@ -80,31 +75,25 @@ namespace $ { return true } - _worker = null as null | { - skipWaiting(): void - clients: { - claim(): void - } - addEventListener(name: string, cb: (e: Event) => void): void - } + _worker = null as null | ServiceWorkerGlobalScope worker() { if (this._worker) return this._worker - const worker = this._worker = self as unknown as NonNullable + const worker = this._worker = self as unknown as ServiceWorkerGlobalScope + // as unknown as NonNullable worker.addEventListener( 'beforeinstallprompt' , this.beforeinstallprompt.bind(this) ) worker.addEventListener( 'install' , this.install.bind(this)) worker.addEventListener( 'activate' , this.activate.bind(this)) worker.addEventListener( 'message', this.message.bind(this)) - worker.addEventListener( 'fetch', this.fetch_event.bind(this) as any) + worker.addEventListener( 'fetch', this.fetch_event.bind(this)) return worker } - message(event: unknown) { - if (! event || typeof event !== 'object') return - - const message = (event as { data: { message?: string }}).data?.message ?? '' - + message(event: ExtendableMessageEvent) { + const data = event.data + if (! data || typeof data !== 'object') return + const message = (data as { message?: string }).message ?? '' if (! message) return if (message === this.obsolete_key()) return this.build_obsolete() @@ -114,9 +103,9 @@ namespace $ { event.prompt?.() } - install(event: Event) { this.worker().skipWaiting() } + install(event: ExtendableEvent) { this.worker().skipWaiting() } - activate(event: Event) { + activate(event: ExtendableEvent) { // caches.delete( '$mol_offline' ) this.worker().clients.claim() @@ -158,7 +147,12 @@ namespace $ { async respond(event: FetchEvent) { const request = event.request - const cached = await caches.match( request ) + let cached + try { + cached = await caches.match( request ) + } catch (e) { + console.error(e) + } if ( ! cached) return this.fetch_and_cache(event) @@ -176,10 +170,10 @@ namespace $ { ) } catch (err) { - const cloned = cached.clone() const message = `${(err as Error).cause instanceof Response ? '' : '500 '}${ (err as Error).message} $mol_offline fallback to cache` + const cloned = cached.clone() cloned.headers.set( '$mol_offline_remote_status', message ) return cloned @@ -194,13 +188,12 @@ namespace $ { return cache.put( request , response ) } - async fetch_and_cache (event: FetchEvent) { + async fetch_and_cache(event: FetchEvent) { const request = event.request const response = await fetch( request ) - if (response.status !== 200) return response - - const cached = this.put_cache(request, response.clone()) - event.waitUntil(cached) + if (response.status === 200) { + event.waitUntil(this.put_cache(request, response.clone())) + } return response }