Workbox telah dibuat agar bersifat modular, sehingga developer dapat memilih bagian yang ingin digunakan tanpa memaksa mereka untuk mendownload semuanya dalam satu file.
Namun, ada tumpang-tindih antar-modul, misalnya, setiap modul akan
perlu berinteraksi dengan konsol, menampilkan error yang bermakna, dan menggunakan
jaringan atau cache. Agar setiap modul tidak menerapkan logika yang sama,
workbox-core
berisi kode umum yang menjadi andalan setiap modul.
Modul ini memang menyediakan beberapa fungsi bagi developer, tetapi di luar level log
dan penyimpanan dalam cache, workbox-core
menawarkan logika internal ke setiap modul,
bukan developer akhir.
Melihat dan Mengubah Nama Cache Default
Workbox menentukan cache-nya melalui cacheNames
:
import {cacheNames} from 'workbox-core';
console.log(cacheNames.precache);
console.log(cacheNames.runtime);
console.log(cacheNames.googleAnalytics);
Nama cache ini dibuat dalam format awalan, nama, dan akhiran, dengan nama yang berubah berdasarkan penggunaan cache.
<prefix>-<cache-id>-<suffix>
Anda dapat mengubah nama default ini dengan mengubah semua atau beberapa nilai
yang diteruskan ke 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);
Kasus penggunaan utama untuk awalan dan akhiran adalah jika Anda menggunakan Workbox untuk beberapa project dan menggunakan port localhost yang sama untuk setiap project, menetapkan awalan kustom untuk setiap modul akan mencegah cache saling bertentangan.
Klaim Klien
Beberapa developer ingin dapat memublikasikan pekerja layanan baru dan membuatnya mengontrol halaman web yang sudah terbuka segera setelah diaktifkan, yang tidak akan terjadi secara default.
Jika Anda menginginkan perilaku ini, workbox-core
menyediakan metode helper:
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();
Metode clientsClaim()
di workbox-core
otomatis menambahkan pemroses peristiwa activate
ke pekerja layanan Anda, dan di dalamnya, memanggil
self.clients.claim()
. Memanggil self.clients.claim()
sebelum pekerja layanan
saat ini diaktifkan akan menyebabkan
pengecualian runtime,
dan wrapper workbox-core
membantu memastikan bahwa Anda memanggilnya pada waktu yang tepat.
Wrapper skipWaiting tidak digunakan lagi
Sebelum Workbox v6, developer juga didorong untuk menggunakan metode skipWaiting()
dari workbox-core
. Namun, metode ini menawarkan sedikit nilai di luar yang
akan diperoleh developer jika mereka memanggil self.skipWaiting()
secara eksplisit.
Karena wrapper workbox-core
lama juga mendaftarkan pengendali peristiwa install
tempat self.skipWaiting()
dipanggil, wrapper tidak akan berperilaku seperti yang diharapkan
jika dipanggil di dalam pengendali peristiwa lain, seperti message
, setelah penginstalan
selesai.
Karena alasan ini, skipWaiting()
workbox-core
tidak digunakan lagi, dan developer
harus beralih untuk memanggil self.skipWaiting()
secara langsung. Tidak seperti
self.clients.claim()
, self.skipWaiting()
tidak akan menampilkan pengecualian jika dipanggil
pada waktu yang "salah", sehingga tidak perlu menggabungkannya dalam pengendali peristiwa.
Jenis
CacheDidUpdateCallback()
workbox-core.CacheDidUpdateCallback(
param: CacheDidUpdateCallbackParam,
)
Parameter
Hasil
-
Promise<void>
CacheDidUpdateCallbackParam
Properti
-
cacheName
string
-
peristiwa
ExtendableEvent
-
newResponse
Respons
-
oldResponse
Respons opsional
-
minta
Permintaan
-
dengan status tersembunyi akhir
MapLikeObject opsional
CachedResponseWillBeUsedCallback()
workbox-core.CachedResponseWillBeUsedCallback(
param: CachedResponseWillBeUsedCallbackParam,
)
Parameter
Hasil
-
Promise<void | Response>
CachedResponseWillBeUsedCallbackParam
Properti
-
cacheName
string
-
cachedResponse
Respons opsional
-
peristiwa
ExtendableEvent
-
matchOptions
CacheQueryOptions opsional
-
minta
Permintaan
-
dengan status tersembunyi akhir
MapLikeObject opsional
CacheKeyWillBeUsedCallback()
workbox-core.CacheKeyWillBeUsedCallback(
param: CacheKeyWillBeUsedCallbackParam,
)
Parameter
Hasil
-
Promise<string | Request>
CacheKeyWillBeUsedCallbackParam
Properti
-
peristiwa
ExtendableEvent
-
mode
string
-
params
apa pun opsional
-
minta
Permintaan
-
dengan status tersembunyi akhir
MapLikeObject opsional
CacheWillUpdateCallback()
workbox-core.CacheWillUpdateCallback(
param: CacheWillUpdateCallbackParam,
)
Parameter
Hasil
-
Promise<void | Response>
CacheWillUpdateCallbackParam
Properti
-
peristiwa
ExtendableEvent
-
minta
Permintaan
-
respons
Respons
-
dengan status tersembunyi akhir
MapLikeObject opsional
FetchDidFailCallback()
workbox-core.FetchDidFailCallback(
param: FetchDidFailCallbackParam,
)
Parameter
Hasil
-
Promise<void>
FetchDidFailCallbackParam
Properti
-
error
Error
-
peristiwa
ExtendableEvent
-
originalRequest
Permintaan
-
minta
Permintaan
-
dengan status tersembunyi akhir
MapLikeObject opsional
FetchDidSucceedCallback()
workbox-core.FetchDidSucceedCallback(
param: FetchDidSucceedCallbackParam,
)
Parameter
Hasil
-
Promise<Response>
FetchDidSucceedCallbackParam
Properti
-
peristiwa
ExtendableEvent
-
minta
Permintaan
-
respons
Respons
-
dengan status tersembunyi akhir
MapLikeObject opsional
HandlerCallbackOptions
HandlerDidCompleteCallback()
workbox-core.HandlerDidCompleteCallback(
param: HandlerDidCompleteCallbackParam,
)
Parameter
Hasil
-
Promise<void>
HandlerDidCompleteCallbackParam
Properti
-
error
Error opsional
-
peristiwa
ExtendableEvent
-
minta
Permintaan
-
respons
Respons opsional
-
dengan status tersembunyi akhir
MapLikeObject opsional
HandlerDidErrorCallback()
workbox-core.HandlerDidErrorCallback(
param: HandlerDidErrorCallbackParam,
)
Parameter
Hasil
-
Promise<Response>
HandlerDidErrorCallbackParam
Properti
-
error
Error
-
peristiwa
ExtendableEvent
-
minta
Permintaan
-
dengan status tersembunyi akhir
MapLikeObject opsional
HandlerDidRespondCallback()
workbox-core.HandlerDidRespondCallback(
param: HandlerDidRespondCallbackParam,
)
Parameter
Hasil
-
Promise<void>
HandlerDidRespondCallbackParam
Properti
-
peristiwa
ExtendableEvent
-
minta
Permintaan
-
respons
Respons opsional
-
dengan status tersembunyi akhir
MapLikeObject opsional
HandlerWillRespondCallback()
workbox-core.HandlerWillRespondCallback(
param: HandlerWillRespondCallbackParam,
)
Parameter
Hasil
-
Promise<Response>
HandlerWillRespondCallbackParam
Properti
-
peristiwa
ExtendableEvent
-
minta
Permintaan
-
respons
Respons
-
dengan status tersembunyi akhir
MapLikeObject opsional
HandlerWillStartCallback()
workbox-core.HandlerWillStartCallback(
param: HandlerWillStartCallbackParam,
)
Parameter
Hasil
-
Promise<void>
HandlerWillStartCallbackParam
Properti
-
peristiwa
ExtendableEvent
-
minta
Permintaan
-
dengan status tersembunyi akhir
MapLikeObject opsional
ManualHandlerCallback()
workbox-core.ManualHandlerCallback(
options: ManualHandlerCallbackOptions,
)
Callback "handler" dipanggil setiap kali Router
cocok dengan URL/Permintaan ke Route
melalui RouteMatchCallback
-nya. Callback pengendali ini harus
menampilkan Promise
yang diselesaikan dengan Response
.
Jika array atau objek yang tidak kosong ditampilkan oleh RouteMatchCallback
, array atau objek tersebut
akan diteruskan sebagai argumen options.params
pengendali ini.
Parameter
Hasil
-
Promise<Response>
ManualHandlerCallbackOptions
Opsi yang diteruskan ke fungsi ManualHandlerCallback
.
Properti
-
peristiwa
ExtendableEvent
-
minta
string | Permintaan
MapLikeObject
PluginState
Untuk saat ini menggunakan MapLikeObject
biasa, tetapi dapat memperluas/membatasi ini
di masa mendatang.
Jenis
RequestWillFetchCallback()
workbox-core.RequestWillFetchCallback(
param: RequestWillFetchCallbackParam,
)
Parameter
Hasil
-
Promise<Request>
RequestWillFetchCallbackParam
Properti
-
peristiwa
ExtendableEvent
-
minta
Permintaan
-
dengan status tersembunyi akhir
MapLikeObject opsional
RouteHandler
RouteHandlerCallback
atau RouteHandlerObject
.
Sebagian besar API di workbox-routing
yang menerima pengendali rute menggunakan salah satu dari keduanya.
RouteHandlerCallback()
workbox-core.RouteHandlerCallback(
options: RouteHandlerCallbackOptions,
)
Callback "handler" dipanggil setiap kali Router
cocok dengan URL/Permintaan ke Route
melalui RouteMatchCallback
-nya. Callback pengendali ini harus
menampilkan Promise
yang diselesaikan dengan Response
.
Jika array atau objek yang tidak kosong ditampilkan oleh RouteMatchCallback
, array atau objek tersebut
akan diteruskan sebagai argumen options.params
pengendali ini.
Parameter
Hasil
-
Promise<Response>
RouteHandlerCallbackOptions
Opsi yang diteruskan ke fungsi RouteHandlerCallback
.
Properti
-
peristiwa
ExtendableEvent
-
params
string[] | MapLikeObject opsional
-
minta
Permintaan
-
url
URL
RouteHandlerObject
Objek dengan metode handle
dari jenis RouteHandlerCallback
.
Objek Route
dapat dibuat dengan fungsi RouteHandlerCallback
atau objek RouteHandler
ini. Manfaat RouteHandler
adalah dapat diperluas (seperti yang dilakukan oleh paket workbox-strategies
).
Properti
-
handle
RouteMatchCallback()
workbox-core.RouteMatchCallback(
options: RouteMatchCallbackOptions,
)
Callback "match" digunakan untuk menentukan apakah Route
harus diterapkan untuk
URL dan permintaan tertentu. Saat pencocokan terjadi sebagai respons terhadap peristiwa
pengambilan dari klien, objek event
juga disediakan. Namun, karena
callback kecocokan dapat dipanggil di luar peristiwa pengambilan, logika pencocokan
tidak boleh mengasumsikan bahwa objek event
akan selalu tersedia.
Jika callback kecocokan menampilkan nilai benar, RouteHandlerCallback
rute yang cocok akan segera dipanggil. Jika nilai yang ditampilkan adalah array atau objek yang tidak kosong, nilai tersebut akan ditetapkan pada argumen options.params
pengendali.
Parameter
Hasil
-
apa pun
RouteMatchCallbackOptions
Opsi yang diteruskan ke fungsi RouteMatchCallback
.
Properti
-
peristiwa
ExtendableEvent
-
minta
Permintaan
-
sameOrigin
boolean
-
url
URL
WorkboxPlugin
Objek dengan properti callback siklus proses opsional untuk operasi pengambilan dan cache.
Properti
-
cacheDidUpdate
CacheDidUpdateCallback opsional
-
cacheKeyWillBeUsed
CacheKeyWillBeUsedCallback opsional
-
cacheWillUpdate
CacheWillUpdateCallback opsional
-
cachedResponseWillBeUsed
CachedResponseWillBeUsedCallback opsional
-
fetchDidFail
FetchDidFailCallback opsional
-
fetchDidSucceed
FetchDidSucceedCallback opsional
-
handlerDidComplete
HandlerDidCompleteCallback opsional
-
handlerDidError
HandlerDidErrorCallback opsional
-
handlerDidRespond
HandlerDidRespondCallback opsional
-
handlerWillRespond
HandlerWillRespondCallback opsional
-
handlerWillStart
HandlerWillStartCallback opsional
-
requestWillFetch
RequestWillFetchCallback opsional
WorkboxPluginCallbackParam
Properti
-
cacheDidUpdate
-
cacheKeyWillBeUsed
-
cacheWillUpdate
-
cachedResponseWillBeUsed
-
fetchDidFail
-
fetchDidSucceed
-
handlerDidComplete
-
handlerDidError
-
handlerDidRespond
-
handlerWillRespond
-
handlerWillStart
-
requestWillFetch
Properti
cacheNames
Mendapatkan nama cache saat ini dan awalan/akhiran yang digunakan oleh Workbox.
cacheNames.precache
digunakan untuk aset yang di-cache sebelumnya,
cacheNames.googleAnalytics
digunakan oleh workbox-google-analytics
untuk
menyimpan analytics.js
, dan cacheNames.runtime
digunakan untuk hal lainnya.
cacheNames.prefix
dapat digunakan untuk mengambil hanya nilai awalan saat ini.
cacheNames.suffix
dapat digunakan untuk mengambil hanya nilai akhiran saat ini.
Jenis
objek
Properti
-
googleAnalytics
string
-
pra-cache
string
-
awalan
string
-
runtime
string
-
akhiran
string
Metode
clientsClaim()
workbox-core.clientsClaim()
Klaim klien yang saat ini tersedia setelah pekerja layanan
menjadi aktif. Ini biasanya digunakan bersama dengan skipWaiting()
.
copyResponse()
workbox-core.copyResponse(
response: Response,
modifier?: function,
)
Memungkinkan developer menyalin respons dan mengubah nilai headers
, status
,
atau statusText
-nya (nilai yang dapat ditetapkan melalui
objek [ResponseInit
]https://developer.mozilla.org/en-US/docs/Web/API/Response/Response#Syntax
di konstruktor).
Untuk mengubah nilai ini, teruskan fungsi sebagai argumen kedua. Fungsi tersebut akan dipanggil dengan satu objek dengan properti respons {headers, status, statusText}
. Nilai yang ditampilkan fungsi ini akan
digunakan sebagai ResponseInit
untuk Response
baru. Untuk mengubah nilai,
ubah parameter yang diteruskan dan tampilkan, atau tampilkan objek yang benar-benar
baru.
Metode ini sengaja dibatasi untuk respons dengan origin yang sama, terlepas dari apakah CORS digunakan atau tidak.
Parameter
-
respons
Respons
-
pengubah
fungsi opsional
Parameter
modifier
terlihat seperti:(responseInit: ResponseInit) => ResponseInit
-
responseInit
ResponseInit
-
akan menampilkan
ResponseInit
-
Hasil
-
Promise<Response>
registerQuotaErrorCallback()
workbox-core.registerQuotaErrorCallback(
callback: Function,
)
Menambahkan fungsi ke kumpulan quotaErrorCallbacks yang akan dieksekusi jika terjadi error kuota.
Parameter
-
callback
Fungsi
setCacheNameDetails()
workbox-core.setCacheNameDetails(
details: PartialCacheNameDetails,
)
Mengubah nama cache default yang digunakan oleh paket Workbox.
Nama cache dibuat sebagai <prefix>-<Cache Name>-<suffix>
.
Parameter
-
detail
PartialCacheNameDetails
skipWaiting()
workbox-core.skipWaiting()
Metode ini tidak digunakan lagi, dan akan dihapus di Workbox v7.
Memanggil self.skipWaiting() sama saja, dan harus digunakan sebagai gantinya.