From 9845ccec5b70501b36e05a84206e38a1f53957c4 Mon Sep 17 00:00:00 2001 From: anatawa12 Date: Tue, 11 Jul 2023 18:24:10 +0900 Subject: オフライン時の画面にリロードボタンを追加 (#11242) MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit * feat: オフライン時の画面にリロードボタンを追加 リロードのためのボタンがないとPWAでインターネットが復帰しても何もできなくなるため。 * docs(changelog): add オフライン時の画面にリロードボタンを追加 --- packages/sw/src/sw.ts | 13 ++++++++++++- 1 file changed, 12 insertions(+), 1 deletion(-) (limited to 'packages/sw/src/sw.ts') diff --git a/packages/sw/src/sw.ts b/packages/sw/src/sw.ts index 2783f2bfb5..1f085c7392 100644 --- a/packages/sw/src/sw.ts +++ b/packages/sw/src/sw.ts @@ -21,6 +21,10 @@ globalThis.addEventListener('activate', ev => { ); }); +function offlineContentHTML(): string { + return `Offline. Service Worker @${_VERSION_} ` +} + globalThis.addEventListener('fetch', ev => { let isHTMLRequest = false; if (ev.request.headers.get('sec-fetch-dest') === 'document') { @@ -34,7 +38,14 @@ globalThis.addEventListener('fetch', ev => { if (!isHTMLRequest) return; ev.respondWith( fetch(ev.request) - .catch(() => new Response(`Offline. Service Worker @${_VERSION_}`, { status: 200 })), + .catch(() => { + return new Response(offlineContentHTML(), { + status: 200, + headers: { + 'content-type': 'text/html', + }, + }); + }), ); }); -- cgit v1.2.3-freya