web-dev-qa-db-ja.com

ワークボックス：self.skipWaiting（）の危険性

Workboxを使用して、_index.html_の基本バージョンを含む、アプリシェルのレンダリングに必要なアセットを事前にキャッシュします。 Workboxは、_index.html_がキャッシュで使用可能であると想定します。そうでない場合、Service Workerに登録しているため、ページナビゲーションが失敗します。

_workbox.routing.registerNavigationRoute('/index.html');
_

インストールリスナーにself.skipWaiting()命令もあります。

_self.addEventListener('install', e => {
  self.skipWaiting();
});
_

私が理解しているように、現在2つのinstallリスナーがあります。

  • アセット（index.htmlを含む）を事前にキャッシュするためにWorkboxによって登録されたもの
  • ServiceWorkerに手動で登録したもの

Workboxのインストールリスナーが失敗しているときにself.skipWaiting()が成功する可能性はありますか？これにより、アセットが事前にキャッシュされないが、ServiceWorkerがアクティブ化されるという問題のある状態が発生します。そのようなシナリオは可能ですか？それから保護する必要がありますか？

cachingservice-workerprogressive-web-appsoffline-cachingworkbox
7
Johnny Oshika

サービスワーカーのインストールと更新のさまざまな段階に関する信頼できる情報源として、「 サービスワーカーのライフサイクル "」を強くお勧めします。

あなたの質問に当てはまるように、その記事からいくつかの情報を要約すると：

  • ServiceWorkerは最初にinstallingフェーズに入りますが、登録したinstallリスナーの数に関係なく、すべてのリスナーが実行する機会があります。ご提案のとおり、Workboxはプリキャッシングを処理するために独自のinstallリスナーを作成します。

  • すべてのinstallリスナーがエラーなしで完了した場合にのみ、サービスワーカーは次のステージに進みます。これは、waitingのいずれかです（以前のバージョンのサービスワーカーを使用しているクライアントがすでに開いている場合）。 ）またはactivating（以前のバージョンのService Workerを使用しているクライアントがない場合）。

  • skipWaiting() 、それを使用することを選択した場合、以前のバージョンのサービスを使用しているオープンクライアントがあるかどうかに関係なく、waitingステージをバイパスしますワーカー。

  • skipWaiting()を呼び出しても、installリスナーのいずれかが失敗した場合は何も実行されません。これは、ServiceWorkerがinstallingフェーズを離れることがないためです。それは基本的にノーオペレーションです。

注意が必要なことの1つは、バージョン管理され、事前にキャッシュされたアセットの遅延読み込みも使用している場合にskipWaiting()を使用することです。記事が警告するように：

注意：skipWaiting()は、新しいServiceWorkerが古いバージョンでロードされたページを制御している可能性があることを意味します。つまり、ページのフェッチの一部は古いService Workerによって処理されますが、新しいServiceWorkerは後続のフェッチを処理します。これで問題が発生する可能性がある場合は、skipWaiting()を使用しないでください。

事前にキャッシュされたバージョン管理されたアセットの遅延読み込みは2018年に行うのがはるかに一般的であるため、WorkboxはデフォルトでskipWaiting()を呼び出しません。それを使用することをオプトインするのはあなた次第です。

17
Jeff Posnick