PWAのインストールボタンを作る

[kakkokari-gtyih]

Summary

window.$clientPWA = null;
window.addEventListener('beforeinstallprompt', (e) => { window.$clientPWA = e;});

function onclick() {
    window.$clientPWA != null ? window.$clientPWA.prompt() : alert('非対応');
}

っていう実装をやる（実際にはwindowにこんなプロパティを置く必要はない）（Chrome系では動く）

Purpose

PWAのインストール方法がわかりにくすぎる

Do you want to implement this feature yourself?

• Yes, I will implement this by myself and send a pull request

[kakkokari-gtyih]

chrome系しか無理だった

https://developer.mozilla.org/en-US/docs/Web/API/BeforeInstallPromptEvent/prompt

[samunohito]

Safari…

[kakkokari-gtyih]

非対応の場合はこうするか

https://zenn.dev/kodai/articles/be376a8ea8e071#%E5%9B%9E%E9%81%BF%E7%AD%96

[acid-chicken]

w3c/manifest#835 によれば削除された仕様みたいだしあまり気乗りしない感はある（し Safari に文句を言うのは筋違い感）

[samunohito]

beforeinstallprompt、W3Cから消えたんだ…Chromium系もどうなるか分からないし、怪しいかも

[tamaina]

PWAのインストール方法がわかりにくすぎる

ほんまか？？？（ChromeとかEdgeはうざいほどアプリインストールを推奨してくるイメージがある

[tamaina]

Safariは導線ゼロだけど

[kakkokari-gtyih]

Safariは導線ゼロだけど

主にSafariの導線をどうにかしたい

[tamaina]

w3c/manifest#836

[kakkokari-gtyih]

w3c/manifest#836

非対応の場合はこうするか

https://zenn.dev/kodai/articles/be376a8ea8e071#%E5%9B%9E%E9%81%BF%E7%AD%96

のように手動での操作方法を埋め込むしかなさそう

[tamaina]

手動での操作方法をSafari限定で出すのはいいと思う