monkee.ch/monkeeShark
1
0
Fork 0
Code Pull requests Activity

オフライン時の画面にリロードボタンを追加 (#11242)

Browse source 
* feat: オフライン時の画面にリロードボタンを追加

リロードのためのボタンがないとPWAでインターネットが復帰しても何もできなくなるため。

* docs(changelog): add オフライン時の画面にリロードボタンを追加
This commit is contained in:
anatawa12 2023-07-11 18:24:10 +09:00 committed by GitHub
parent cf3e39178b
commit 9845ccec5b
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 13 additions and 1 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

1
CHANGELOG.md
View file

@ -30,6 +30,7 @@
- ユーザーのContextMenuに「アンテナに追加」ボタンを追加
- フォローやお気に入り登録をしていないチャンネルを開く時は概要ページを開くように
- 画面ビューワをタップした場合、マウスクリックと同様に画像ビューワを閉じるように
- オフライン時の画面にリロードボタンを追加
- Fix: サーバーメトリクスが90度傾いている
- Fix: 非ログイン時にクレデンシャルが必要なページに行くとエラーが出る問題を修正
- Fix: sparkle内にリンクを入れるとクリック不能になる問題の修正

13
packages/sw/src/sw.ts
View file

@ -21,6 +21,10 @@ globalThis.addEventListener('activate', ev => {
);
});
function offlineContentHTML(): string {
return `<!doctype html>Offline. Service Worker @${_VERSION_} <button onclick="location.reload()">reload</button>`
}
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',
},
});
}),
);
});