هنگامی که کارگران خدماتی برای اولین بار معرفی شدند، مجموعه ای از استراتژی های ذخیره سازی رایج ظاهر شد. استراتژی ذخیره سازی الگویی است که تعیین می کند چگونه یک سرویس دهنده پس از دریافت یک رویداد واکشی، پاسخی را ایجاد می کند.
workbox-strategies
متداولترین استراتژیهای کش را ارائه میکند، بنابراین به راحتی میتوانید آنها را در سرویسکار خود اعمال کنید.
ما خارج از استراتژیهای پشتیبانی شده توسط Workbox به جزئیات زیادی نمیپردازیم، اما میتوانید در کتاب آشپزی آفلاین اطلاعات بیشتری کسب کنید .
استفاده از استراتژی ها
در مثالهای زیر، نحوه استفاده از استراتژیهای ذخیرهسازی Workbox با workbox-routing
را به شما نشان خواهیم داد. گزینه هایی وجود دارد که می توانید با هر استراتژی تعریف کنید که در بخش پیکربندی استراتژی های این سند پوشش داده شده است.
در بخش Advanced Usage ، نحوه استفاده مستقیم از استراتژیهای کش را بدون workbox-routing
پوشش خواهیم داد.
Stale-While-Revalidate
الگوی stale-while-revalidate به شما این امکان را می دهد که در صورت وجود، با یک پاسخ ذخیره شده در حافظه پنهان، در سریع ترین زمان ممکن به درخواست پاسخ دهید، در صورتی که در کش نبود، دوباره به درخواست شبکه بازگردید. سپس درخواست شبکه برای به روز رسانی کش استفاده می شود. برخلاف برخی از پیادهسازیهای stale-while-validate، این استراتژی همیشه بدون در نظر گرفتن سن پاسخ ذخیره شده، درخواست اعتبارسنجی مجدد میکند.
این یک استراتژی نسبتاً رایج است که در آن داشتن به روزترین منبع برای برنامه ضروری نیست.
import {registerRoute} from 'workbox-routing';
import {StaleWhileRevalidate} from 'workbox-strategies';
registerRoute(
({url}) => url.pathname.startsWith('/images/avatars/'),
new StaleWhileRevalidate()
);
ابتدا کش (بازگشت حافظه پنهان به شبکه)
برنامههای وب آفلاین به شدت به حافظه نهان متکی هستند، اما برای داراییهایی که حیاتی نیستند و میتوان به تدریج آنها را کش کرد، ابتدا یک کش بهترین گزینه است.
اگر یک Response در حافظه پنهان وجود داشته باشد، درخواست با استفاده از پاسخ ذخیره شده انجام می شود و شبکه به هیچ وجه استفاده نمی شود. اگر پاسخی در حافظه پنهان وجود نداشته باشد، درخواست توسط یک درخواست شبکه انجام می شود و پاسخ در حافظه پنهان ذخیره می شود تا درخواست بعدی مستقیماً از حافظه پنهان ارائه شود.
import {registerRoute} from 'workbox-routing';
import {CacheFirst} from 'workbox-strategies';
registerRoute(({request}) => request.destination === 'style', new CacheFirst());
شبکه اول (بازگشت شبکه به حافظه پنهان)
برای درخواست هایی که به طور مکرر به روز می شوند، استراتژی شبکه اول راه حل ایده آل است. به طور پیش فرض، سعی می کند آخرین پاسخ را از شبکه دریافت کند. اگر درخواست موفقیت آمیز باشد، پاسخ را در حافظه پنهان قرار می دهد. اگر شبکه نتواند پاسخی را برگرداند، از پاسخ ذخیره شده استفاده خواهد شد.
import {registerRoute} from 'workbox-routing';
import {NetworkFirst} from 'workbox-strategies';
registerRoute(
({url}) => url.pathname.startsWith('/social-timeline/'),
new NetworkFirst()
);
فقط شبکه
اگر به درخواستهای خاصی نیاز دارید که از شبکه انجام شود، تنها شبکه استراتژی مورد استفاده است.
import {registerRoute} from 'workbox-routing';
import {NetworkOnly} from 'workbox-strategies';
registerRoute(({url}) => url.pathname.startsWith('/admin/'), new NetworkOnly());
فقط کش
استراتژی تنها حافظه پنهان تضمین می کند که پاسخ ها از یک کش به دست می آیند. این در جعبه کاری کمتر رایج است، اما اگر مرحله پیش کش خود را داشته باشید، می تواند مفید باشد.
import {registerRoute} from 'workbox-routing';
import {CacheOnly} from 'workbox-strategies';
registerRoute(({url}) => url.pathname.startsWith('/app/v2/'), new CacheOnly());
پیکربندی استراتژی ها
همه استراتژی ها به شما امکان می دهند پیکربندی کنید:
- نام حافظه پنهان برای استفاده در استراتژی.
- محدودیت های انقضای کش برای استفاده در استراتژی.
- مجموعهای از افزونهها که روشهای چرخه حیات خود را هنگام واکشی و ذخیرهسازی یک درخواست فراخوانی میکنند.
تغییر حافظه پنهان مورد استفاده توسط یک استراتژی
شما می توانید کش استراتژی مورد استفاده را با ارائه یک نام کش تغییر دهید. اگر میخواهید داراییهای خود را برای کمک به اشکالزدایی جدا کنید، مفید است.
import {registerRoute} from 'workbox-routing';
import {CacheFirst} from 'workbox-strategies';
registerRoute(
({request}) => request.destination === 'image',
new CacheFirst({
cacheName: 'image-cache',
})
);
استفاده از پلاگین ها
Workbox دارای مجموعه ای از پلاگین ها است که می توان با این استراتژی ها استفاده کرد.
- جعبه کار-پس زمینه-همگام سازی
- جعبه کاری-پخش-به روز رسانی
- workbox-cacheable-response
- جعبه کار - انقضا
- workbox-range-درخواستها
برای استفاده از هر یک از این افزونه ها (یا یک افزونه سفارشی)، فقط باید نمونه هایی را به گزینه plugins
منتقل کنید.
import {registerRoute} from 'workbox-routing';
import {CacheFirst} from 'workbox-strategies';
import {ExpirationPlugin} from 'workbox-expiration';
registerRoute(
({request}) => request.destination === 'image',
new CacheFirst({
cacheName: 'image-cache',
plugins: [
new ExpirationPlugin({
// Only cache requests for a week
maxAgeSeconds: 7 * 24 * 60 * 60,
// Only cache 10 requests.
maxEntries: 10,
}),
],
})
);
استراتژی های سفارشی
علاوه بر پیکربندی استراتژی ها، Workbox به شما امکان می دهد استراتژی های سفارشی خود را ایجاد کنید. این را می توان با وارد کردن و گسترش کلاس پایه Strategy
از workbox-strategies
انجام داد:
import {Strategy} from 'workbox-strategies';
class NewStrategy extends Strategy {
_handle(request, handler) {
// Define handling logic here
}
}
در این مثال، handle()
به عنوان یک استراتژی درخواست برای تعریف منطق مدیریت خاص استفاده می شود. دو استراتژی درخواست وجود دارد که می توان از آنها استفاده کرد:
-
handle()
: یک استراتژی درخواست را اجرا کنید و یکPromise
برگردانید که با یکResponse
حل میشود و همه تماسهای مربوط به افزونه را فراخوانی میکند. -
handleAll()
: شبیهhandle()
است، اما دو شیPromise
را برمی گرداند. اولی معادل آن چیزی است کهhandle()
برمی گرداند و دومی زمانی حل می شود که وعده هایی که بهevent.waitUntil()
در استراتژی تکمیل شوند، برطرف می شود.
هر دو استراتژی درخواست با دو پارامتر فراخوانی می شوند:
-
request
:Request
که استراتژی به آن پاسخ می دهد. -
handler
: یک نمونهStrategyHandler
که به طور خودکار برای استراتژی فعلی ایجاد می شود.
ایجاد یک استراتژی جدید
در زیر نمونهای از یک استراتژی جدید است که رفتار NetworkOnly
را مجدداً پیادهسازی میکند:
class NewNetworkOnlyStrategy extends Strategy {
_handle(request, handler) {
return handler.fetch(request);
}
}
توجه کنید که چگونه handler.fetch()
به جای متد fetch
بومی فراخوانی می شود. کلاس StrategyHandler
تعدادی اکشن واکشی و کش ارائه می کند که هر زمان که handle()
یا handleAll()
استفاده می شود، می توان از آنها استفاده کرد:
-
fetch
: یک درخواست داده شده را واکشی می کند و متدهای چرخه عمر افزونهrequestWillFetch()
،fetchDidSucceed()
وfetchDidFail()
را فراخوانی می کند. -
cacheMatch
: با درخواستی از حافظه پنهان مطابقت دارد و متدهای چرخه عمر افزونهcacheKeyWillBeUsed()
وcachedResponseWillBeUsed()
را فراخوانی می کند. -
cachePut
: یک جفت درخواست/پاسخ را در حافظه پنهان قرار می دهد و متدهای چرخه عمر افزونهcacheKeyWillBeUsed()
,cacheWillUpdate()
وcacheDidUpdate()
را فراخوانی می کند. -
fetchAndCachePut
:fetch()
را فراخوانی می کند وcachePut()
در پس زمینه روی پاسخ تولید شده توسطfetch()
اجرا می کند. -
hasCallback
: یک تماس برگشتی را به عنوان ورودی دریافت می کند و اگر استراتژی حداقل یک افزونه با پاسخ تماس داده شده داشته باشد، true را برمی گرداند. -
runCallbacks
: همه تماسهای پلاگین را که با نام مشخصی مطابقت دارند، به ترتیب اجرا میکند و یک شی پارامتر معین (ادغام شده با وضعیت فعلی افزونه) را به عنوان تنها آرگومان ارسال میکند. -
iterateCallbacks
: یک تماس برگشتی را می پذیرد و یک عدد تکراری از پاسخ های تماس پلاگین منطبق را برمی گرداند، که در آن هر تماس با وضعیت کنترل کننده فعلی پیچیده می شود (یعنی وقتی هر پاسخ تماسی را فراخوانی می کنید، هر پارامتر شی که از آن عبور می کنید با وضعیت فعلی افزونه ادغام می شود). -
waitUntil
: یک وعده به وعده های طولانی مدت رویداد مربوط به درخواست در حال رسیدگی (معمولاًFetchEvent
) اضافه می کند. -
doneWaiting
: وعده ای را برمی گرداند که پس از ارسال همه وعده ها بهwaitUntil()
حل می شود. -
destroy
: اجرای استراتژی را متوقف می کند و فوراً هر گونه وعدهwaitUntil()
را حل می کند.
استراتژی مسابقه شبکه کش سفارشی
مثال زیر بر اساس cache-network-race از کتاب آشپزی آفلاین است (که Workbox ارائه نمی دهد)، اما یک قدم فراتر می رود و همیشه پس از یک درخواست شبکه موفق، حافظه پنهان را به روز می کند. این در مثالی از یک استراتژی پیچیده تر است که از اقدامات متعدد استفاده می کند.
import {Strategy} from 'workbox-strategies';
class CacheNetworkRace extends Strategy {
_handle(request, handler) {
const fetchAndCachePutDone = handler.fetchAndCachePut(request);
const cacheMatchDone = handler.cacheMatch(request);
return new Promise((resolve, reject) => {
fetchAndCachePutDone.then(resolve);
cacheMatchDone.then(response => response && resolve(response));
// Reject if both network and cache error or find no response.
Promise.allSettled([fetchAndCachePutDone, cacheMatchDone]).then(
results => {
const [fetchAndCachePutResult, cacheMatchResult] = results;
if (
fetchAndCachePutResult.status === 'rejected' &&
!cacheMatchResult.value
) {
reject(fetchAndCachePutResult.reason);
}
}
);
});
}
}
استفاده پیشرفته
اگر می خواهید از استراتژی ها در منطق رویداد واکشی خود استفاده کنید، می توانید از کلاس های استراتژی برای اجرای یک درخواست از طریق یک استراتژی خاص استفاده کنید.
به عنوان مثال، برای استفاده از استراتژی stale-while-revalidate، می توانید موارد زیر را انجام دهید:
self.addEventListener('fetch', event => {
const {request} = event;
const url = new URL(request.url);
if (url.origin === location.origin && url.pathname === '/') {
event.respondWith(new StaleWhileRevalidate().handle({event, request}));
}
});
میتوانید فهرست کلاسهای موجود را در اسناد مرجع workbox-strategies بیابید.
انواع
CacheFirst
پیاده سازی یک استراتژی درخواست اولین کش .
یک استراتژی cache first برای دارایی هایی که تجدید نظر شده اند، مانند URL هایی مانند /styles/example.a8f5f1.css
مفید است، زیرا می توان آنها را برای مدت زمان طولانی در حافظه پنهان نگه داشت.
اگر درخواست شبکه با شکست مواجه شود، و هیچ تطبیق کش وجود نداشته باشد، یک استثنا WorkboxError
ایجاد می کند.
خواص
- سازنده
باطل
یک نمونه جدید از استراتژی ایجاد می کند و تمام ویژگی های گزینه مستند شده را به عنوان ویژگی های نمونه عمومی تنظیم می کند.
نکته: اگر یک کلاس استراتژی سفارشی کلاس Strategy پایه را گسترش دهد و به بیشتر از این ویژگی ها نیاز نداشته باشد، نیازی به تعریف سازنده خود ندارد.
تابع
constructor
به صورت زیر است:(options?: StrategyOptions) => {...}
- گزینه ها
StrategyOptions اختیاری است
- برمی گرداند
- cacheName
رشته
- fetchOptions
RequestInit اختیاری است
- matchOptions
CacheQueryOptions اختیاری است
- پلاگین ها
- _awaitکامل
باطل
تابع
_awaitComplete
به شکل زیر است:(responseDone: Promise<Response>, handler: StrategyHandler, request: Request, event: ExtendableEvent) => {...}
- پاسخ انجام شد
قول<پاسخ>
- کنترل کننده
- درخواست کنید
درخواست کنید
- رویداد
ExtendableEvent
- برمی گرداند
قول<باطل>
- _getResponse
باطل
تابع
_getResponse
به شکل زیر است:(handler: StrategyHandler, request: Request, event: ExtendableEvent) => {...}
- کنترل کننده
- درخواست کنید
درخواست کنید
- رویداد
ExtendableEvent
- برمی گرداند
قول<پاسخ>
- دسته
باطل
یک استراتژی درخواست را اجرا کنید و یک
Promise
را برمیگرداند که با یکResponse
حل میشود و همه تماسهای مربوط به افزونه را فراخوانی میکند.هنگامی که یک نمونه استراتژی با Workbox
workbox-routing.Route
ثبت می شود، این روش به طور خودکار زمانی که مسیر مطابقت دارد فراخوانی می شود.از طرف دیگر، این روش را می توان در یک شنونده مستقل
FetchEvent
با ارسال آن بهevent.respondWith()
استفاده کرد.تابع
handle
به نظر می رسد:(options: FetchEvent | HandlerCallbackOptions) => {...}
- گزینه ها
FetchEvent | HandlerCallbackOptions
یک
FetchEvent
یا یک شی با ویژگی های ذکر شده در زیر.
- برمی گرداند
قول<پاسخ>
- handleAll
باطل
مشابه
workbox-strategies.Strategy~handle
، اما به جای اینکه فقط یکPromise
برگرداند که به یکResponse
آن را حل می کند، چندین وعده[response, done]
را برمی گرداند، که در آن (response
) قبلی معادل چیزی است کهhandle()
برمی گرداند. و دومی یک Promise است که پس از تکمیل هر وعدهای که بهevent.waitUntil()
به عنوان بخشی از اجرای استراتژی تکمیل شد، برطرف میشود.شما می توانید منتظر وعده
done
باشید تا مطمئن شوید که هر کار اضافی انجام شده توسط استراتژی (معمولاً پاسخ های حافظه پنهان) با موفقیت کامل می شود.تابع
handleAll
به شکل زیر است:(options: FetchEvent | HandlerCallbackOptions) => {...}
- گزینه ها
FetchEvent | HandlerCallbackOptions
یک
FetchEvent
یا یک شی با ویژگی های ذکر شده در زیر.
- برمی گرداند
[قول <پاسخ>، قول<باطل>]
چندین وعده [پاسخ، انجام شد] که می تواند برای تعیین زمان حل شدن پاسخ و همچنین زمانی که کنترل کننده تمام کار خود را تکمیل کرده است، استفاده شود.
CacheOnly
اجرای یک استراتژی درخواست فقط حافظه پنهان .
اگر می خواهید از هر افزونه Workbox استفاده کنید، این کلاس مفید است.
اگر کش وجود نداشته باشد، یک استثنا WorkboxError
ایجاد می کند.
خواص
- سازنده
باطل
یک نمونه جدید از استراتژی ایجاد می کند و تمام ویژگی های گزینه مستند شده را به عنوان ویژگی های نمونه عمومی تنظیم می کند.
نکته: اگر یک کلاس استراتژی سفارشی کلاس Strategy پایه را گسترش دهد و به بیشتر از این ویژگی ها نیاز نداشته باشد، نیازی به تعریف سازنده خود ندارد.
تابع
constructor
به صورت زیر است:(options?: StrategyOptions) => {...}
- گزینه ها
StrategyOptions اختیاری است
- برمی گرداند
- cacheName
رشته
- fetchOptions
RequestInit اختیاری است
- matchOptions
CacheQueryOptions اختیاری است
- پلاگین ها
- _awaitکامل
باطل
تابع
_awaitComplete
به شکل زیر است:(responseDone: Promise<Response>, handler: StrategyHandler, request: Request, event: ExtendableEvent) => {...}
- پاسخ انجام شد
قول<پاسخ>
- کنترل کننده
- درخواست کنید
درخواست کنید
- رویداد
ExtendableEvent
- برمی گرداند
قول<باطل>
- _getResponse
باطل
تابع
_getResponse
به شکل زیر است:(handler: StrategyHandler, request: Request, event: ExtendableEvent) => {...}
- کنترل کننده
- درخواست کنید
درخواست کنید
- رویداد
ExtendableEvent
- برمی گرداند
قول<پاسخ>
- دسته
باطل
یک استراتژی درخواست را اجرا کنید و یک
Promise
را برمیگرداند که با یکResponse
حل میشود و همه تماسهای مربوط به افزونه را فراخوانی میکند.هنگامی که یک نمونه استراتژی با Workbox
workbox-routing.Route
ثبت می شود، این روش به طور خودکار زمانی که مسیر مطابقت دارد فراخوانی می شود.از طرف دیگر، این روش را می توان در یک شنونده مستقل
FetchEvent
با ارسال آن بهevent.respondWith()
استفاده کرد.تابع
handle
به نظر می رسد:(options: FetchEvent | HandlerCallbackOptions) => {...}
- گزینه ها
FetchEvent | HandlerCallbackOptions
یک
FetchEvent
یا یک شی با ویژگی های ذکر شده در زیر.
- برمی گرداند
قول<پاسخ>
- handleAll
باطل
مشابه
workbox-strategies.Strategy~handle
، اما به جای اینکه فقط یکPromise
برگرداند که به یکResponse
آن را حل می کند، چندین وعده[response, done]
را برمی گرداند، که در آن (response
) قبلی معادل چیزی است کهhandle()
برمی گرداند. و دومی یک Promise است که پس از تکمیل هر وعدهای که بهevent.waitUntil()
به عنوان بخشی از اجرای استراتژی تکمیل شد، برطرف میشود.شما می توانید منتظر وعده
done
باشید تا مطمئن شوید که هر کار اضافی انجام شده توسط استراتژی (معمولاً پاسخ های حافظه پنهان) با موفقیت کامل می شود.تابع
handleAll
به شکل زیر است:(options: FetchEvent | HandlerCallbackOptions) => {...}
- گزینه ها
FetchEvent | HandlerCallbackOptions
یک
FetchEvent
یا یک شی با ویژگی های ذکر شده در زیر.
- برمی گرداند
[قول <پاسخ>، قول<باطل>]
چندین وعده [پاسخ، انجام شد] که می تواند برای تعیین زمان حل شدن پاسخ و همچنین زمانی که کنترل کننده تمام کار خود را تکمیل کرده است، استفاده شود.
NetworkFirst
اجرای استراتژی درخواست اول شبکه
به طور پیشفرض، این استراتژی پاسخهای دارای کد وضعیت ۲۰۰ و همچنین پاسخهای غیر شفاف را در حافظه پنهان ذخیره میکند. پاسخهای غیرشفاف درخواستهایی با مبدا متقابل هستند که در آن پاسخ از CORS پشتیبانی نمیکند.
اگر درخواست شبکه با شکست مواجه شود، و هیچ تطبیق کش وجود نداشته باشد، یک استثنا WorkboxError
ایجاد می کند.
خواص
- سازنده
باطل
تابع
constructor
به صورت زیر است:(options?: NetworkFirstOptions) => {...}
- گزینه ها
NetworkFirstOptions اختیاری است
- برمی گرداند
- cacheName
رشته
- fetchOptions
RequestInit اختیاری است
- matchOptions
CacheQueryOptions اختیاری است
- پلاگین ها
- _awaitکامل
باطل
تابع
_awaitComplete
به شکل زیر است:(responseDone: Promise<Response>, handler: StrategyHandler, request: Request, event: ExtendableEvent) => {...}
- پاسخ انجام شد
قول<پاسخ>
- کنترل کننده
- درخواست کنید
درخواست کنید
- رویداد
ExtendableEvent
- برمی گرداند
قول<باطل>
- _getResponse
باطل
تابع
_getResponse
به شکل زیر است:(handler: StrategyHandler, request: Request, event: ExtendableEvent) => {...}
- کنترل کننده
- درخواست کنید
درخواست کنید
- رویداد
ExtendableEvent
- برمی گرداند
قول<پاسخ>
- دسته
باطل
یک استراتژی درخواست را اجرا کنید و یک
Promise
را برمیگرداند که با یکResponse
حل میشود و همه تماسهای مربوط به افزونه را فراخوانی میکند.هنگامی که یک نمونه استراتژی با Workbox
workbox-routing.Route
ثبت می شود، این روش به طور خودکار زمانی که مسیر مطابقت دارد فراخوانی می شود.از طرف دیگر، این روش را می توان در یک شنونده مستقل
FetchEvent
با ارسال آن بهevent.respondWith()
استفاده کرد.تابع
handle
به نظر می رسد:(options: FetchEvent | HandlerCallbackOptions) => {...}
- گزینه ها
FetchEvent | HandlerCallbackOptions
یک
FetchEvent
یا یک شی با ویژگی های ذکر شده در زیر.
- برمی گرداند
قول<پاسخ>
- handleAll
باطل
مشابه
workbox-strategies.Strategy~handle
، اما به جای اینکه فقط یکPromise
برگرداند که به یکResponse
آن را حل می کند، چندین وعده[response, done]
را برمی گرداند، که در آن (response
) قبلی معادل چیزی است کهhandle()
برمی گرداند. و دومی یک Promise است که پس از تکمیل هر وعدهای که بهevent.waitUntil()
به عنوان بخشی از اجرای استراتژی تکمیل شد، برطرف میشود.شما می توانید منتظر وعده
done
باشید تا مطمئن شوید که هر کار اضافی انجام شده توسط استراتژی (معمولاً پاسخ های حافظه پنهان) با موفقیت کامل می شود.تابع
handleAll
به شکل زیر است:(options: FetchEvent | HandlerCallbackOptions) => {...}
- گزینه ها
FetchEvent | HandlerCallbackOptions
یک
FetchEvent
یا یک شی با ویژگی های ذکر شده در زیر.
- برمی گرداند
[قول <پاسخ>، قول<باطل>]
چندین وعده [پاسخ، انجام شد] که می تواند برای تعیین زمان حل شدن پاسخ و همچنین زمانی که کنترل کننده تمام کار خود را تکمیل کرده است، استفاده شود.
NetworkFirstOptions
خواص
- cacheName
رشته اختیاری
- fetchOptions
RequestInit اختیاری است
- matchOptions
CacheQueryOptions اختیاری است
- networkTimeoutSeconds
شماره اختیاری
- پلاگین ها
WorkboxPlugin [] اختیاری است
NetworkOnly
اجرای یک استراتژی درخواست فقط شبکه .
اگر می خواهید از هر افزونه Workbox استفاده کنید، این کلاس مفید است.
اگر درخواست شبکه با شکست مواجه شود، یک استثنا WorkboxError
ایجاد می کند.
خواص
- سازنده
باطل
تابع
constructor
به صورت زیر است:(options?: NetworkOnlyOptions) => {...}
- گزینه ها
NetworkOnlyOptions اختیاری است
- برمی گرداند
- cacheName
رشته
- fetchOptions
RequestInit اختیاری است
- matchOptions
CacheQueryOptions اختیاری است
- پلاگین ها
- _awaitکامل
باطل
تابع
_awaitComplete
به شکل زیر است:(responseDone: Promise<Response>, handler: StrategyHandler, request: Request, event: ExtendableEvent) => {...}
- پاسخ انجام شد
قول<پاسخ>
- کنترل کننده
- درخواست کنید
درخواست کنید
- رویداد
ExtendableEvent
- برمی گرداند
قول<باطل>
- _getResponse
باطل
تابع
_getResponse
به شکل زیر است:(handler: StrategyHandler, request: Request, event: ExtendableEvent) => {...}
- کنترل کننده
- درخواست کنید
درخواست کنید
- رویداد
ExtendableEvent
- برمی گرداند
قول<پاسخ>
- دسته
باطل
یک استراتژی درخواست را اجرا کنید و یک
Promise
را برمیگرداند که با یکResponse
حل میشود و همه تماسهای مربوط به افزونه را فراخوانی میکند.هنگامی که یک نمونه استراتژی با Workbox
workbox-routing.Route
ثبت می شود، این روش به طور خودکار زمانی که مسیر مطابقت دارد فراخوانی می شود.از طرف دیگر، این روش را می توان در یک شنونده مستقل
FetchEvent
با ارسال آن بهevent.respondWith()
استفاده کرد.تابع
handle
به نظر می رسد:(options: FetchEvent | HandlerCallbackOptions) => {...}
- گزینه ها
FetchEvent | HandlerCallbackOptions
یک
FetchEvent
یا یک شی با ویژگی های ذکر شده در زیر.
- برمی گرداند
قول<پاسخ>
- handleAll
باطل
مشابه
workbox-strategies.Strategy~handle
، اما به جای اینکه فقط یکPromise
برگرداند که به یکResponse
آن را حل می کند، چندین وعده[response, done]
را برمی گرداند، که در آن (response
) قبلی معادل چیزی است کهhandle()
برمی گرداند. و دومی یک Promise است که پس از تکمیل هر وعدهای که بهevent.waitUntil()
به عنوان بخشی از اجرای استراتژی تکمیل شد، برطرف میشود.شما می توانید منتظر وعده
done
باشید تا مطمئن شوید که هر کار اضافی انجام شده توسط استراتژی (معمولاً پاسخ های حافظه پنهان) با موفقیت کامل می شود.تابع
handleAll
به شکل زیر است:(options: FetchEvent | HandlerCallbackOptions) => {...}
- گزینه ها
FetchEvent | HandlerCallbackOptions
یک
FetchEvent
یا یک شی با ویژگی های ذکر شده در زیر.
- برمی گرداند
[قول <پاسخ>، قول<باطل>]
چندین وعده [پاسخ، انجام شد] که می تواند برای تعیین زمان حل شدن پاسخ و همچنین زمانی که کنترل کننده تمام کار خود را تکمیل کرده است، استفاده شود.
NetworkOnlyOptions
خواص
- fetchOptions
RequestInit اختیاری است
- networkTimeoutSeconds
شماره اختیاری
- پلاگین ها
WorkboxPlugin [] اختیاری است
StaleWhileRevalidate
اجرای یک استراتژی درخواست کهنه و اعتبار مجدد .
منابع هم از کش و هم از شبکه به صورت موازی درخواست می شوند. استراتژی در صورت موجود بودن با نسخه ذخیره شده پاسخ می دهد، در غیر این صورت منتظر پاسخ شبکه باشید. کش با پاسخ شبکه با هر درخواست موفقیت آمیز به روز می شود.
به طور پیشفرض، این استراتژی پاسخهای دارای کد وضعیت ۲۰۰ و همچنین پاسخهای غیر شفاف را در حافظه پنهان ذخیره میکند. پاسخهای غیرشفاف درخواستهایی با مبدا متقابل هستند که در آن پاسخ از CORS پشتیبانی نمیکند.
اگر درخواست شبکه با شکست مواجه شود، و هیچ تطبیق کش وجود نداشته باشد، یک استثنا WorkboxError
ایجاد می کند.
خواص
- سازنده
باطل
تابع
constructor
به صورت زیر است:(options?: StrategyOptions) => {...}
- گزینه ها
StrategyOptions اختیاری است
- برمی گرداند
- cacheName
رشته
- fetchOptions
RequestInit اختیاری است
- matchOptions
CacheQueryOptions اختیاری است
- پلاگین ها
- _awaitکامل
باطل
تابع
_awaitComplete
به شکل زیر است:(responseDone: Promise<Response>, handler: StrategyHandler, request: Request, event: ExtendableEvent) => {...}
- پاسخ انجام شد
قول<پاسخ>
- کنترل کننده
- درخواست کنید
درخواست کنید
- رویداد
ExtendableEvent
- برمی گرداند
قول<باطل>
- _getResponse
باطل
تابع
_getResponse
به شکل زیر است:(handler: StrategyHandler, request: Request, event: ExtendableEvent) => {...}
- کنترل کننده
- درخواست کنید
درخواست کنید
- رویداد
ExtendableEvent
- برمی گرداند
قول<پاسخ>
- دسته
باطل
یک استراتژی درخواست را اجرا کنید و یک
Promise
را برمیگرداند که با یکResponse
حل میشود و همه تماسهای مربوط به افزونه را فراخوانی میکند.هنگامی که یک نمونه استراتژی با Workbox
workbox-routing.Route
ثبت می شود، این روش به طور خودکار زمانی که مسیر مطابقت دارد فراخوانی می شود.از طرف دیگر، این روش را می توان در یک شنونده مستقل
FetchEvent
با ارسال آن بهevent.respondWith()
استفاده کرد.تابع
handle
به نظر می رسد:(options: FetchEvent | HandlerCallbackOptions) => {...}
- گزینه ها
FetchEvent | HandlerCallbackOptions
یک
FetchEvent
یا یک شی با ویژگی های ذکر شده در زیر.
- برمی گرداند
قول<پاسخ>
- handleAll
باطل
مشابه
workbox-strategies.Strategy~handle
، اما به جای اینکه فقط یکPromise
برگرداند که به یکResponse
آن را حل می کند، چندین وعده[response, done]
را برمی گرداند، که در آن (response
) قبلی معادل چیزی است کهhandle()
برمی گرداند. و دومی یک Promise است که پس از تکمیل هر وعدهای که بهevent.waitUntil()
به عنوان بخشی از اجرای استراتژی تکمیل شد، برطرف میشود.شما می توانید منتظر وعده
done
باشید تا مطمئن شوید که هر کار اضافی انجام شده توسط استراتژی (معمولاً پاسخ های حافظه پنهان) با موفقیت کامل می شود.تابع
handleAll
به شکل زیر است:(options: FetchEvent | HandlerCallbackOptions) => {...}
- گزینه ها
FetchEvent | HandlerCallbackOptions
یک
FetchEvent
یا یک شی با ویژگی های ذکر شده در زیر.
- برمی گرداند
[قول <پاسخ>، قول<باطل>]
چندین وعده [پاسخ، انجام شد] که می تواند برای تعیین زمان حل شدن پاسخ و همچنین زمانی که کنترل کننده تمام کار خود را تکمیل کرده است، استفاده شود.
Strategy
یک کلاس پایه انتزاعی که تمام کلاس های استراتژی دیگر باید از آن امتداد داشته باشند:
خواص
- سازنده
باطل
یک نمونه جدید از استراتژی ایجاد می کند و تمام ویژگی های گزینه مستند شده را به عنوان ویژگی های نمونه عمومی تنظیم می کند.
نکته: اگر یک کلاس استراتژی سفارشی کلاس Strategy پایه را گسترش دهد و به بیشتر از این ویژگی ها نیاز نداشته باشد، نیازی به تعریف سازنده خود ندارد.
تابع
constructor
به صورت زیر است:(options?: StrategyOptions) => {...}
- گزینه ها
StrategyOptions اختیاری است
- برمی گرداند
- cacheName
رشته
- fetchOptions
RequestInit اختیاری است
- matchOptions
CacheQueryOptions اختیاری است
- پلاگین ها
- _awaitکامل
باطل
تابع
_awaitComplete
به شکل زیر است:(responseDone: Promise<Response>, handler: StrategyHandler, request: Request, event: ExtendableEvent) => {...}
- پاسخ انجام شد
قول<پاسخ>
- کنترل کننده
- درخواست کنید
درخواست کنید
- رویداد
ExtendableEvent
- برمی گرداند
قول<باطل>
- _getResponse
باطل
تابع
_getResponse
به شکل زیر است:(handler: StrategyHandler, request: Request, event: ExtendableEvent) => {...}
- کنترل کننده
- درخواست کنید
درخواست کنید
- رویداد
ExtendableEvent
- برمی گرداند
قول<پاسخ>
- _دسته
باطل
تابع
_handle
به شکل زیر است:(request: Request, handler: StrategyHandler) => {...}
- درخواست کنید
درخواست کنید
- کنترل کننده
- برمی گرداند
قول<پاسخ>
- دسته
باطل
یک استراتژی درخواست را اجرا کنید و یک
Promise
را برمیگرداند که با یکResponse
حل میشود و همه تماسهای مربوط به افزونه را فراخوانی میکند.هنگامی که یک نمونه استراتژی با Workbox
workbox-routing.Route
ثبت می شود، این روش به طور خودکار زمانی که مسیر مطابقت دارد فراخوانی می شود.از طرف دیگر، این روش را می توان در یک شنونده مستقل
FetchEvent
با ارسال آن بهevent.respondWith()
استفاده کرد.تابع
handle
به نظر می رسد:(options: FetchEvent | HandlerCallbackOptions) => {...}
- گزینه ها
FetchEvent | HandlerCallbackOptions
یک
FetchEvent
یا یک شی با ویژگی های ذکر شده در زیر.
- برمی گرداند
قول<پاسخ>
- handleAll
باطل
مشابه
workbox-strategies.Strategy~handle
، اما به جای اینکه فقط یکPromise
برگرداند که به یکResponse
آن را حل می کند، چندین وعده[response, done]
را برمی گرداند، که در آن (response
) قبلی معادل چیزی است کهhandle()
برمی گرداند. و دومی یک Promise است که پس از تکمیل هر وعدهای که بهevent.waitUntil()
به عنوان بخشی از اجرای استراتژی تکمیل شد، برطرف میشود.شما می توانید منتظر وعده
done
باشید تا مطمئن شوید که هر کار اضافی انجام شده توسط استراتژی (معمولاً پاسخ های حافظه پنهان) با موفقیت کامل می شود.تابع
handleAll
به شکل زیر است:(options: FetchEvent | HandlerCallbackOptions) => {...}
- گزینه ها
FetchEvent | HandlerCallbackOptions
یک
FetchEvent
یا یک شی با ویژگی های ذکر شده در زیر.
- برمی گرداند
[قول <پاسخ>، قول<باطل>]
چندین وعده [پاسخ، انجام شد] که می تواند برای تعیین زمان حل شدن پاسخ و همچنین زمانی که کنترل کننده تمام کار خود را تکمیل کرده است، استفاده شود.
StrategyHandler
کلاسی ایجاد میشود که هر بار که یک نمونه Strategy، workbox-strategies.Strategy~handle
یا workbox-strategies.Strategy~handleAll
چیزهایی که تمام اقدامات واکشی و حافظه پنهان را در اطراف تماسهای پلاگین میپیچد و زمان «انجام شد» استراتژی را پیگیری میکند (یعنی همه موارد اضافه شده) event.waitUntil()
وعده ها حل شده اند).
خواص
- سازنده
باطل
یک نمونه جدید مرتبط با استراتژی و رویدادی که درخواست را مدیریت می کند ایجاد می کند.
سازنده همچنین حالتی را که به هر یک از پلاگین هایی که این درخواست را مدیریت می کنند ارسال می کند مقداردهی اولیه می کند.
تابع
constructor
به صورت زیر است:(strategy: Strategy, options: HandlerCallbackOptions) => {...}
- استراتژی
- گزینه ها
- برمی گرداند
- رویداد
ExtendableEvent
- پارامترها
هر اختیاری
- درخواست کنید
درخواست کنید
- آدرس اینترنتی
URL اختیاری است
- cacheMatch
باطل
با استفاده از
cacheName
،matchOptions
وplugins
تعریفشده روی شی استراتژی، درخواستی را از حافظه پنهان مطابقت میدهد (و همه روشهای مربوط به تماس پلاگین را فراخوانی میکند).روشهای چرخه عمر افزونه زیر هنگام استفاده از این روش فراخوانی میشوند:
- cacheKeyWillBeUsed()
- cachedResponseWillBeUsed()
تابع
cacheMatch
به نظر می رسد:(key: RequestInfo) => {...}
- کلید
RequestInfo
درخواست یا URL برای استفاده به عنوان کلید حافظه پنهان.
- برمی گرداند
قول<پاسخ>
پاسخ منطبق، در صورت یافتن.
- cachePut
باطل
یک جفت درخواست/پاسخ را با استفاده از
cacheName
وplugins
تعریفشده روی شی استراتژی، در حافظه پنهان قرار میدهد (و همه روشهای برگشت تماس پلاگین قابل اجرا را فراخوانی میکند).روشهای چرخه عمر افزونه زیر هنگام استفاده از این روش فراخوانی میشوند:
- cacheKeyWillBeUsed()
- cacheWillUpdate()
- cacheDidUpdate()
تابع
cachePut
به نظر می رسد:(key: RequestInfo, response: Response) => {...}
- کلید
RequestInfo
درخواست یا URL برای استفاده به عنوان کلید حافظه پنهان.
- پاسخ
پاسخ
پاسخ به حافظه پنهان
- برمی گرداند
وعده<boolean>
اگر cacheWillUpdate باعث شود پاسخ در حافظه پنهان نشود
false
و در غیر این صورتtrue
.
- نابود کردن
باطل
اجرای استراتژی را متوقف میکند و فوراً هرگونه وعدههای منتظر مانده
waitUntil()
را حل میکند.تابع
destroy
به صورت زیر است:() => {...}
- انجام شد در انتظار
باطل
یک وعده را برمیگرداند که پس از ارسال همه وعدهها به
workbox-strategies.StrategyHandler~waitUntil
حل شود.توجه: هر کاری که پس از تسویه
doneWaiting()
انجام می شود، باید به صورت دستی به متدwaitUntil()
رویداد منتقل شود (نه متدwaitUntil()
این handler)، در غیر این صورت تاپیک کارگر سرویس قبل از تکمیل کار شما کشته شود.تابع
doneWaiting
به شکل زیر است:() => {...}
- برمی گرداند
قول<باطل>
- واکشی
باطل
با استفاده از
fetchOptions
(برای درخواستهای غیر ناوبری) وplugins
تعریفشده روی شیStrategy
یک درخواست معین را واکشی میکند (و هر روش پاسخ به تماس پلاگین قابل اجرا را فراخوانی میکند).روشهای چرخه عمر افزونه زیر هنگام استفاده از این روش فراخوانی میشوند:
-
requestWillFetch()
-
fetchDidSucceed()
-
fetchDidFail()
تابع
fetch
به نظر می رسد:(input: RequestInfo) => {...}
- ورودی
RequestInfo
URL یا درخواست واکشی.
- برمی گرداند
قول<پاسخ>
-
- fetchAndCachePut
باطل
this.fetch()
را فراخوانی می کند و (در پس زمینه)this.cachePut()
را روی پاسخ ایجاد شده توسطthis.fetch()
اجرا می کند.فراخوانی به
this.cachePut()
به طور خودکارthis.waitUntil()
را فراخوانی می کند، بنابراین شما مجبور نیستید به صورت دستیwaitUntil()
در رویداد فراخوانی کنید.تابع
fetchAndCachePut
به نظر می رسد:(input: RequestInfo) => {...}
- ورودی
RequestInfo
درخواست یا آدرس اینترنتی برای واکشی و حافظه پنهان.
- برمی گرداند
قول<پاسخ>
- getCacheKey
باطل
فهرست پلاگینها را برای
cacheKeyWillBeUsed
بررسی میکند و هر یک از آن تماسهای موجود را به ترتیب اجرا میکند. شیءRequest
نهایی که توسط آخرین افزونه برگردانده می شود به عنوان کلید کش برای خواندن و/یا نوشتن حافظه پنهان در نظر گرفته می شود. اگر هیچ پاسخ تماسی برای افزونهcacheKeyWillBeUsed
ثبت نشده باشد، درخواست ارسال شده بدون تغییر بازگردانده می شود.تابع
getCacheKey
به شکل زیر است:(request: Request, mode: "read"
| "write"
) => {...}- درخواست کنید
درخواست کنید
- حالت
"خواندن"
| "نوشتن"
- برمی گرداند
قول<درخواست>
- پاسخ تماس دارد
باطل
اگر استراتژی حداقل یک افزونه با پاسخ تماس داده شده داشته باشد، درست برمی گردد.
تابع
hasCallback
به نظر می رسد:(name: C) => {...}
- نام
سی
نام تماس برگشتی برای بررسی.
- برمی گرداند
بولی
- iterateCallbacks
باطل
پاسخ به تماس را میپذیرد و تعداد تکرار تماسهای پلاگین منطبق را برمیگرداند، که در آن هر تماس با وضعیت کنترلکننده فعلی قرار میگیرد (یعنی وقتی هر پاسخ تماسی را فراخوانی میکنید، هر پارامتر شی را که ارسال کنید، با وضعیت فعلی افزونه ادغام میشود).
تابع
iterateCallbacks
به نظر می رسد:(name: C) => {...}
- نام
سی
نام پاسخ تماس برای اجرا
- برمی گرداند
Generator<NonNullable<indexedAccess>anyunknown>
- اجرای تماس های برگشتی
باطل
همه فراخوانهای پلاگین مطابق با نام داده شده را به ترتیب اجرا میکند و شیء پارامتر داده شده (ادغام شده با وضعیت فعلی افزونه) را به عنوان تنها آرگومان ارسال میکند.
توجه: از آنجایی که این روش همه پلاگین ها را اجرا می کند، برای مواردی که باید قبل از فراخوانی تماس بعدی، مقدار برگشتی یک callback اعمال شود، مناسب نیست. برای نحوه رسیدگی به این مورد،
workbox-strategies.StrategyHandler#iterateCallbacks
در زیر ببینید.تابع
runCallbacks
به نظر می رسد:(name: C, param: Omit<indexedAccess"state"
>) => {...}- نام
سی
نام تماس برگشتی برای اجرا در هر افزونه.
- پارامتر
Omit<indexedAccess "state"
>شیئی که باید به عنوان اولین (و تنها) پارامتر هنگام اجرای هر پاسخ به تماس ارسال شود. این شی با وضعیت فعلی افزونه قبل از اجرای تماس مجدد ادغام خواهد شد.
- برمی گرداند
قول<باطل>
- صبر کنید تا
باطل
یک قول به [extend lifetime-promises]
https://w3c.github.io/ServiceWorker/#extendableevent-extend-lifetime-promises
رویداد رویداد مرتبط با درخواست در حال رسیدگی (معمولاًFetchEvent
) اضافه می کند.توجه: میتوانید منتظر
workbox-strategies.StrategyHandler~doneWaiting
برای دانستن اینکه چه زمانی تمام وعدههای اضافه شده تسویه شدهاند.تابع
waitUntil
به نظر می رسد:(promise: Promise<T>) => {...}
- قول دادن
قول<T>
وعده ای برای افزودن به وعده های طولانی مدت رویدادی که باعث ایجاد درخواست شده است.
- برمی گرداند
قول<T>
StrategyOptions
خواص
- cacheName
رشته اختیاری
- fetchOptions
RequestInit اختیاری است
- matchOptions
CacheQueryOptions اختیاری است
- پلاگین ها
WorkboxPlugin [] اختیاری است