概要
Googleが7月30日(現地時間)、「Chrome 76」をリリースした模様です。
表題通りPWAのデスクトップインストールについて、どのような挙動になったかご紹介します。
手順
-
デスクトップのアイコンに追加される
manifest.jsonのstart_urlのパラメーターは維持される
manifest.jsonにはspページのURLに解析用のパラメーターをつけたものを設定していました。
開いたページはPCのURLにパラメーターがついているものだったので、SPからPCページにリダイレクトされ、かつパラメーターを維持していることがわかりました。
また、サービスワーカーも引き継がれています。
manifest.json
{
"name": "H.I.S.",
"short_name": "H.I.S.",
"theme_color": "#004098",
"background_color": "#004098",
"display": "minimal-ui",
"scope": "/",
"start_url": "kanto_sp.html?debug=pwa&cid=top_homescreen&utm_source=top_homescreen&utm_medium=homescreen&utm_campaign=top_homescreen",
"icons": [
{
"src": "/cmn/icon/pwa/icon-72x72.png",
"sizes": "72x72",
"type": "image/png"
},
{
"src": "/cmn/icon/pwa/icon-96x96.png",
"sizes": "96x96",
"type": "image/png"
},
{
"src": "/cmn/icon/pwa/icon-128x128.png",
"sizes": "128x128",
"type": "image/png"
},
{
"src": "/cmn/icon/pwa/icon-144x144.png",
"sizes": "144x144",
"type": "image/png"
},
{
"src": "/cmn/icon/pwa/icon-152x152.png",
"sizes": "152x152",
"type": "image/png"
},
{
"src": "/cmn/icon/pwa/icon-192x192.png",
"sizes": "192x192",
"type": "image/png"
},
{
"src": "/cmn/icon/pwa/icon-384x384.png",
"sizes": "384x384",
"type": "image/png"
},
{
"src": "/cmn/icon/pwa/icon-512x512.png",
"sizes": "512x512",
"type": "image/png"
}
],
"splash_pages": null
}
展望
- アドレスバーの+ボタンは見つけにくい!
- beforeinstallpromptイベントでホーム画面追加ボタンの発火を制御し、ページ内に別のボタンを設置すればデスクトップからのアクセスを増やすこともできそうですね。(→こちらの記事に書きました。)
ありがとうございました。