جعبه کار - استراتژی ها

هنگامی که کارگران خدماتی برای اولین بار معرفی شدند، مجموعه ای از استراتژی های ذخیره سازی رایج ظاهر شد. استراتژی ذخیره سازی الگویی است که تعیین می کند چگونه یک سرویس دهنده پس از دریافت یک رویداد واکشی، پاسخی را ایجاد می کند.

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() را حل می کند.

توجه: برای مشاهده تمام پارامترهای پذیرفته شده توسط هر عمل به منبع اجرای StrategyHandler مراجعه کنید

استراتژی مسابقه شبکه کش سفارشی

مثال زیر بر اساس 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 اختیاری است

  • برمی گرداند

    CacheFirst

• cacheName

  رشته

• fetchOptions

  RequestInit اختیاری است

• matchOptions

  CacheQueryOptions اختیاری است

• پلاگین ها

  افزونه Workbox []

• _awaitکامل

  خالی

  تابع _awaitComplete به نظر می رسد:

  (responseDone: Promise<Response>,handler: StrategyHandler,request: Request,event: ExtendableEvent)=> {...}

  • پاسخ انجام شد

    قول<پاسخ>

  • کنترل کننده

    Strategy Handler

  • درخواست

    درخواست

  • رویداد

    ExtendableEvent

  • برمی گرداند

    قول<باطل>

• _getResponse

  خالی

  تابع _getResponse به نظر می رسد:

  (handler: StrategyHandler,request: Request,event: ExtendableEvent)=> {...}

  • کنترل کننده

    Strategy Handler

  • درخواست

    درخواست

  • رویداد

    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 یا یک شی با ویژگی های ذکر شده در زیر.

  • برمی گرداند

    [Promise<Response>, Promise<void>]

    چندین وعده [پاسخ، انجام شد] که می تواند برای تعیین زمان حل شدن پاسخ و همچنین زمانی که کنترل کننده تمام کارهای خود را تکمیل کرده است، استفاده شود.

CacheOnly

اجرای یک استراتژی درخواست فقط حافظه پنهان .

اگر می خواهید از هر افزونه Workbox استفاده کنید، این کلاس مفید است.

اگر هیچ تطبیقی ​​کش وجود نداشته باشد، یک استثنا WorkboxError ایجاد می کند.

خواص

• سازنده

  خالی

  یک نمونه جدید از استراتژی ایجاد می کند و تمام ویژگی های گزینه مستند شده را به عنوان ویژگی های نمونه عمومی تنظیم می کند.

  نکته: اگر یک کلاس استراتژی سفارشی کلاس Strategy پایه را گسترش دهد و به بیشتر از این ویژگی ها نیاز نداشته باشد، نیازی به تعریف سازنده خود ندارد.

  تابع constructor به نظر می رسد:

  (options?: StrategyOptions)=> {...}

  • گزینه ها

    StrategyOptions اختیاری است

  • برمی گرداند

    فقط کش

• cacheName

  رشته

• fetchOptions

  RequestInit اختیاری است

• matchOptions

  CacheQueryOptions اختیاری است

• پلاگین ها

  افزونه Workbox []

• _awaitکامل

  خالی

  تابع _awaitComplete به نظر می رسد:

  (responseDone: Promise<Response>,handler: StrategyHandler,request: Request,event: ExtendableEvent)=> {...}

  • پاسخ انجام شد

    قول<پاسخ>

  • کنترل کننده

    Strategy Handler

  • درخواست

    درخواست

  • رویداد

    ExtendableEvent

  • برمی گرداند

    قول<باطل>

• _getResponse

  خالی

  تابع _getResponse به نظر می رسد:

  (handler: StrategyHandler,request: Request,event: ExtendableEvent)=> {...}

  • کنترل کننده

    Strategy Handler

  • درخواست

    درخواست

  • رویداد

    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 یا یک شی با ویژگی های ذکر شده در زیر.

  • برمی گرداند

    [Promise<Response>,Promise<void>]

    چندین وعده [پاسخ، انجام شد] که می تواند برای تعیین زمان حل شدن پاسخ و همچنین زمانی که کنترل کننده تمام کارهای خود را تکمیل کرده است، استفاده شود.

NetworkFirst

اجرای استراتژی درخواست اول شبکه

به طور پیش‌فرض، این استراتژی پاسخ‌های دارای کد وضعیت ۲۰۰ و همچنین پاسخ‌های غیر شفاف را در حافظه پنهان ذخیره می‌کند. پاسخ‌های غیرشفاف درخواست‌هایی با مبدا متقابل هستند که در آن پاسخ از CORS پشتیبانی نمی‌کند.

اگر درخواست شبکه با شکست مواجه شود، و هیچ تطبیق کش وجود نداشته باشد، یک استثنا WorkboxError ایجاد می کند.

خواص

• سازنده

  خالی

  تابع constructor به نظر می رسد:

  (options?: NetworkFirstOptions)=> {...}

  • گزینه ها

    NetworkFirstOptions اختیاری است

  • برمی گرداند

    شبکه اول

• cacheName

  رشته

• fetchOptions

  RequestInit اختیاری است

• matchOptions

  CacheQueryOptions اختیاری است

• پلاگین ها

  افزونه Workbox []

• _awaitکامل

  خالی

  تابع _awaitComplete به نظر می رسد:

  (responseDone: Promise<Response>,handler: StrategyHandler,request: Request,event: ExtendableEvent)=> {...}

  • پاسخ انجام شد

    قول<پاسخ>

  • کنترل کننده

    Strategy Handler

  • درخواست

    درخواست

  • رویداد

    ExtendableEvent

  • برمی گرداند

    قول<باطل>

• _getResponse

  خالی

  تابع _getResponse به نظر می رسد:

  (handler: StrategyHandler,request: Request,event: ExtendableEvent)=> {...}

  • کنترل کننده

    Strategy Handler

  • درخواست

    درخواست

  • رویداد

    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 یا یک شی با ویژگی های ذکر شده در زیر.

  • برمی گرداند

    [Promise<Response>,Promise<void>]

    چندین وعده [پاسخ، انجام شد] که می تواند برای تعیین زمان حل شدن پاسخ و همچنین زمانی که کنترل کننده تمام کارهای خود را تکمیل کرده است، استفاده شود.

NetworkFirstOptions

خواص

• cacheName

  رشته اختیاری

• fetchOptions

  RequestInit اختیاری است

• matchOptions

  CacheQueryOptions اختیاری است

• networkTimeoutSeconds

  شماره اختیاری

• پلاگین ها

  WorkboxPlugin [] اختیاری است

NetworkOnly

اجرای یک استراتژی درخواست فقط شبکه .

اگر می خواهید از هر افزونه Workbox استفاده کنید، این کلاس مفید است.

اگر درخواست شبکه با شکست مواجه شود، یک استثنا WorkboxError ایجاد می کند.

خواص

• سازنده

  خالی

  تابع constructor به نظر می رسد:

  (options?: NetworkOnlyOptions)=> {...}

  • گزینه ها

    NetworkOnlyOptions اختیاری است

  • برمی گرداند

    فقط شبکه

• cacheName

  رشته

• fetchOptions

  RequestInit اختیاری است

• matchOptions

  CacheQueryOptions اختیاری است

• پلاگین ها

  افزونه Workbox []

• _awaitکامل

  خالی

  تابع _awaitComplete به نظر می رسد:

  (responseDone: Promise<Response>,handler: StrategyHandler,request: Request,event: ExtendableEvent)=> {...}

  • پاسخ انجام شد

    قول<پاسخ>

  • کنترل کننده

    Strategy Handler

  • درخواست

    درخواست

  • رویداد

    ExtendableEvent

  • برمی گرداند

    قول<باطل>

• _getResponse

  خالی

  تابع _getResponse به نظر می رسد:

  (handler: StrategyHandler,request: Request,event: ExtendableEvent)=> {...}

  • کنترل کننده

    Strategy Handler

  • درخواست

    درخواست

  • رویداد

    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 یا یک شی با ویژگی های ذکر شده در زیر.

  • برمی گرداند

    [Promise<Response>,Promise<void>]

    چندین وعده [پاسخ، انجام شد] که می تواند برای تعیین زمان حل شدن پاسخ و همچنین زمانی که کنترل کننده تمام کارهای خود را تکمیل کرده است، استفاده شود.

NetworkOnlyOptions

خواص

• fetchOptions

  RequestInit اختیاری است

• networkTimeoutSeconds

  شماره اختیاری

• پلاگین ها

  WorkboxPlugin [] اختیاری است

StaleWhileRevalidate

اجرای یک استراتژی درخواست کهنه و اعتبار مجدد .

منابع هم از کش و هم از شبکه به صورت موازی درخواست می شوند. استراتژی در صورت موجود بودن با نسخه ذخیره شده پاسخ می دهد، در غیر این صورت منتظر پاسخ شبکه باشید. کش با پاسخ شبکه با هر درخواست موفقیت آمیز به روز می شود.

به طور پیش‌فرض، این استراتژی پاسخ‌های دارای کد وضعیت ۲۰۰ و همچنین پاسخ‌های غیر شفاف را در حافظه پنهان ذخیره می‌کند. پاسخ‌های غیرشفاف درخواست‌هایی با مبدا متقابل هستند که در آن پاسخ از CORS پشتیبانی نمی‌کند.

اگر درخواست شبکه با شکست مواجه شود، و هیچ تطبیق کش وجود نداشته باشد، یک استثنا WorkboxError ایجاد می کند.

خواص

• سازنده

  خالی

  تابع constructor به نظر می رسد:

  (options?: StrategyOptions)=> {...}

  • گزینه ها

    StrategyOptions اختیاری است

  • برمی گرداند

    StaleWhileRevalidate

• cacheName

  رشته

• fetchOptions

  RequestInit اختیاری است

• matchOptions

  CacheQueryOptions اختیاری است

• پلاگین ها

  افزونه Workbox []

• _awaitکامل

  خالی

  تابع _awaitComplete به نظر می رسد:

  (responseDone: Promise<Response>,handler: StrategyHandler,request: Request,event: ExtendableEvent)=> {...}

  • پاسخ انجام شد

    قول<پاسخ>

  • کنترل کننده

    Strategy Handler

  • درخواست

    درخواست

  • رویداد

    ExtendableEvent

  • برمی گرداند

    قول<باطل>

• _getResponse

  خالی

  تابع _getResponse به نظر می رسد:

  (handler: StrategyHandler,request: Request,event: ExtendableEvent)=> {...}

  • کنترل کننده

    Strategy Handler

  • درخواست

    درخواست

  • رویداد

    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 یا یک شی با ویژگی های ذکر شده در زیر.

  • برمی گرداند

    [Promise<Response>,Promise<void>]

    چندین وعده [پاسخ، انجام شد] که می تواند برای تعیین زمان حل شدن پاسخ و همچنین زمانی که کنترل کننده تمام کارهای خود را تکمیل کرده است، استفاده شود.

Strategy

یک کلاس پایه انتزاعی که تمام کلاس های استراتژی دیگر باید از آن امتداد داشته باشند:

خواص

• سازنده

  خالی

  یک نمونه جدید از استراتژی ایجاد می کند و تمام ویژگی های گزینه مستند شده را به عنوان ویژگی های نمونه عمومی تنظیم می کند.

  نکته: اگر یک کلاس استراتژی سفارشی کلاس Strategy پایه را گسترش دهد و به بیشتر از این ویژگی ها نیاز نداشته باشد، نیازی به تعریف سازنده خود ندارد.

  تابع constructor به نظر می رسد:

  (options?: StrategyOptions)=> {...}

  • گزینه ها

    StrategyOptions اختیاری است

  • برمی گرداند

    استراتژی

• cacheName

  رشته

• fetchOptions

  RequestInit اختیاری است

• matchOptions

  CacheQueryOptions اختیاری است

• پلاگین ها

  افزونه Workbox []

• _awaitکامل

  خالی

  تابع _awaitComplete به نظر می رسد:

  (responseDone: Promise<Response>,handler: StrategyHandler,request: Request,event: ExtendableEvent)=> {...}

  • پاسخ انجام شد

    قول<پاسخ>

  • کنترل کننده

    Strategy Handler

  • درخواست

    درخواست

  • رویداد

    ExtendableEvent

  • برمی گرداند

    قول<باطل>

• _getResponse

  خالی

  تابع _getResponse به نظر می رسد:

  (handler: StrategyHandler,request: Request,event: ExtendableEvent)=> {...}

  • کنترل کننده

    Strategy Handler

  • درخواست

    درخواست

  • رویداد

    ExtendableEvent

  • برمی گرداند

    قول<پاسخ>

• _رسیدگی

  خالی

  تابع _handle به نظر می رسد:

  (request: Request,handler: StrategyHandler)=> {...}

  • درخواست

    درخواست

  • کنترل کننده

    Strategy Handler

  • برمی گرداند

    قول<پاسخ>

• رسیدگی

  خالی

  یک استراتژی درخواست را اجرا کنید و یک 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 یا یک شی با ویژگی های ذکر شده در زیر.

  • برمی گرداند

    [Promise<Response>,Promise<void>]

    چندین وعده [پاسخ، انجام شد] که می تواند برای تعیین زمان حل شدن پاسخ و همچنین زمانی که کنترل کننده تمام کارهای خود را تکمیل کرده است، استفاده شود.

StrategyHandler

کلاسی ایجاد می‌شود که هر بار که یک نمونه Strategy workbox-strategies.Strategy~handle یا workbox-strategies.Strategy~handleAll که تمام اقدامات واکشی و حافظه پنهان را در اطراف تماس‌های پلاگین می‌پیچد و زمان «انجام شدن» استراتژی را ردیابی می‌کند (یعنی همه موارد اضافه شده) event.waitUntil() وعده ها حل شده اند).

خواص

• سازنده

  خالی

  یک نمونه جدید مرتبط با استراتژی و رویدادی که درخواست را مدیریت می کند ایجاد می کند.

  سازنده همچنین حالتی را که به هر یک از پلاگین هایی که این درخواست را مدیریت می کنند ارسال می کند مقداردهی اولیه می کند.

  تابع constructor به نظر می رسد:

  (strategy: Strategy,options: HandlerCallbackOptions)=> {...}

  • استراتژی

    استراتژی

  • گزینه ها

    HandlerCallbackOptions

  • برمی گرداند

    Strategy Handler

• رویداد

  ExtendableEvent

• پارامترها

  هر اختیاری

• درخواست

  درخواست

• آدرس اینترنتی

  URL اختیاری است

• cacheMatch

  خالی

  با استفاده از cacheName ، matchOptions و plugins تعریف‌شده روی شی استراتژی، درخواستی را از حافظه پنهان مطابقت می‌دهد (و همه روش‌های مربوط به تماس پلاگین را فراخوانی می‌کند).

  روش‌های چرخه عمر افزونه زیر هنگام استفاده از این روش فراخوانی می‌شوند:

  • cacheKeyWillByUsed()
  • cachedResponseWillByUsed()

  تابع cacheMatch به نظر می رسد:

  (key: RequestInfo)=> {...}

  • کلید

    RequestInfo

    درخواست یا URL برای استفاده به عنوان کلید حافظه پنهان.

  • برمی گرداند

    قول<پاسخ>

    پاسخ منطبق، در صورت یافتن.

• cachePut

  خالی

  یک جفت درخواست/پاسخ را با استفاده از cacheName و plugins تعریف‌شده روی شی استراتژی، در حافظه پنهان قرار می‌دهد (و همه روش‌های برگشت تماس پلاگین قابل اجرا را فراخوانی می‌کند).

  روش‌های چرخه عمر افزونه زیر هنگام استفاده از این روش فراخوانی می‌شوند:

  • cacheKeyWillByUsed()
  • cacheWillUpdate()
  • cacheDidUpdate()

  تابع cachePut به نظر می رسد:

  (key: RequestInfo,response: Response)=> {...}

  • کلید

    RequestInfo

    درخواست یا URL برای استفاده به عنوان کلید حافظه پنهان.

  • واکنش

    واکنش

    پاسخ به حافظه پنهان

  • برمی گرداند

    وعده<boolean>

    اگر cacheWillUpdate باعث شود پاسخ در حافظه پنهان نشود false و در غیر این صورت true .

• از بین رفتن

  خالی

  اجرای استراتژی را متوقف می‌کند و فوراً هرگونه وعده‌های منتظر مانده waitUntil() را حل می‌کند.

  تابع destroy به نظر می رسد:

  ()=> {...}

• انجام شد در انتظار

  خالی

  قولی را برمی‌گرداند که پس از ارسال همه وعده‌ها به workbox-strategies.StrategyHandler~waitUntil حل شود.

  توجه: هر کاری که پس از تسویه حساب doneWaiting() انجام می شود، باید به صورت دستی به متد waitUntil() رویداد منتقل شود (نه متد waitUntil() این handler)، در غیر این صورت، سرویس worker thread my be kill قبل از تکمیل کار شما خواهد بود.

  تابع 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 [] اختیاری است