Workbox is modulair gebouwd, waardoor ontwikkelaars de stukken kunnen selecteren die ze willen gebruiken zonder ze te dwingen alles in één bestand te downloaden.
Er is echter overlap tussen de modules. Elke module wil bijvoorbeeld graag communiceren met de console, betekenisvolle fouten genereren en gebruik maken van het netwerk of de cache. Om te voorkomen dat elke module dezelfde logica implementeert, bevat workbox-core
deze gemeenschappelijke code waar elke module op vertrouwt.
Deze module biedt ontwikkelaars enige functionaliteit, maar naast logniveaus en caching biedt workbox-core
interne logica voor elke module, in plaats van voor de eindontwikkelaar.
Bekijk en wijzig de standaard cachenamen
Workbox definieert zijn caches via cacheNames
:
import {cacheNames} from 'workbox-core';
console.log(cacheNames.precache);
console.log(cacheNames.runtime);
console.log(cacheNames.googleAnalytics);
Deze cachenamen zijn opgebouwd in de vorm van een voorvoegsel, een naam en een achtervoegsel, waarbij de naam verandert op basis van het gebruik van de cache.
<prefix>-<cache-id>-<suffix>
U kunt deze standaardnamen wijzigen door alle of sommige waarden te wijzigen die worden doorgegeven aan 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);
Het belangrijkste gebruiksscenario voor het voor- en achtervoegsel is dat als u Workbox voor meerdere projecten gebruikt en voor elk project dezelfde localhost-poort gebruikt, het instellen van een aangepast voorvoegsel voor elke module voorkomt dat de caches met elkaar in conflict komen.
Klanten beweren
Sommige ontwikkelaars willen een nieuwe servicemedewerker kunnen publiceren en deze reeds geopende webpagina's laten beheren zodra deze wordt geactiveerd, wat standaard niet zal gebeuren.
Als je merkt dat je dit gedrag wilt, biedt workbox-core
een hulpmethode:
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();
De methode clientsClaim()
in workbox-core
voegt automatisch een activate
gebeurtenislistener toe aan uw servicemedewerker, en roept daarbinnen self.clients.claim()
aan. Het aanroepen van self.clients.claim()
voordat de huidige servicemedewerker wordt geactiveerd, zal leiden tot een runtime-uitzondering , en de wrapper van workbox-core
zorgt ervoor dat u deze op het juiste moment aanroept.
De skipWaiting-wrapper is verouderd
Vóór Workbox v6 werden ontwikkelaars ook aangemoedigd om de skipWaiting()
-methode van workbox-core
te gebruiken. Deze methode bood echter weinig meer waarde dan wat ontwikkelaars zouden krijgen als ze self.skipWaiting()
expliciet zouden aanroepen.
Omdat de oudere workbox-core
wrapper ook een install
registreerde waarin self.skipWaiting()
werd aangeroepen, gedroeg de wrapper zich niet zoals verwacht als deze binnen een andere gebeurtenishandler werd aangeroepen, zoals message
, nadat de installatie al was voltooid.
Om deze redenen is skipWaiting()
van workbox-core
verouderd en moeten ontwikkelaars overstappen op het rechtstreeks aanroepen van self.skipWaiting()
. In tegenstelling tot self.clients.claim()
zal self.skipWaiting()
geen uitzondering genereren als deze op het "verkeerde" tijdstip wordt aangeroepen, dus het is niet nodig om deze in een gebeurtenishandler te verpakken.
Soorten
CacheDidUpdateCallback()
workbox-core.CacheDidUpdateCallback(
param: CacheDidUpdateCallbackParam,
)
Parameters
Geeft terug
Beloof <nietig>
CacheDidUpdateCallbackParam
Eigenschappen
- cacheNaam
snaar
- evenement
UitbreidbaarEvent
- nieuwantwoord
Antwoord
- oude reactie
Reactie optioneel
- verzoek
Verzoek
- staat
MapLikeObject optioneel
CachedResponseWillBeUsedCallback()
workbox-core.CachedResponseWillBeUsedCallback(
param: CachedResponseWillBeUsedCallbackParam,
)
Parameters
Geeft terug
Beloof <nietig | Reactie>
CachedResponseWillBeUsedCallbackParam
Eigenschappen
- cacheNaam
snaar
- in cache opgeslagen antwoord
Reactie optioneel
- evenement
UitbreidbaarEvent
- matchOptions
CacheQueryOptions optioneel
- verzoek
Verzoek
- staat
MapLikeObject optioneel
CacheKeyWillBeUsedCallback()
workbox-core.CacheKeyWillBeUsedCallback(
param: CacheKeyWillBeUsedCallbackParam,
)
Parameters
Geeft terug
Belofte<tekenreeks | Verzoek>
CacheKeyWillBeUsedCallbackParam
Eigenschappen
- evenement
UitbreidbaarEvent
- modus
snaar
- parameters
eventueel optioneel
- verzoek
Verzoek
- staat
MapLikeObject optioneel
CacheWillUpdateCallback()
workbox-core.CacheWillUpdateCallback(
param: CacheWillUpdateCallbackParam,
)
Parameters
Geeft terug
Beloof <nietig | Reactie>
CacheWillUpdateCallbackParam
Eigenschappen
- evenement
UitbreidbaarEvent
- verzoek
Verzoek
- antwoord
Antwoord
- staat
MapLikeObject optioneel
FetchDidFailCallback()
workbox-core.FetchDidFailCallback(
param: FetchDidFailCallbackParam,
)
Parameters
Geeft terug
Beloof <nietig>
FetchDidFailCallbackParam
Eigenschappen
- fout
Fout
- evenement
UitbreidbaarEvent
- origineelVerzoek
Verzoek
- verzoek
Verzoek
- staat
MapLikeObject optioneel
FetchDidSucceedCallback()
workbox-core.FetchDidSucceedCallback(
param: FetchDidSucceedCallbackParam,
)
Parameters
Geeft terug
Beloof<Reactie>
FetchDidSucceedCallbackParam
Eigenschappen
- evenement
UitbreidbaarEvent
- verzoek
Verzoek
- antwoord
Antwoord
- staat
MapLikeObject optioneel
HandlerCallbackOptions
HandlerDidCompleteCallback()
workbox-core.HandlerDidCompleteCallback(
param: HandlerDidCompleteCallbackParam,
)
Parameters
Geeft terug
Beloof <nietig>
HandlerDidCompleteCallbackParam
Eigenschappen
- fout
Fout optioneel
- evenement
UitbreidbaarEvent
- verzoek
Verzoek
- antwoord
Reactie optioneel
- staat
MapLikeObject optioneel
HandlerDidErrorCallback()
workbox-core.HandlerDidErrorCallback(
param: HandlerDidErrorCallbackParam,
)
Parameters
Geeft terug
Beloof<Reactie>
HandlerDidErrorCallbackParam
Eigenschappen
- fout
Fout
- evenement
UitbreidbaarEvent
- verzoek
Verzoek
- staat
MapLikeObject optioneel
HandlerDidRespondCallback()
workbox-core.HandlerDidRespondCallback(
param: HandlerDidRespondCallbackParam,
)
Parameters
Geeft terug
Beloof <nietig>
HandlerDidRespondCallbackParam
Eigenschappen
- evenement
UitbreidbaarEvent
- verzoek
Verzoek
- antwoord
Reactie optioneel
- staat
MapLikeObject optioneel
HandlerWillRespondCallback()
workbox-core.HandlerWillRespondCallback(
param: HandlerWillRespondCallbackParam,
)
Parameters
Geeft terug
Beloof<Reactie>
HandlerWillRespondCallbackParam
Eigenschappen
- evenement
UitbreidbaarEvent
- verzoek
Verzoek
- antwoord
Antwoord
- staat
MapLikeObject optioneel
HandlerWillStartCallback()
workbox-core.HandlerWillStartCallback(
param: HandlerWillStartCallbackParam,
)
Parameters
Geeft terug
Beloof <nietig>
HandlerWillStartCallbackParam
Eigenschappen
- evenement
UitbreidbaarEvent
- verzoek
Verzoek
- staat
MapLikeObject optioneel
ManualHandlerCallback()
workbox-core.ManualHandlerCallback(
options: ManualHandlerCallbackOptions,
)
De "handler" callback wordt aangeroepen wanneer een Router
een URL/verzoek matcht met een Route
via zijn RouteMatchCallback
. Deze handler-callback zou een Promise
moeten retourneren die wordt opgelost met een Response
.
Als een niet-lege array of object wordt geretourneerd door RouteMatchCallback
wordt dit doorgegeven als het options.params
-argument van deze handler.
Parameters
- opties
Geeft terug
Beloof<Reactie>
ManualHandlerCallbackOptions
Opties doorgegeven aan een ManualHandlerCallback
-functie.
Eigenschappen
- evenement
UitbreidbaarEvent
- verzoek
tekenreeks | Verzoek
MapLikeObject
PluginState
Ik gebruik voorlopig een gewoon MapLikeObject
, maar zou dit in de toekomst kunnen uitbreiden/beperken.
Type
RequestWillFetchCallback()
workbox-core.RequestWillFetchCallback(
param: RequestWillFetchCallbackParam,
)
Parameters
Geeft terug
Beloof<Verzoek>
RequestWillFetchCallbackParam
Eigenschappen
- evenement
UitbreidbaarEvent
- verzoek
Verzoek
- staat
MapLikeObject optioneel
RouteHandler
Een RouteHandlerCallback
of een RouteHandlerObject
. De meeste API's in workbox-routing
die route-handlers accepteren, gebruiken beide.
RouteHandlerCallback()
workbox-core.RouteHandlerCallback(
options: RouteHandlerCallbackOptions,
)
De "handler" callback wordt aangeroepen wanneer een Router
een URL/verzoek matcht met een Route
via zijn RouteMatchCallback
. Deze handler-callback zou een Promise
moeten retourneren die wordt opgelost met een Response
.
Als een niet-lege array of object wordt geretourneerd door RouteMatchCallback
wordt dit doorgegeven als het options.params
-argument van deze handler.
Parameters
- opties
Geeft terug
Beloof<Reactie>
RouteHandlerCallbackOptions
Opties doorgegeven aan een RouteHandlerCallback
-functie.
Eigenschappen
- evenement
UitbreidbaarEvent
- parameters
tekenreeks[] | MapLikeObject optioneel
- verzoek
Verzoek
- URL
URL
RouteHandlerObject
Een object met een handle
methode van het type RouteHandlerCallback
.
Een Route
object kan worden gemaakt met een RouteHandlerCallback
functie of dit RouteHandler
object. Het voordeel van de RouteHandler
is dat deze kan worden uitgebreid (zoals wordt gedaan door het workbox-strategies
pakket).
Eigenschappen
- hendel
RouteMatchCallback()
workbox-core.RouteMatchCallback(
options: RouteMatchCallbackOptions,
)
De "match"-callback wordt gebruikt om te bepalen of een Route
van toepassing moet zijn op een bepaalde URL en aanvraag. Wanneer matching plaatsvindt als reactie op een ophaalgebeurtenis van de client, wordt het event
ook geleverd. Omdat de match-callback echter buiten een ophaalgebeurtenis kan worden aangeroepen, mag de matchinglogica er niet van uitgaan dat het event
altijd beschikbaar zal zijn. Als de match-callback een waarheidsgetrouwe waarde retourneert, wordt de RouteHandlerCallback
van de overeenkomende route onmiddellijk aangeroepen. Als de geretourneerde waarde een niet-lege array of object is, wordt die waarde ingesteld op het argument options.params
van de handler.
Parameters
- opties
Geeft terug
elk
RouteMatchCallbackOptions
Opties doorgegeven aan een RouteMatchCallback
-functie.
Eigenschappen
- evenement
UitbreidbaarEvent
- verzoek
Verzoek
- zelfdeoorsprong
Booleaans
- URL
URL
WorkboxPlugin
Een object met optionele levenscyclus-callback-eigenschappen voor de ophaal- en cachebewerkingen.
Eigenschappen
- cacheDidUpdate
CacheDidUpdateCallback optioneel
- cacheKeyWillBeUsed
CacheKeyWillBeUsedCallback optioneel
- cacheWillUpdate
CacheWillUpdateCallback optioneel
- cachedResponseWillBeUsed
CachedResponseWillBeUsedCallback optioneel
- fetchDidFail
FetchDidFailCallback optioneel
- fetchDidSucceed
FetchDidSucceedCallback optioneel
- handlerDidCompleet
HandlerDidCompleteCallback optioneel
- handlerDidError
HandlerDidErrorCallback optioneel
- handlerDidRespond
HandlerDidRespondCallback optioneel
- handlerWillRespond
HandlerWillRespondCallback optioneel
- handlerWillStart
HandlerWillStartCallback optioneel
- verzoekWillFetch
RequestWillFetchCallback optioneel
WorkboxPluginCallbackParam
Eigenschappen
- cacheDidUpdate
- cacheKeyWillBeUsed
- cacheWillUpdate
- cachedResponseWillBeUsed
- fetchDidFail
- fetchDidSucceed
- handlerDidComplete
- handlerDidError
- handlerDidRespond
- handlerWillRespond
- handlerWillStart
- verzoekWillFetch
Eigenschappen
cacheNames
Haal de huidige cachenamen en voor-/achtervoegsel op die door Workbox worden gebruikt.
cacheNames.precache
wordt gebruikt voor vooraf in de cache opgeslagen assets, cacheNames.googleAnalytics
wordt gebruikt door workbox-google-analytics
om analytics.js
op te slaan, en cacheNames.runtime
wordt voor al het andere gebruikt.
cacheNames.prefix
kan worden gebruikt om alleen de huidige voorvoegselwaarde op te halen. cacheNames.suffix
kan worden gebruikt om alleen de huidige achtervoegselwaarde op te halen.
Type
voorwerp
Eigenschappen
- GoogleAnalytics
snaar
- vooraf cachen
snaar
- voorvoegsel
snaar
- looptijd
snaar
- achtervoegsel
snaar
Methoden
clientsClaim()
workbox-core.clientsClaim()
Claim alle momenteel beschikbare klanten zodra de servicemedewerker actief wordt. Dit wordt normaal gesproken gebruikt in combinatie met skipWaiting()
.
copyResponse()
workbox-core.copyResponse(
response: Response,
modifier?: function,
)
Hiermee kunnen ontwikkelaars een antwoord kopiëren en de headers
, status
of statusText
waarden wijzigen (de waarden kunnen worden ingesteld via een [ ResponseInit
] https://developer.mozilla.org/en-US/docs/Web/API/Response/Response#Syntax
object in de constructor). Om deze waarden te wijzigen, geeft u een functie door als tweede argument. Die functie wordt aangeroepen met een enkel object met de antwoordeigenschappen {headers, status, statusText}
. De retourwaarde van deze functie wordt gebruikt als ResponseInit
voor de nieuwe Response
. Om de waarden te wijzigen, wijzigt u de doorgegeven parameter(s) en retourneert u deze, of retourneert u een geheel nieuw object.
Deze methode is opzettelijk beperkt tot reacties van dezelfde oorsprong, ongeacht of CORS is gebruikt of niet.
Parameters
- antwoord
Antwoord
- modificator
functie optioneel
De
modifier
parameter ziet er als volgt uit:(responseInit: ResponseInit) => ResponseInit
- reactieInit
ReactieInit
- geeft terug
ReactieInit
Geeft terug
Beloof<Reactie>
registerQuotaErrorCallback()
workbox-core.registerQuotaErrorCallback(
callback: Function,
)
Voegt een functie toe aan de set quotaErrorCallbacks die wordt uitgevoerd als er een quotafout optreedt.
Parameters
- Bel terug
Functie
setCacheNameDetails()
workbox-core.setCacheNameDetails(
details: PartialCacheNameDetails,
)
Wijzigt de standaard cachenamen die door de Workbox-pakketten worden gebruikt. Cachenamen worden gegenereerd als <prefix>-<Cache Name>-<suffix>
.
Parameters
- details
GedeeltelijkeCacheNameDetails
skipWaiting()
workbox-core.skipWaiting()
Deze methode is verouderd en wordt verwijderd in Workbox v7.
Het aanroepen van self.skipWaiting() is gelijkwaardig en moet in plaats daarvan worden gebruikt.