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 注意: start_url を変更するには、マニフェストの id を設定する必要があります。詳細
  • theme_color
  • file_handlers

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

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

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

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 の [更新] ボタンをクリックします。[Update Status] が [Pending] に変わります。
  4. PWA を起動し、正しく読み込まれていることを確認します。
  5. Android のタスク マネージャーを使用して PWA をシャットダウンし、Android 設定の [アプリ] パネルを使用して PWA を強制停止します。

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

参照