core box di lavoro

Workbox è stato progettato per essere modulare, consentendo agli sviluppatori di selezionare i componenti che vogliono utilizzare senza dover scaricare tutto in un unico file.

Tuttavia, esiste una sovrapposizione tra i moduli, ad esempio ogni modulo dovrà interagire con la console, generare errori significativi e utilizzare la rete o la cache. Per evitare che ogni modulo implementi la stessa logica, workbox-core contiene questo codice comune su cui si basa ogni modulo.

Questo modulo fornisce alcune funzionalità agli sviluppatori, ma oltre ai livelli di log e alla memorizzazione nella cache, workbox-core offre la logica interna a ogni modulo, piuttosto che allo sviluppatore finale.

Visualizzare e modificare i nomi della cache predefiniti

Workbox definisce le proprie cache tramite cacheNames:

import {cacheNames} from 'workbox-core';

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

Questi nomi della cache sono costituiti da un prefisso, un nome e un suffisso, dove il nome cambia in base all'utilizzo della cache.

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

Puoi modificare questi nomi predefiniti modificando tutti o alcuni dei valori passati a 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);

Il caso d'uso principale per il prefisso e il suffisso è che se utilizzi Workbox per più progetti e la stessa porta localhost per ogni progetto, l'impostazione di un prefisso personalizzato per ogni modulo impedirà alle cache di entrare in conflitto tra loro.

Dichiarazione dei clienti

Alcuni sviluppatori vogliono poter pubblicare un nuovo worker di servizio e controllarne subito il funzionamento non appena viene attivato, cosa che non accade per impostazione predefinita.

Se vuoi questo comportamento, workbox-core fornisce un metodo di assistenza:

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

Il metodo clientsClaim() in workbox-core aggiunge automaticamente un activate listener di eventi al tuo service worker e al suo interno chiama self.clients.claim(). La chiamata a self.clients.claim() prima dell'attivazione dell'attuale worker del servizio comporterà un'eccezione di runtime e il wrapper di workbox-core ti aiuta ad assicurarti di chiamarlo al momento giusto.

L'wrapper skipWaiting è deprecato

Prima della versione 6 di Workbox, gli sviluppatori erano anche incoraggiati a utilizzare il metodo skipWaiting() di workbox-core. Tuttavia, questo metodo offriva poco valore oltre a quanto ottenuto dagli sviluppatori se avessero chiamato self.skipWaiting() esplicitamente.

Poiché il wrapper workbox-core precedente registrava anche un gestore di eventi install in cui veniva chiamato self.skipWaiting(), il wrapper non si comportava come previsto se veniva chiamato all'interno di un altro gestore di eventi, come message, dopo che l'installazione era già stata completata.

Per questi motivi, skipWaiting() di workbox-core è deprecato e gli sviluppatori devono passare a chiamare direttamente self.skipWaiting(). A differenza di self.clients.claim(), self.skipWaiting() non genera un'eccezione se viene chiamato al momento "sbagliato", quindi non è necessario racchiuderlo in un gestore eventi.

Tipi

CacheDidUpdateCallback()

workbox-core.CacheDidUpdateCallback(
  param: CacheDidUpdateCallbackParam,
)

Parametri

Resi

  • Promise<void>

CacheDidUpdateCallbackParam

Proprietà

  • cacheName

    stringa

  • evento

    ExtendableEvent

  • newResponse

    Risposta

  • oldResponse

    Risposta facoltativa

  • richiesta

    Richiesta

  • stato

    MapLikeObject facoltativo

CachedResponseWillBeUsedCallback()

workbox-core.CachedResponseWillBeUsedCallback(
  param: CachedResponseWillBeUsedCallbackParam,
)

Parametri

Resi

  • Promise<void | Response>

CachedResponseWillBeUsedCallbackParam

Proprietà

  • cacheName

    stringa

  • cachedResponse

    Risposta facoltativa

  • evento

    ExtendableEvent

  • matchOptions

    CacheQueryOptions facoltativo

  • richiesta

    Richiesta

  • stato

    MapLikeObject facoltativo

CacheKeyWillBeUsedCallback()

workbox-core.CacheKeyWillBeUsedCallback(
  param: CacheKeyWillBeUsedCallbackParam,
)

Parametri

Resi

  • Promise<string | Request>

CacheKeyWillBeUsedCallbackParam

Proprietà

  • evento

    ExtendableEvent

  • modalità

    stringa

  • params

    qualsiasi facoltativo

  • richiesta

    Richiesta

  • stato

    MapLikeObject facoltativo

CacheWillUpdateCallback()

workbox-core.CacheWillUpdateCallback(
  param: CacheWillUpdateCallbackParam,
)

Parametri

Resi

  • Promise<void | Response>

CacheWillUpdateCallbackParam

Proprietà

  • evento

    ExtendableEvent

  • richiesta

    Richiesta

  • risposta

    Risposta

  • stato

    MapLikeObject facoltativo

FetchDidFailCallback()

workbox-core.FetchDidFailCallback(
  param: FetchDidFailCallbackParam,
)

Parametri

Resi

  • Promise<void>

FetchDidFailCallbackParam

Proprietà

  • errore

    Errore

  • evento

    ExtendableEvent

  • originalRequest

    Richiesta

  • richiesta

    Richiesta

  • stato

    MapLikeObject facoltativo

FetchDidSucceedCallback()

workbox-core.FetchDidSucceedCallback(
  param: FetchDidSucceedCallbackParam,
)

Parametri

Resi

  • Promise<Response>

FetchDidSucceedCallbackParam

Proprietà

  • evento

    ExtendableEvent

  • richiesta

    Richiesta

  • risposta

    Risposta

  • stato

    MapLikeObject facoltativo

HandlerCallbackOptions

Enum

RouteHandlerCallbackOptions

ManualHandlerCallbackOptions

HandlerDidCompleteCallback()

workbox-core.HandlerDidCompleteCallback(
  param: HandlerDidCompleteCallbackParam,
)

Parametri

Resi

  • Promise<void>

HandlerDidCompleteCallbackParam

Proprietà

  • errore

    Errore facoltativo

  • evento

    ExtendableEvent

  • richiesta

    Richiesta

  • risposta

    Risposta facoltativa

  • stato

    MapLikeObject facoltativo

HandlerDidErrorCallback()

workbox-core.HandlerDidErrorCallback(
  param: HandlerDidErrorCallbackParam,
)

Parametri

Resi

  • Promise<Response>

HandlerDidErrorCallbackParam

Proprietà

  • errore

    Errore

  • evento

    ExtendableEvent

  • richiesta

    Richiesta

  • stato

    MapLikeObject facoltativo

HandlerDidRespondCallback()

workbox-core.HandlerDidRespondCallback(
  param: HandlerDidRespondCallbackParam,
)

Parametri

Resi

  • Promise<void>

HandlerDidRespondCallbackParam

Proprietà

  • evento

    ExtendableEvent

  • richiesta

    Richiesta

  • risposta

    Risposta facoltativa

  • stato

    MapLikeObject facoltativo

HandlerWillRespondCallback()

workbox-core.HandlerWillRespondCallback(
  param: HandlerWillRespondCallbackParam,
)

Parametri

Resi

  • Promise<Response>

HandlerWillRespondCallbackParam

Proprietà

  • evento

    ExtendableEvent

  • richiesta

    Richiesta

  • risposta

    Risposta

  • stato

    MapLikeObject facoltativo

HandlerWillStartCallback()

workbox-core.HandlerWillStartCallback(
  param: HandlerWillStartCallbackParam,
)

Parametri

Resi

  • Promise<void>

HandlerWillStartCallbackParam

Proprietà

  • evento

    ExtendableEvent

  • richiesta

    Richiesta

  • stato

    MapLikeObject facoltativo

ManualHandlerCallback()

workbox-core.ManualHandlerCallback(
  options: ManualHandlerCallbackOptions,
)

Il callback "handler" viene invocato ogni volta che un Router corrisponde a un URL/una richiesta a un Route tramite il relativo RouteMatchCallback. Questo callback del gestore deve restituire un Promise che si risolve con un Response.

Se RouteMatchCallback restituisce un array o un oggetto non vuoto, questo verrà passato come argomento options.params di questo gestore.

Parametri

Resi

  • Promise<Response>

ManualHandlerCallbackOptions

Opzioni passate a una funzione ManualHandlerCallback.

Proprietà

  • evento

    ExtendableEvent

  • richiesta

    stringa | Richiesta

MapLikeObject

PluginState

Per il momento viene utilizzato un semplice MapLikeObject, ma in futuro potremmo estendere/limitare questa opzione.

Tipo

MapLikeObject

RequestWillFetchCallback()

workbox-core.RequestWillFetchCallback(
  param: RequestWillFetchCallbackParam,
)

Parametri

Resi

  • Promise<Request>

RequestWillFetchCallbackParam

Proprietà

  • evento

    ExtendableEvent

  • richiesta

    Richiesta

  • stato

    MapLikeObject facoltativo

RouteHandler

RouteHandlerCallback o RouteHandlerObject. La maggior parte delle API in workbox-routing che accettano gestori di route accettano entrambi.

Enum

RouteHandlerCallback

RouteHandlerObject

RouteHandlerCallback()

workbox-core.RouteHandlerCallback(
  options: RouteHandlerCallbackOptions,
)

Il callback "handler" viene invocato ogni volta che un Router corrisponde a un URL/una richiesta a un Route tramite il relativo RouteMatchCallback. Questo callback del gestore deve restituire un Promise che si risolve con un Response.

Se RouteMatchCallback restituisce un array o un oggetto non vuoto, questo verrà passato come argomento options.params di questo gestore.

Parametri

Resi

  • Promise<Response>

RouteHandlerCallbackOptions

Opzioni passate a una funzione RouteHandlerCallback.

Proprietà

  • evento

    ExtendableEvent

  • params

    string[] | MapLikeObject facoltativo

  • richiesta

    Richiesta

  • url

    URL

RouteHandlerObject

Un oggetto con un metodo handle di tipo RouteHandlerCallback.

Un oggetto Route può essere creato con una funzione RouteHandlerCallback o con questo oggetto RouteHandler. Il vantaggio di RouteHandler è che può essere esteso (come avviene con il pacchetto workbox-strategies).

Proprietà

RouteMatchCallback()

workbox-core.RouteMatchCallback(
  options: RouteMatchCallbackOptions,
)

Il callback "match" viene utilizzato per determinare se un Route deve essere applicato per un determinato URL e richiesta. Quando la corrispondenza si verifica in risposta a un evento di recupero dal client, viene fornito anche l'oggetto event. Tuttavia, poiché il callback di corrispondenza può essere invocato al di fuori di un evento di recupero, la logica di corrispondenza non deve presupporre che l'oggetto event sarà sempre disponibile. Se il callback di corrispondenza restituisce un valore vero, il valore corrispondenteRouteHandlerCallback della route verrà invocato immediatamente. Se il valore restituito è un array o un oggetto non vuoto, verrà impostato sull'argomento options.params dell'handler.

Parametri

Resi

  • qualsiasi

RouteMatchCallbackOptions

Opzioni passate a una funzione RouteMatchCallback.

Proprietà

  • evento

    ExtendableEvent

  • richiesta

    Richiesta

  • sameOrigin

    booleano

  • url

    URL

WorkboxPlugin

Un oggetto con proprietà di callback del ciclo di vita facoltative per le operazioni di recupero e memorizzazione nella cache.

Proprietà

WorkboxPluginCallbackParam

Proprietà

Proprietà

cacheNames

Recupera i nomi e il prefisso/suffisso della cache corrente utilizzati da Workbox.

cacheNames.precache viene utilizzato per gli asset pre-memorizzati nella cache, cacheNames.googleAnalytics viene utilizzato da workbox-google-analytics per memorizzare analytics.js e cacheNames.runtime viene utilizzato per tutto il resto.

cacheNames.prefix può essere utilizzato per recuperare solo il valore del prefisso corrente. cacheNames.suffix può essere utilizzato per recuperare solo il valore del suffisso corrente.

Tipo

oggetto

Proprietà

  • googleAnalytics

    stringa

  • precache

    stringa

  • prefisso

    stringa

  • runtime

    stringa

  • suffisso

    stringa

Metodi

clientsClaim()

workbox-core.clientsClaim()

Rivendica tutti i clienti attualmente disponibili una volta che il servizio worker diventa attivo. Questo attributo viene normalmente utilizzato in combinazione con skipWaiting().

copyResponse()

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

Consente agli sviluppatori di copiare una risposta e modificarne i valori headers, status o statusText (i valori impostabili tramite un oggetto [ResponseInit]https://developer.mozilla.org/en-US/docs/Web/API/Response/Response#Syntax nel costruttore). Per modificare questi valori, passa una funzione come secondo argomento. Questa funzione verrà richiamata con un singolo oggetto con le proprietà di risposta{headers, status, statusText}. Il valore restituito da questa funzione verrà utilizzato come ResponseInit per il nuovo Response. Per modificare i valori, modifica i parametri passati e restituiscili oppure restituisci un oggetto completamente nuovo.

Questo metodo è intenzionalmente limitato alle risposte dello stesso dominio, indipendentemente dall'utilizzo o meno di CORS.

Parametri

  • risposta

    Risposta

  • modificatore

    function facoltativa

    Il parametro modifier ha il seguente aspetto: 

    (responseInit: ResponseInit) => ResponseInit

    • responseInit

      ResponseInit

    • returns

      ResponseInit

Resi

  • Promise<Response>

registerQuotaErrorCallback()

workbox-core.registerQuotaErrorCallback(
  callback: Function,
)

Aggiunge una funzione all'insieme di quotaErrorCallbacks che verrà eseguita se si verifica un errore di quota.

Parametri

  • callback

    Funzione

setCacheNameDetails()

workbox-core.setCacheNameDetails(
  details: PartialCacheNameDetails,
)

Modifica i nomi delle cache predefinite utilizzati dai pacchetti Workbox. I nomi della cache vengono generati come <prefix>-<Cache Name>-<suffix>.

Parametri

  • dettagli

    PartialCacheNameDetails

skipWaiting()

workbox-core.skipWaiting()

Questo metodo è deprecato e verrà rimosso nella versione 7 di Workbox.

La chiamata a self.skipWaiting() è equivalente e deve essere utilizzata al suo posto.