Workbox נוצר כמודולרי, ומאפשר למפתחים לבחור את החלקים שבהם הם רוצים להשתמש בלי לאלץ אותם להוריד את הכל בקובץ אחד.
עם זאת, יש חפיפה בין המודולים. לדוגמה, כל מודול יצטרך לבצע אינטראקציה עם מסוף, להציג שגיאות משמעותיות ולהשתמש ברשת או במטמון. כדי שלא כל המודולים יטמיעו את אותה לוגיקה, 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 לכל פרויקט. הגדרת תחילית מותאמת אישית לכל מודול תמנע התנגשויות בין המטמון של כל אחד מהם.
תלונה של לקוח
מפתחים מסוימים רוצים לפרסם עובד שירות חדש ולאפשר לו לשלוט בדפי אינטרנט שכבר פתוחים ברגע שהוא מופעל. זה לא יקרה לפי ברירת המחדל.
אם אתם רוצים שההתנהגות תהיה כזו, 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();
השיטה clientsClaim()
ב-workbox-core
מוסיפה באופן אוטומטי רכיב מעקב אירועים מסוג activate
ל-service worker, ובתוכו היא קוראת ל-self.clients.claim()
. קריאה ל-self.clients.claim()
לפני שה-service worker הנוכחי מופעל תוביל לחריגה בסביבת זמן הריצה, והעטיפה של workbox-core
עוזרת לוודא שקוראים לו בזמן הנכון.
אנחנו מוציאים משימוש את המעטפת skipWaiting
לפני Workbox בגרסה 6, המפתחים עודדו גם להשתמש בשיטה skipWaiting()
מ-workbox-core
. עם זאת, השיטה הזו לא מספקת ערך רב מעבר למה שמפתחים מקבלים אם הם קוראים ל-self.skipWaiting()
באופן מפורש.
מאחר שהעטיפה הקודמת של workbox-core
רשמה גם בורר אירועים מסוג install
שבו self.skipWaiting()
נקרא, העטיפה לא תפעל כצפוי אם היא תיקרא בתוך בורר אירועים אחר, כמו message
, אחרי שההתקנה כבר הושלמה.
לכן, השימוש ב-skipWaiting()
של workbox-core
הוצא משימוש, ומפתחים צריכים לעבור לקריאה ישירה ל-self.skipWaiting()
. בניגוד ל-self.clients.claim()
, self.skipWaiting()
לא יגרום להשלכת חריג אם ייקרא בזמן "לא נכון", לכן אין צורך לעטוף אותו בטיפול באירוע.
סוגים
CacheDidUpdateCallback()
workbox-core.CacheDidUpdateCallback(
param: CacheDidUpdateCallbackParam,
)
פרמטרים
החזרות
-
Promise<void>
CacheDidUpdateCallbackParam
מאפיינים
-
cacheName
מחרוזת
-
אירוע
ExtendableEvent
-
newResponse
תשובה
-
oldResponse
תגובה אופציונלי
-
בקשה
בקשה
-
הסמוי הסופי
MapLikeObject אופציונלי
CachedResponseWillBeUsedCallback()
workbox-core.CachedResponseWillBeUsedCallback(
param: CachedResponseWillBeUsedCallbackParam,
)
פרמטרים
החזרות
-
Promise<void | Response>
CachedResponseWillBeUsedCallbackParam
מאפיינים
-
cacheName
מחרוזת
-
cachedResponse
תגובה אופציונלי
-
אירוע
ExtendableEvent
-
matchOptions
CacheQueryOptions אופציונלי
-
בקשה
בקשה
-
הסמוי הסופי
MapLikeObject אופציונלי
CacheKeyWillBeUsedCallback()
workbox-core.CacheKeyWillBeUsedCallback(
param: CacheKeyWillBeUsedCallbackParam,
)
פרמטרים
החזרות
-
Promise<string | Request>
CacheKeyWillBeUsedCallbackParam
מאפיינים
-
אירוע
ExtendableEvent
-
מצב
מחרוזת
-
params
כל אופציונלי
-
בקשה
בקשה
-
הסמוי הסופי
MapLikeObject אופציונלי
CacheWillUpdateCallback()
workbox-core.CacheWillUpdateCallback(
param: CacheWillUpdateCallbackParam,
)
פרמטרים
החזרות
-
Promise<void | Response>
CacheWillUpdateCallbackParam
מאפיינים
-
אירוע
ExtendableEvent
-
בקשה
בקשה
-
תשובה
תשובה
-
הסמוי הסופי
MapLikeObject אופציונלי
FetchDidFailCallback()
workbox-core.FetchDidFailCallback(
param: FetchDidFailCallbackParam,
)
פרמטרים
החזרות
-
Promise<void>
FetchDidFailCallbackParam
מאפיינים
-
error
שגיאה
-
אירוע
ExtendableEvent
-
originalRequest
בקשה
-
בקשה
בקשה
-
הסמוי הסופי
MapLikeObject אופציונלי
FetchDidSucceedCallback()
workbox-core.FetchDidSucceedCallback(
param: FetchDidSucceedCallbackParam,
)
פרמטרים
החזרות
-
Promise<Response>
FetchDidSucceedCallbackParam
מאפיינים
-
אירוע
ExtendableEvent
-
בקשה
בקשה
-
תשובה
תשובה
-
הסמוי הסופי
MapLikeObject אופציונלי
HandlerCallbackOptions
HandlerDidCompleteCallback()
workbox-core.HandlerDidCompleteCallback(
param: HandlerDidCompleteCallbackParam,
)
פרמטרים
החזרות
-
Promise<void>
HandlerDidCompleteCallbackParam
מאפיינים
-
error
שגיאה אופציונלי
-
אירוע
ExtendableEvent
-
בקשה
בקשה
-
תשובה
תשובה אופציונלית
-
הסמוי הסופי
MapLikeObject אופציונלי
HandlerDidErrorCallback()
workbox-core.HandlerDidErrorCallback(
param: HandlerDidErrorCallbackParam,
)
פרמטרים
החזרות
-
Promise<Response>
HandlerDidErrorCallbackParam
מאפיינים
-
error
שגיאה
-
אירוע
ExtendableEvent
-
בקשה
בקשה
-
הסמוי הסופי
MapLikeObject אופציונלי
HandlerDidRespondCallback()
workbox-core.HandlerDidRespondCallback(
param: HandlerDidRespondCallbackParam,
)
פרמטרים
החזרות
-
Promise<void>
HandlerDidRespondCallbackParam
מאפיינים
-
אירוע
ExtendableEvent
-
בקשה
בקשה
-
תשובה
תשובה אופציונלית
-
הסמוי הסופי
MapLikeObject אופציונלי
HandlerWillRespondCallback()
workbox-core.HandlerWillRespondCallback(
param: HandlerWillRespondCallbackParam,
)
פרמטרים
החזרות
-
Promise<Response>
HandlerWillRespondCallbackParam
מאפיינים
-
אירוע
ExtendableEvent
-
בקשה
בקשה
-
תשובה
תשובה
-
הסמוי הסופי
MapLikeObject אופציונלי
HandlerWillStartCallback()
workbox-core.HandlerWillStartCallback(
param: HandlerWillStartCallbackParam,
)
פרמטרים
החזרות
-
Promise<void>
HandlerWillStartCallbackParam
מאפיינים
-
אירוע
ExtendableEvent
-
בקשה
בקשה
-
הסמוי הסופי
MapLikeObject אופציונלי
ManualHandlerCallback()
workbox-core.ManualHandlerCallback(
options: ManualHandlerCallbackOptions,
)
הקריאה החוזרת (callback) של ה-handler מופעלת בכל פעם ש-Router
תואם לכתובת URL/בקשה ל-Route
דרך RouteMatchCallback
שלו. פונקציית ה-callback של הטיפול צריכה להחזיר Promise
שמתקבל מ-Response
.
אם RouteMatchCallback
מחזיר מערך או אובייקט לא ריקים, הם יועברו כארגומנט options.params
של הטיפול הזה.
פרמטרים
-
אפשרויות
החזרות
-
Promise<Response>
ManualHandlerCallbackOptions
אפשרויות שהועברו לפונקציה ManualHandlerCallback
.
מאפיינים
-
אירוע
ExtendableEvent
-
בקשה
string | Request
MapLikeObject
PluginState
כרגע אנחנו משתמשים ב-MapLikeObject
רגיל, אבל יכול להיות שנרחיב או נגביל את זה בעתיד.
סוג
RequestWillFetchCallback()
workbox-core.RequestWillFetchCallback(
param: RequestWillFetchCallbackParam,
)
פרמטרים
החזרות
-
Promise<Request>
RequestWillFetchCallbackParam
מאפיינים
-
אירוע
ExtendableEvent
-
בקשה
בקשה
-
הסמוי הסופי
MapLikeObject אופציונלי
RouteHandler
RouteHandlerCallback
או RouteHandlerObject
.
רוב ממשקי ה-API ב-workbox-routing
שמקבלים טיפולי מסלולים מקבלים גם את האחד וגם את השני.
RouteHandlerCallback()
workbox-core.RouteHandlerCallback(
options: RouteHandlerCallbackOptions,
)
הקריאה החוזרת (callback) של ה-handler מופעלת בכל פעם ש-Router
תואם לכתובת URL/בקשה ל-Route
דרך RouteMatchCallback
שלו. פונקציית ה-callback של הטיפול צריכה להחזיר Promise
שמתקבל מ-Response
.
אם RouteMatchCallback
מחזיר מערך או אובייקט לא ריקים, הם יועברו כארגומנט options.params
של הטיפול הזה.
פרמטרים
-
אפשרויות
החזרות
-
Promise<Response>
RouteHandlerCallbackOptions
אפשרויות שהועברו לפונקציה RouteHandlerCallback
.
מאפיינים
-
אירוע
ExtendableEvent
-
params
string[] | MapLikeObject אופציונלי
-
בקשה
בקשה
-
כתובת אתר
כתובת URL
RouteHandlerObject
אובייקט עם שיטת handle
מסוג RouteHandlerCallback
.
אפשר ליצור אובייקט Route
באמצעות פונקציית RouteHandlerCallback
או באמצעות האובייקט RouteHandler
. היתרון של RouteHandler
הוא שאפשר להרחיב אותו (כמו שמתבצע בחבילה workbox-strategies
).
מאפיינים
-
נקודת אחיזה
RouteMatchCallback()
workbox-core.RouteMatchCallback(
options: RouteMatchCallbackOptions,
)
הקריאה החוזרת (callback) 'match' משמשת לקביעת אם צריך להחיל Route
על כתובת URL ובקשה מסוימות. כשמתרחש התאמה בתגובה לאירוע אחזור מהלקוח, גם האובייקט event
מסופק. עם זאת, מכיוון שאפשר להפעיל את פונקציית ה-callback של ההתאמה מחוץ לאירוע אחזור, לוגיקה ההתאמה לא צריכה להניח שהאובייקט event
תמיד יהיה זמין.
אם פונקציית ה-callback של ההתאמה מחזירה ערך נכון, הפונקציה RouteHandlerCallback
של המסלול התואם תופעל באופן מיידי. אם הערך המוחזר הוא מערך או אובייקט לא ריקים, הערך הזה יוגדר בארגומנט options.params
של הטיפול.
פרמטרים
-
אפשרויות
החזרות
-
כל
RouteMatchCallbackOptions
אפשרויות שהועברו לפונקציה RouteMatchCallback
.
מאפיינים
-
אירוע
ExtendableEvent
-
בקשה
בקשה
-
sameOrigin
בוליאני
-
כתובת אתר
כתובת URL
WorkboxPlugin
אובייקט עם מאפייני אופציונליים של פונקציית קריאה חוזרת (callback) במחזור החיים של פעולות האחזור והאחסון במטמון.
מאפיינים
-
cacheDidUpdate
CacheDidUpdateCallback אופציונלי
-
cacheKeyWillBeUsed
CacheKeyWillBeUsedCallback אופציונלי
-
cacheWillUpdate
CacheWillUpdateCallback אופציונלי
-
cachedResponseWillBeUsed
CachedResponseWillBeUsedCallback אופציונלי
-
fetchDidFail
FetchDidFailCallback אופציונלי
-
fetchDidSucceed
FetchDidSucceedCallback אופציונלי
-
handlerDidComplete
HandlerDidCompleteCallback אופציונלי
-
handlerDidError
HandlerDidErrorCallback אופציונלי
-
handlerDidRespond
HandlerDidRespondCallback אופציונלי
-
handlerWillRespond
HandlerWillRespondCallback אופציונלי
-
handlerWillStart
HandlerWillStartCallback אופציונלי
-
requestWillFetch
RequestWillFetchCallback אופציונלי
WorkboxPluginCallbackParam
מאפיינים
-
cacheDidUpdate
-
cacheKeyWillBeUsed
-
cacheWillUpdate
-
cachedResponseWillBeUsed
-
fetchDidFail
-
fetchDidSucceed
-
handlerDidComplete
-
handlerDidError
-
handlerDidRespond
-
handlerWillRespond
-
handlerWillStart
-
requestWillFetch
מאפיינים
cacheNames
הצגת השמות הנוכחיים של המטמון והתחילית/הסיומת שבהם משתמש Workbox.
השדה cacheNames.precache
משמש לנכסים שנשמרו במטמון מראש, השדה cacheNames.googleAnalytics
משמש את workbox-google-analytics
לאחסון analytics.js
, והשדה cacheNames.runtime
משמש לכל שאר הדברים.
אפשר להשתמש ב-cacheNames.prefix
כדי לאחזר רק את ערך הקידומת הנוכחי.
אפשר להשתמש ב-cacheNames.suffix
כדי לאחזר רק את ערך הסיומת הנוכחי.
סוג
אובייקט
מאפיינים
-
googleAnalytics
מחרוזת
-
אחסון במטמון מראש
מחרוזת
-
תחילית
מחרוזת
-
זמן ריצה
מחרוזת
-
סיומת
מחרוזת
Methods
clientsClaim()
workbox-core.clientsClaim()
אחרי שה-service worker יהפוך לפעיל, תוכלו לטעון בעלות על כל הלקוחות הזמינים. בדרך כלל משתמשים באפשרות הזו בשילוב עם skipWaiting()
.
copyResponse()
workbox-core.copyResponse(
response: Response,
modifier?: function,
)
מאפשר למפתחים להעתיק תשובה ולשנות את הערכים שלה בשדות headers
, status
או statusText
(הערכים שאפשר להגדיר באמצעות אובייקט [ResponseInit
]https://developer.mozilla.org/en-US/docs/Web/API/Response/Response#Syntax
ב-constructor).
כדי לשנות את הערכים האלה, מעבירים פונקציה כארגומנטים השני. הפונקציה הזו תופעל עם אובייקט יחיד עם מאפייני התשובה {headers, status, statusText}
. הערך המוחזר של הפונקציה הזו ישמש כ-ResponseInit
של Response
החדש. כדי לשנות את הערכים, משנים את הפרמטרים המועברים ומחזירים אותם, או מחזירים אובייקט חדש לגמרי.
השיטה הזו מוגבלת בכוונה לתגובות מאותו מקור, ללא קשר לשימוש ב-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()
השיטה הזו הוצאה משימוש ויוסר אותה בגרסה 7 של Workbox.
קריאה ל-self.skipWaiting() היא זהה, ויש להשתמש בה במקום זאת.