coeur de la boîte de travail

Workbox a été conçu pour être modulaire, ce qui permet aux développeurs de sélectionner les éléments qu'ils souhaitent utiliser sans les forcer à tout télécharger dans un seul fichier.

Toutefois, il existe un chevauchement entre les modules. Par exemple, chaque module devra interagir avec la console, générer des erreurs significatives et utiliser le réseau ou le cache. Pour éviter que chaque module implémente la même logique, workbox-core contient ce code commun sur lequel s'appuie chaque module.

Ce module fournit certaines fonctionnalités aux développeurs, mais au-delà des niveaux de journalisation et de la mise en cache, workbox-core propose une logique interne à chaque module plutôt qu'au développeur final.

Afficher et modifier les noms de cache par défaut

Workbox définit ses caches via cacheNames:

import {cacheNames} from 'workbox-core';

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

Ces noms de cache sont construits sous la forme d'un préfixe, d'un nom et d'un suffixe, le nom changeant en fonction de l'utilisation du cache.

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

Vous pouvez modifier ces noms par défaut en modifiant tout ou partie des valeurs transmises à 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);

Le principal cas d'utilisation du préfixe et du suffixe est que si vous utilisez Workbox pour plusieurs projets et que vous utilisez le même port localhost pour chaque projet, la définition d'un préfixe personnalisé pour chaque module empêche les caches d'entrer en conflit.

Demande des clients

Certains développeurs souhaitent pouvoir publier un nouveau service worker et lui permettre de contrôler les pages Web déjà ouvertes dès son activation, ce qui ne se produira pas par défaut.

Si vous souhaitez que ce comportement s'applique, workbox-core fournit une méthode d'assistance:

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();

La méthode clientsClaim() dans workbox-core ajoute automatiquement un écouteur d'événements activate à votre service worker et appelle self.clients.claim(). L'appel de self.clients.claim() avant l'activation du service worker actuel génère une exception d'exécution. Le wrapper de workbox-core permet de s'assurer de l'appeler au bon moment.

Le wrapper jumpWaiting est obsolète.

Avant Workbox v6, les développeurs étaient également encouragés à utiliser la méthode skipWaiting() de workbox-core. Cependant, cette méthode n'offrait que peu d'intérêt au-delà de ce que les développeurs obtiendraient s'ils appelaient self.skipWaiting() explicitement.

Étant donné que l'ancien wrapper workbox-core a également enregistré un gestionnaire d'événements install dans lequel self.skipWaiting() a été appelé, il ne se comporterait pas comme prévu s'il était appelé dans un autre gestionnaire d'événements, tel que message, une fois l'installation terminée.

Pour ces raisons, le skipWaiting() de workbox-core est obsolète. Les développeurs doivent donc passer directement à l'appel de self.skipWaiting(). Contrairement à self.clients.claim(), self.skipWaiting() ne génère pas d'exception s'il est appelé au "mauvais" moment. Il n'est donc pas nécessaire de l'encapsuler dans un gestionnaire d'événements.

Types

CacheDidUpdateCallback()

workbox-core.CacheDidUpdateCallback(
  param: CacheDidUpdateCallbackParam,
)

Paramètres

Renvoie

  • Promise<void>

CacheDidUpdateCallbackParam

Propriétés

  • cacheName

    chaîne

  • event

    ExtendableEvent

  • newResponse

    Réponse

  • oldResponse

    Réponse facultatif

  • request

    Requête

  • state

    MapLikeObject facultatif

CachedResponseWillBeUsedCallback()

workbox-core.CachedResponseWillBeUsedCallback(
  param: CachedResponseWillBeUsedCallbackParam,
)

Paramètres

Renvoie

  • Promise<void | Response>

CachedResponseWillBeUsedCallbackParam

Propriétés

  • cacheName

    chaîne

  • cachedResponse

    Réponse facultatif

  • event

    ExtendableEvent

  • matchOptions

    CacheQueryOptions facultatif

  • request

    Requête

  • state

    MapLikeObject facultatif

CacheKeyWillBeUsedCallback()

workbox-core.CacheKeyWillBeUsedCallback(
  param: CacheKeyWillBeUsedCallbackParam,
)

Paramètres

Renvoie

  • Promise<string | Request>

CacheKeyWillBeUsedCallbackParam

Propriétés

  • event

    ExtendableEvent

  • Standard

    chaîne

  • params

    Toute valeur facultatif

  • request

    Requête

  • state

    MapLikeObject facultatif

CacheWillUpdateCallback()

workbox-core.CacheWillUpdateCallback(
  param: CacheWillUpdateCallbackParam,
)

Paramètres

Renvoie

  • Promise<void | Response>

CacheWillUpdateCallbackParam

Propriétés

  • event

    ExtendableEvent

  • request

    Requête

  • réponse

    Réponse

  • state

    MapLikeObject facultatif

FetchDidFailCallback()

workbox-core.FetchDidFailCallback(
  param: FetchDidFailCallbackParam,
)

Paramètres

Renvoie

  • Promise<void>

FetchDidFailCallbackParam

Propriétés

  • error

    Erreur

  • event

    ExtendableEvent

  • originalRequest

    Requête

  • request

    Requête

  • state

    MapLikeObject facultatif

FetchDidSucceedCallback()

workbox-core.FetchDidSucceedCallback(
  param: FetchDidSucceedCallbackParam,
)

Paramètres

Renvoie

  • Promesse<Réponse>

FetchDidSucceedCallbackParam

Propriétés

  • event

    ExtendableEvent

  • request

    Requête

  • réponse

    Réponse

  • state

    MapLikeObject facultatif

HandlerCallbackOptions

Enum

RouteHandlerCallbackOptions

ManualHandlerCallbackOptions

HandlerDidCompleteCallback()

workbox-core.HandlerDidCompleteCallback(
  param: HandlerDidCompleteCallbackParam,
)

Paramètres

Renvoie

  • Promise<void>

HandlerDidCompleteCallbackParam

Propriétés

  • error

    Erreur facultative

  • event

    ExtendableEvent

  • request

    Requête

  • réponse

    Réponse facultatif

  • state

    MapLikeObject facultatif

HandlerDidErrorCallback()

workbox-core.HandlerDidErrorCallback(
  param: HandlerDidErrorCallbackParam,
)

Paramètres

Renvoie

  • Promesse<Réponse>

HandlerDidErrorCallbackParam

Propriétés

  • error

    Erreur

  • event

    ExtendableEvent

  • request

    Requête

  • state

    MapLikeObject facultatif

HandlerDidRespondCallback()

workbox-core.HandlerDidRespondCallback(
  param: HandlerDidRespondCallbackParam,
)

Paramètres

Renvoie

  • Promise<void>

HandlerDidRespondCallbackParam

Propriétés

  • event

    ExtendableEvent

  • request

    Requête

  • réponse

    Réponse facultatif

  • state

    MapLikeObject facultatif

HandlerWillRespondCallback()

workbox-core.HandlerWillRespondCallback(
  param: HandlerWillRespondCallbackParam,
)

Paramètres

Renvoie

  • Promesse<Réponse>

HandlerWillRespondCallbackParam

Propriétés

  • event

    ExtendableEvent

  • request

    Requête

  • réponse

    Réponse

  • state

    MapLikeObject facultatif

HandlerWillStartCallback()

workbox-core.HandlerWillStartCallback(
  param: HandlerWillStartCallbackParam,
)

Paramètres

Renvoie

  • Promise<void>

HandlerWillStartCallbackParam

Propriétés

  • event

    ExtendableEvent

  • request

    Requête

  • state

    MapLikeObject facultatif

ManualHandlerCallback()

workbox-core.ManualHandlerCallback(
  options: ManualHandlerCallbackOptions,
)

Le rappel "handler" est invoqué chaque fois qu'un objet Router établit une correspondance entre une URL ou une requête avec un élément Route via son élément RouteMatchCallback. Ce rappel de gestionnaire doit renvoyer un Promise qui se résout avec un Response.

Si un tableau ou un objet non vide est renvoyé par RouteMatchCallback, il sera transmis en tant qu'argument options.params de ce gestionnaire.

Paramètres

Renvoie

  • Promesse<Réponse>

ManualHandlerCallbackOptions

Options transmises à une fonction ManualHandlerCallback.

Propriétés

  • event

    ExtendableEvent

  • request

    chaîne | Demande

MapLikeObject

PluginState

Utiliser un MapLikeObject simple pour le moment, mais pourrait étendre/restreindre ce comportement à l'avenir.

Type

MapLikeObject

RequestWillFetchCallback()

workbox-core.RequestWillFetchCallback(
  param: RequestWillFetchCallbackParam,
)

Paramètres

Renvoie

  • Promesse<Demande>

RequestWillFetchCallbackParam

Propriétés

  • event

    ExtendableEvent

  • request

    Requête

  • state

    MapLikeObject facultatif

RouteHandler

RouteHandlerCallback ou RouteHandlerObject. La plupart des API de workbox-routing qui acceptent les gestionnaires de routes utilisent l'une ou l'autre de ces deux méthodes.

Enum

RouteHandlerCallback

RouteHandlerObject

RouteHandlerCallback()

workbox-core.RouteHandlerCallback(
  options: RouteHandlerCallbackOptions,
)

Le rappel "handler" est invoqué chaque fois qu'un objet Router établit une correspondance entre une URL ou une requête avec un élément Route via son élément RouteMatchCallback. Ce rappel de gestionnaire doit renvoyer un Promise qui se résout avec un Response.

Si un tableau ou un objet non vide est renvoyé par RouteMatchCallback, il sera transmis en tant qu'argument options.params de ce gestionnaire.

Paramètres

Renvoie

  • Promesse<Réponse>

RouteHandlerCallbackOptions

Options transmises à une fonction RouteHandlerCallback.

Propriétés

  • event

    ExtendableEvent

  • params

    chaîne[] | MapLikeObject facultatif

  • request

    Requête

  • url

    URL

RouteHandlerObject

Objet avec une méthode handle de type RouteHandlerCallback.

Un objet Route peut être créé avec une fonction RouteHandlerCallback ou cet objet RouteHandler. L'avantage de RouteHandler est qu'il peut être étendu (comme le permet le package workbox-strategies).

Propriétés

RouteMatchCallback()

workbox-core.RouteMatchCallback(
  options: RouteMatchCallbackOptions,
)

Le rappel de "correspondance" permet de déterminer si un Route doit s'appliquer à une URL et à une requête particulières. Lorsque la mise en correspondance se produit en réponse à un événement de récupération du client, l'objet event est également fourni. Toutefois, comme le rappel de correspondance peut être invoqué en dehors d'un événement de récupération, la logique de correspondance ne doit pas supposer que l'objet event sera toujours disponible. Si le rappel de correspondance renvoie une valeur fiable, le RouteHandlerCallback de la route correspondante sera appelé immédiatement. Si la valeur renvoyée est un tableau ou un objet non vide, cette valeur sera définie dans l'argument options.params du gestionnaire.

Paramètres

Renvoie

  • toutes

RouteMatchCallbackOptions

Options transmises à une fonction RouteMatchCallback.

Propriétés

  • event

    ExtendableEvent

  • request

    Requête

  • sameOrigin

    boolean

  • url

    URL

WorkboxPlugin

Objet avec des propriétés de rappel de cycle de vie facultatives pour les opérations de récupération et de mise en cache.

Propriétés

WorkboxPluginCallbackParam

Propriétés

Propriétés

cacheNames

Permet d'obtenir les noms de cache et le préfixe/suffixe actuels utilisés par Workbox.

cacheNames.precache est utilisé pour les éléments en pré-cache, cacheNames.googleAnalytics est utilisé par workbox-google-analytics pour stocker analytics.js et cacheNames.runtime est utilisé pour tout le reste.

cacheNames.prefix permet de ne récupérer que la valeur de préfixe actuelle. cacheNames.suffix permet de ne récupérer que la valeur actuelle du suffixe.

Type

objet

Propriétés

  • googleAnalytics

    chaîne

  • pré-cache

    chaîne

  • préfixe

    chaîne

  • runtime

    chaîne

  • Suffixe

    chaîne

Méthodes

clientsClaim()

workbox-core.clientsClaim()

Une fois que le service worker est devenu actif, revendiquez tous les clients disponibles. Il est normalement utilisé conjointement avec skipWaiting().

copyResponse()

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

Permet aux développeurs de copier une réponse et de modifier ses valeurs headers, status ou statusText (valeurs pouvant être définies via un objet [ResponseInit]https://developer.mozilla.org/en-US/docs/Web/API/Response/Response#Syntax dans le constructeur). Pour modifier ces valeurs, transmettez une fonction en tant que deuxième argument. Cette fonction sera appelée avec un seul objet avec les propriétés de réponse {headers, status, statusText}. La valeur renvoyée par cette fonction sera utilisée comme ResponseInit pour le nouveau Response. Pour modifier les valeurs, modifiez les paramètres transmis et renvoyez-les, ou renvoyez un tout nouvel objet.

Cette méthode est intentionnellement limitée aux réponses de même origine, que CORS ait été utilisé ou non.

Paramètres

  • réponse

    Réponse

  • modificateur

    fonction facultative

    Le paramètre modifier se présente comme suit : 

    (responseInit: ResponseInit) => ResponseInit

    • responseInit

      ResponseInit

    • retours

      ResponseInit

Renvoie

  • Promesse<Réponse>

registerQuotaErrorCallback()

workbox-core.registerQuotaErrorCallback(
  callback: Function,
)

Ajoute une fonction à l'ensemble de quotasErrorCallbacks, qui sera exécutée en cas d'erreur de quota.

Paramètres

  • rappel

    Fonction

setCacheNameDetails()

workbox-core.setCacheNameDetails(
  details: PartialCacheNameDetails,
)

Modifie les noms de cache par défaut utilisés par les packages Workbox. Les noms de cache sont générés en tant que <prefix>-<Cache Name>-<suffix>.

Paramètres

  • détails

    PartialCacheNameDetails

skipWaiting()

workbox-core.skipWaiting()

Cette méthode est obsolète et sera supprimée dans Workbox v7.

L'appel de self.skipWaiting() est équivalent et doit être utilisé à la place.