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

PWA のアイコン、ショートカット、色、その他のメタデータの変更に必要な手順

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

ほとんどの場合、変更はマニフェストが更新されてから PWA が起動してから 1 ~ 2 日以内に反映されます。

パソコン版 Chrome のアップデート

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

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

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

  • display(以下を参照)
  • scope
  • shortcuts
  • start_url
  • 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 をサーバーにリクエストします。更新後は、新しいマニフェストのすべてのフィールドが使用されます。

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

  • 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 は数分以内に更新されます。更新が完了すると、[更新ステータス] が [成功] に変わります。

参照