Chrome でウェブアプリ マニフェストの更新を処理する方法

PWA のアイコン、ショートカット、色などのメタデータを変更する方法

Adriana Jara
François Beaufort
François Beaufort
GitHub
Pete LePage

PWA がインストールされると、ブラウザではウェブアプリ マニフェストから取得した情報をアプリ名、アプリで使用するアイコン、アプリの起動時に開く必要がある URL に使用されます。アプリのショートカットを更新したり、新しいテーマカラーを試したりする必要がある場合はどうすればよいでしょうか。変更はいつ、どのようにブラウザに反映されますか？

ほとんどの場合、マニフェストが更新された後、PWA のリリースから 1～2 日以内に変更が反映されます。

パソコン版 Chrome の更新

PWA が起動されたとき、またはブラウザのタブで開かれたときに、Chrome はローカル マニフェストの変更が最後に確認された日時を判断します。ブラウザが最後に起動してからマニフェストがチェックされていない場合、または過去 24 時間以内にマニフェストがチェックされていない場合、Chrome はマニフェストのネットワーク リクエストを行い、ローカルコピーと比較します。

マニフェストで選択したプロパティが変更された場合（下記のリストを参照）、Chrome は新しいマニフェストをキューに登録し、すべてのウィンドウを閉じた後にインストールします。インストールされると、新しいマニフェストのすべてのフィールド（icons を除く）が更新されます。

更新をトリガーするプロパティ

  • name
  • short_name
  • display（以下を参照）
  • scope
  • shortcuts
  • start_url
  • theme_color
  • file_handlers

display フィールドが更新されるとどうなりますか？

アプリの表示モードを browser から standalone に更新した場合、既存のユーザーのアプリは更新後にウィンドウで開きません。ウェブアプリには、マニフェスト（ユーザーが制御）とウィンドウ / ブラウザのタブ設定（ユーザーが制御）の 2 つの表示設定があります。ユーザーの設定は常に尊重されます。

マニフェストの更新をテストする

chrome://web-app-internals ページ（Chrome 85 以降で利用可能）には、デバイスにインストールされているすべての PWA に関する詳細情報が表示され、マニフェストの最終更新日や更新頻度などを確認できます。

Chrome で更新されたマニフェストを強制的に確認するには、コマンドライン フラグ --disable-manifest-update-throttle を使用して Chrome を起動するか、Chrome を再起動します（about://restart を使用）。これによりタイマーがリセットされ、次回 PWA が起動されたときに Chrome で更新されたマニフェストが確認されます。次に、PWA を起動します。PWA を閉じると、新しいマニフェスト プロパティで更新されます。

参照

Chrome for Android の更新

PWA が起動されると、Chrome はローカル マニフェストの変更が最後に確認された日時を特定します。マニフェストが過去 24 時間以内にチェックされていない場合、Chrome はマニフェストのネットワーク リクエストをスケジュールし、ローカルコピーと比較します。

マニフェストの特定のプロパティが変更された場合（下記のリストをご覧ください）、Chrome は新しいマニフェストをキューに追加します。PWA のすべてのウィンドウが閉じられ、デバイスが電源に接続され、Wi-Fi に接続されると、Chrome はサーバーに更新された WebAPK をリクエストします。更新すると、新しいマニフェストのすべてのフィールドが使用されます。

更新をトリガーするプロパティ

  • name
  • short_name
  • icons
  • background_color
  • display
  • orientation
  • scope
  • shortcuts
  • start_url
  • theme_color
  • web_share_target

Chrome がサーバーから更新されたマニフェストを取得できない場合、チェックの間隔が 30 日に延長されることがあります。

マニフェストの更新をテストする

about://webapks ページには、デバイスにインストールされているすべての PWA に関する詳細情報が含まれます。また、マニフェストの最終更新日時や更新頻度などの情報を確認できます。

マニフェストの更新を手動でスケジュールするには、タイマーとローカル マニフェストをオーバーライドします。手順は次のとおりです。

  1. デバイスを電源に接続し、Wi-Fi に接続されていることを確認します。
  2. Android タスク マネージャーを使用して PWA をシャットダウンしてから、Android 設定の [アプリ] パネルを使用して PWA を強制停止します。
  3. Chrome で about://webapks を開き、PWA の [更新] ボタンをクリックします。[更新ステータス] が [保留中] に変わります。
  4. PWA を起動し、正しく読み込まれることを確認します。
  5. Android タスク マネージャーを使用して PWA をシャットダウンし、Android 設定の [アプリ] パネルを使用して PWA を強制停止します。

通常、PWA は数分以内に更新されます。更新が完了すると、[更新ステータス] が [成功] に変わります。

参照