ワークボックスコア

Workbox はモジュール式に構築されているため、開発者は 1 つのファイルにすべてをダウンロードしなくても、使用する部分を選択できます。

ただし、モジュール間には重複があります。たとえば、各モジュールはコンソールとやり取りし、意味のあるエラーをスローし、ネットワークまたはキャッシュを利用する必要があります。各モジュールが同じロジックを実装しないように、workbox-core には、各モジュールが依存する共通のコードが含まれています。

このモジュールはデベロッパーにいくつかの機能を提供しますが、ログレベルとキャッシュ保存以外にも、workbox-core はエンド デベロッパーではなく各モジュールに内部ロジックを提供します。

デフォルトのキャッシュ名の表示と変更

Workbox は cacheNames でキャッシュを定義します。

import {cacheNames} from 'workbox-core';

console.log(cacheNames.precache);
console.log(cacheNames.runtime);
console.log(cacheNames.googleAnalytics);

これらのキャッシュ名は、接頭辞、名前、接尾辞の形式で構成され、キャッシュの使用に応じて名前が変更されます。

<prefix>-<cache-id>-<suffix>

これらのデフォルト名は、setCacheNameDetails() に渡される値のすべてまたは一部を変更することで変更できます。

import {cacheNames, setCacheNameDetails} from 'workbox-core';

setCacheNameDetails({
  prefix: 'my-app',
  suffix: 'v1',
  precache: 'install-time',
  runtime: 'run-time',
  googleAnalytics: 'ga',
});

// Will print 'my-app-install-time-v1'
console.log(cacheNames.precache);

// Will print 'my-app-run-time-v1'
console.log(cacheNames.runtime);

// Will print 'my-app-ga-v1'
console.log(cacheNames.googleAnalytics);

プレフィックスとサフィックスの主なユースケースは、複数のプロジェクトに Workbox を使用し、各プロジェクトに同じ localhost ポートを使用する場合に、各モジュールにカスタム プレフィックスを設定することで、キャッシュが競合しないようにすることです。

クライアントの申請

デベロッパーによっては、新しい Service Worker を公開して、有効になり次第、すでに開いているウェブページを制御したいと考える場合がありますが、これはデフォルトでは起こりません。

この動作が必要な場合は、workbox-core のヘルパー メソッドをご覧ください。

import {clientsClaim} from 'workbox-core';

// This clientsClaim() should be at the top level
// of your service worker, not inside of, e.g.,
// an event handler.
clientsClaim();

workbox-coreclientsClaim() メソッドは、activate イベント リスナーを Service Worker に自動的に追加し、その内部で self.clients.claim() を呼び出します。現在の Service Worker がアクティブになる前に self.clients.claim() を呼び出すと、ランタイム例外が発生します。workbox-core のラッパーにより、適切なタイミングで呼び出すことができます。

スキップ待機 ラッパーは非推奨となりました。

Workbox v6 より前のバージョンでは、workbox-coreskipWaiting() メソッドを使用することも推奨されていました。ただし、このメソッドには、デベロッパーが self.skipWaiting() を明示的に呼び出した場合に得られる値を超える価値はほとんどありません。

従来の workbox-core ラッパーには、self.skipWaiting() が呼び出される install イベント ハンドラも登録されていたため、インストールの完了後に message などの別のイベント ハンドラ内でラッパーが呼び出された場合、期待どおりに動作しません。

このような理由から、workbox-coreskipWaiting() は非推奨となっています。デベロッパーは、self.skipWaiting() を直接呼び出すようにする必要があります。self.clients.claim() とは異なり、self.skipWaiting() は「誤った」時間に呼び出されても例外をスローしないため、イベント ハンドラでラップする必要はありません。

CacheDidUpdateCallback()

workbox-core.CacheDidUpdateCallback(
  param: CacheDidUpdateCallbackParam,
)

パラメータ

戻り値

  • Promise<void>

CacheDidUpdateCallbackParam

プロパティ

  • cacheName

    文字列

  • event

    ExtendableEvent

  • newResponse

    レスポンス

  • oldResponse

    回答(省略可

  • request

    リクエスト

  • state

    MapLikeObject 省略可

CachedResponseWillBeUsedCallback()

workbox-core.CachedResponseWillBeUsedCallback(
  param: CachedResponseWillBeUsedCallbackParam,
)

戻り値

  • Promise<void|Response>

CachedResponseWillBeUsedCallbackParam

プロパティ

  • cacheName

    文字列

  • cachedResponse

    回答(省略可

  • event

    ExtendableEvent

  • matchOptions

    CacheQueryOptions 省略可

  • request

    リクエスト

  • state

    MapLikeObject 省略可

CacheKeyWillBeUsedCallback()

workbox-core.CacheKeyWillBeUsedCallback(
  param: CacheKeyWillBeUsedCallbackParam,
)

パラメータ

戻り値

  • Promise<文字列|リクエスト>

CacheKeyWillBeUsedCallbackParam

プロパティ

  • event

    ExtendableEvent

  • モード

    文字列

  • params

    省略可

  • request

    リクエスト

  • state

    MapLikeObject 省略可

CacheWillUpdateCallback()

workbox-core.CacheWillUpdateCallback(
  param: CacheWillUpdateCallbackParam,
)

パラメータ

戻り値

  • Promise<void|Response>

CacheWillUpdateCallbackParam

プロパティ

  • event

    ExtendableEvent

  • request

    リクエスト

  • レスポンス

    レスポンス

  • state

    MapLikeObject 省略可

FetchDidFailCallback()

workbox-core.FetchDidFailCallback(
  param: FetchDidFailCallbackParam,
)

パラメータ

戻り値

  • Promise<void>

FetchDidFailCallbackParam

プロパティ

  • error

    エラー

  • event

    ExtendableEvent

  • originalRequest

    リクエスト

  • request

    リクエスト

  • state

    MapLikeObject 省略可

FetchDidSucceedCallback()

workbox-core.FetchDidSucceedCallback(
  param: FetchDidSucceedCallbackParam,
)

パラメータ

戻り値

  • Promise<Response>

FetchDidSucceedCallbackParam

プロパティ

  • event

    ExtendableEvent

  • request

    リクエスト

  • レスポンス

    レスポンス

  • state

    MapLikeObject 省略可

HandlerCallbackOptions

HandlerDidCompleteCallback()

workbox-core.HandlerDidCompleteCallback(
  param: HandlerDidCompleteCallbackParam,
)

パラメータ

戻り値

  • Promise<void>

HandlerDidCompleteCallbackParam

プロパティ

  • error

    エラー(省略可

  • event

    ExtendableEvent

  • request

    リクエスト

  • レスポンス

    回答(省略可

  • state

    MapLikeObject 省略可

HandlerDidErrorCallback()

workbox-core.HandlerDidErrorCallback(
  param: HandlerDidErrorCallbackParam,
)

パラメータ

戻り値

  • Promise<Response>

HandlerDidErrorCallbackParam

プロパティ

  • error

    エラー

  • event

    ExtendableEvent

  • request

    リクエスト

  • state

    MapLikeObject 省略可

HandlerDidRespondCallback()

workbox-core.HandlerDidRespondCallback(
  param: HandlerDidRespondCallbackParam,
)

パラメータ

戻り値

  • Promise<void>

HandlerDidRespondCallbackParam

プロパティ

  • event

    ExtendableEvent

  • request

    リクエスト

  • レスポンス

    回答(省略可

  • state

    MapLikeObject 省略可

HandlerWillRespondCallback()

workbox-core.HandlerWillRespondCallback(
  param: HandlerWillRespondCallbackParam,
)

パラメータ

戻り値

  • Promise<Response>

HandlerWillRespondCallbackParam

プロパティ

  • event

    ExtendableEvent

  • request

    リクエスト

  • レスポンス

    レスポンス

  • state

    MapLikeObject 省略可

HandlerWillStartCallback()

workbox-core.HandlerWillStartCallback(
  param: HandlerWillStartCallbackParam,
)

パラメータ

戻り値

  • Promise<void>

HandlerWillStartCallbackParam

プロパティ

  • event

    ExtendableEvent

  • request

    リクエスト

  • state

    MapLikeObject 省略可

ManualHandlerCallback()

workbox-core.ManualHandlerCallback(
  options: ManualHandlerCallbackOptions,
)

「handler」コールバックは、RouterRouteMatchCallback を介して URL/リクエストを Route に一致させるたびに呼び出されます。このハンドラ コールバックは、Response で解決される Promise を返す必要があります。

RouteMatchCallback によって空でない配列またはオブジェクトが返された場合は、このハンドラの options.params 引数として渡されます。

パラメータ

戻り値

  • Promise<Response>

ManualHandlerCallbackOptions

ManualHandlerCallback 関数に渡されるオプション。

プロパティ

  • event

    ExtendableEvent

  • request

    文字列|リクエスト

MapLikeObject

PluginState

現時点ではプレーンな MapLikeObject を使用しますが、将来的に拡張/制限される可能性があります。

タイプ

RequestWillFetchCallback()

workbox-core.RequestWillFetchCallback(
  param: RequestWillFetchCallbackParam,
)

パラメータ

戻り値

  • Promise<Request>

RequestWillFetchCallbackParam

プロパティ

  • event

    ExtendableEvent

  • request

    リクエスト

  • state

    MapLikeObject 省略可

RouteHandler

RouteHandlerCallback または RouteHandlerObject。ルートハンドラを受け入れる workbox-routing のほとんどの API は、どちらかを受け取ります。

RouteHandlerCallback()

workbox-core.RouteHandlerCallback(
  options: RouteHandlerCallbackOptions,
)

「handler」コールバックは、RouterRouteMatchCallback を介して URL/リクエストを Route に一致させるたびに呼び出されます。このハンドラ コールバックは、Response で解決される Promise を返す必要があります。

RouteMatchCallback によって空でない配列またはオブジェクトが返された場合は、このハンドラの options.params 引数として渡されます。

パラメータ

戻り値

  • Promise<Response>

RouteHandlerCallbackOptions

RouteHandlerCallback 関数に渡されるオプション。

プロパティ

  • event

    ExtendableEvent

  • params

    string[]|MapLikeObject 省略可

  • request

    リクエスト

  • URL

    URL

RouteHandlerObject

RouteHandlerCallback 型の handle メソッドを持つオブジェクト。

Route オブジェクトは、RouteHandlerCallback 関数またはこの RouteHandler オブジェクトで作成できます。RouteHandler のメリットは、(workbox-strategies パッケージと同様に)拡張できることです。

プロパティ

RouteMatchCallback()

workbox-core.RouteMatchCallback(
  options: RouteMatchCallbackOptions,
)

「match」コールバックは、Route を特定の URL とリクエストに適用すべきかどうかを判断するために使用されます。クライアントからの取得イベントに応答してマッチングが行われる場合は、event オブジェクトも提供されます。ただし、一致コールバックはフェッチ イベントの外部で呼び出すことができるため、マッチング ロジックでは、event オブジェクトが常に使用可能であると仮定すべきではありません。match コールバックが true 値を返すと、照合ルートの RouteHandlerCallback が直ちに呼び出されます。返された値が空でない配列またはオブジェクトである場合、その値がハンドラの options.params 引数に設定されます。

パラメータ

戻り値

  • 任意

RouteMatchCallbackOptions

RouteMatchCallback 関数に渡されるオプション。

プロパティ

  • event

    ExtendableEvent

  • request

    リクエスト

  • sameOrigin

    boolean

  • URL

    URL

WorkboxPlugin

フェッチ オペレーションとキャッシュ オペレーションのライフサイクル コールバック プロパティをオプションとして持つオブジェクト。

プロパティ

WorkboxPluginCallbackParam

プロパティ

プロパティ

cacheNames

Workbox で現在使用されているキャッシュ名と接頭辞/接尾辞を取得します。

cacheNames.precache は事前キャッシュされたアセットに、cacheNames.googleAnalyticsworkbox-google-analyticsanalytics.js を保存し、cacheNames.runtime がその他すべてに使用されます。

cacheNames.prefix を使用すると、現在の接頭辞値のみを取得できます。cacheNames.suffix を使用すると、現在のサフィックス値のみを取得できます。

タイプ

オブジェクト

プロパティ

  • googleAnalytics

    文字列

  • 事前キャッシュ

    文字列

  • 接頭辞

    文字列

  • runtime

    文字列

  • サフィックス

    文字列

Methods

clientsClaim()

workbox-core.clientsClaim()

Service Worker がアクティブになったら、現在使用可能なクライアントを要求します。これは通常、skipWaiting() と組み合わせて使用されます。

copyResponse()

workbox-core.copyResponse(
  response: Response,
  modifier?: function,
)

デベロッパーがレスポンスをコピーして、その headersstatus、または statusText の値(コンストラクタの [ResponseInit]https://developer.mozilla.org/en-US/docs/Web/API/Response/Response#Syntax オブジェクトを介して設定可能な値)を変更できます。これらの値を変更するには、2 番目の引数として関数を渡します。この関数は、レスポンス プロパティ {headers, status, statusText} を持つ単一のオブジェクトで呼び出されます。この関数の戻り値は、新しい ResponseResponseInit として使用されます。値を変更するには、渡されたパラメータを変更して返すか、まったく新しいオブジェクトを返します。

この方法は、CORS が使用されているかどうかにかかわらず、意図的に同一オリジン レスポンスに限定されます。

パラメータ

  • レスポンス

    レスポンス

  • 修飾子

    関数(省略可)

    modifier パラメータは次のようになります。

    (responseInit: ResponseInit)=>ResponseInit

    • responseInit

      ResponseInit

    • 戻り値

      ResponseInit

戻り値

  • Promise<Response>

registerQuotaErrorCallback()

workbox-core.registerQuotaErrorCallback(
  callback: Function,
)

割り当てエラーが発生した場合に実行される quotaErrorCallbacks のセットに関数を追加します。

パラメータ

  • callback

    関数

setCacheNameDetails()

workbox-core.setCacheNameDetails(
  details: PartialCacheNameDetails,
)

Workbox パッケージで使用されるデフォルトのキャッシュ名を変更します。キャッシュ名は <prefix>-<Cache Name>-<suffix> として生成されます。

パラメータ

  • 詳細

    PartialCacheNameDetails

skipWaiting()

workbox-core.skipWaiting()

このメソッドは非推奨であり、Workbox v7 で削除される予定です。

self.skipWaiting() の呼び出しは同等であるため、代わりに使用する必要があります。