インストール済みのウェブアプリ(PWA)を新しいオリジンに移行するには、通常、ユーザーが古いアプリを手動でアンインストールして新しいアプリを再インストールする必要があります。このプロセスでは通常、タスクバーのショートカットや通知権限など、OS レベルの統合が失われます。ウェブアプリのオリジン移行では、古いオリジンと新しいオリジンの間で安全な引き継ぎを確立することで、この移行を自動化します。
移行は 2 段階の確認プロセスです。新しいサイトが古いサイトを前身として申請し、古いサイトが新しいサイトを後継として承認します。
重要な制約
実装の手順
1. 「同一サイト」ステータスの確認
必須: 新しいオリジンと古いオリジンの両方が 「Same-Site」である必要があります。同じ登録可能なドメイン(eTLD+1)を共有している必要があります。
- 許可:
app.example.comからnew.example.comへの移行(どちらもexample.comを共有)。 - 許可:
example.com/app1からexample.com/app2への移行。 - 禁止:
example.comからexample.orgへの移行(登録可能なドメインが異なる)。
2. 新しいアプリケーションを構成する
新しいアプリケーションは、その前身を宣言する必要があります。新しいアプリには id が必要です。
新しいサイトの manifest.json に migrate_from フィールドを追加します。
{
"name": "My New App",
"id": "/demo.html",
"start_url": "/demo.html",
"migrate_from": [
{
"id": "https://old-app.example.com/"
}
]
}
3. 古いオリジンで移行を承認する
オリジンのハイジャックを防ぐため、古いオリジンは移行を明示的に承認する必要があります。.well-known ディレクトリから提供される構成ファイルを作成します。
ファイルの場所: https://old-app.example.com/.well-known/web-app-origin-association
{
"https://new-app.example.com": {
"allow_migration": true
}
}
4. 移行を事前に通知する(省略可)
既存のユーザーが新しいサイトにアクセスするのを待たずに、すぐに移行をトリガーするには、migrate_to ヒントを使用して古いサイトのマニフェストを更新します。
{
"migrate_to": [
{
"id": "https://new-app.example.com/",
"install_url": "https://new-app.example.com/demo.html"
}
]
}
5. ユーザーに移行を求める(省略可)
デフォルトでは、ユーザーに移行が提案されます。移行を必須にするには、新しいアプリのマニフェストで behavior を force に設定します。
{
"migrate_from": [
{
"id": "https://old-app.example.com/",
"behavior": "force"
}
]
}
注: behavior: "force" によって古いアプリが自動的に削除されることはありません。ブラウザにダイアログが表示され、ユーザーは新しいバージョンに更新するか、アプリを完全に削除するかを選択する必要があります。
フォールバックとブラウザのサポート
手動再インストールのプロンプト
自動移行をサポートしていないブラウザでは、ユーザーは古いインストールのままになります。古いオリジンに、ユーザーを新しい Google サイト、など(# 文脈および文書内での統一性に応じて変更可)に誘導する UI 要素(通知バナーなど)を実装する必要があります。
ユーザーの設定は移行されず、古いアプリは自動的にアンインストールされません。