Workboxにフェッチオプションを追加する方法は？

Question

パスワードで保護されたWebサイトでPWAを動作させるために、すべてのフェッチ要求にcredentials: 'same-origin'を追加する必要があります。それ以外の場合、ウェブサイトを離れて後で戻ってくると、ブラウザはパスワードを要求せず、Unauthorizedエラーを返します。

どのように私はそれをWorkboxで行うのですか？私はRequestWrapperクラスにfetchOptionsが含まれていることに気付きましたが、それらを使用する方法が見つかりません。

Answer 1

v2では、すべての発信要求に対して、キャッシングをalready setcredentials: 'same-origin'としてFetchOptionsとする必要があります。ランタイムキャッシュに

、あなたはランタイム・キャッシング・ハンドラの中で、あなたが使用していることをあなた自身のRequestWrapperインスタンスを作成して渡すことで、この動作を取得することができます：

const requestWrapper = new RequestWrapper({ 
    cacheName: 'my-cache-name', // Change this for each separate cache. 
    fetchOptions: { 
    credentials: 'same-origin', 
    }, 
    plugins: [], // Add any plugins you need here, e.g. CacheExpiration. 
}); 

const staleWhileRevalidateHandler = new StaleWhileRevalidate({requestWrapper}); 

workboxSW.router.registerRoute(
    new RegExp('/path/prefix'), 
    staleWhileRevalidateHandler 
); 

を（私はあなたがしているかどうかはわかりませんワークブックライブラリを使用していますが、RequestWrapperクラスにアクセスするために追加のスクリプトを明示的にインポートする必要があります（https://unpkg.com/workbox-runtime-caching@2.0.3/build/importScripts/workbox-runtime-caching.prod.v2.0.3.jsなど）