hết hạn hộp làm việc

Thông thường, bạn muốn đặt các quy tắc hạn chế đối với bộ nhớ đệm về thời gian lưu trữ các mục trong bộ nhớ đệm hoặc số lượng mục cần lưu trữ trong bộ nhớ đệm. Workbox cung cấp chức năng này thông qua trình bổ trợ workbox-expiration cho phép bạn giới hạn số lượng mục nhập trong bộ nhớ đệm và / hoặc xoá các mục nhập đã được lưu vào bộ nhớ đệm trong một khoảng thời gian dài.

Hạn chế số lượng mục nhập bộ nhớ đệm

Để hạn chế số lượng mục được lưu trữ trong bộ nhớ đệm, bạn có thể sử dụng tuỳ chọn maxEntries như sau:

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({
        maxEntries: 20,
      }),
    ],
  })
);

Khi đó, Trình bổ trợ sẽ được thêm vào tuyến này. Sau khi sử dụng một phản hồi được lưu vào bộ nhớ đệm hoặc thêm một yêu cầu mới vào bộ nhớ đệm, trình bổ trợ sẽ xem xét bộ nhớ đệm đã định cấu hình và đảm bảo rằng số mục được lưu vào bộ nhớ đệm không vượt quá giới hạn. Nếu có, các mục cũ nhất sẽ bị xoá.

Hạn chế thời gian lưu các mục vào bộ nhớ đệm

Để hạn chế thời gian lưu một yêu cầu vào bộ nhớ đệm, bạn có thể xác định thời gian tối đa tính bằng giây bằng cách sử dụng tuỳ chọn maxAgeSeconds như sau:

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({
        maxAgeSeconds: 24 * 60 * 60,
      }),
    ],
  })
);

Trình bổ trợ sẽ kiểm tra và xoá các mục sau mỗi yêu cầu hoặc bản cập nhật bộ nhớ đệm.

Lưu ý:Vì việc mở IndexedDB diễn ra chậm, nên thời gian hết hạn sẽ không xảy ra cho đến sau khi yêu cầu được sử dụng. Điều này có nghĩa là bạn có thể sử dụng một yêu cầu đã hết hạn một lần, nhưng yêu cầu đó sẽ hết hạn sau đó. Để giảm thiểu vấn đề này, trình bổ trợ sẽ kiểm tra tiêu đề Date của phản hồi được lưu vào bộ nhớ đệm (nếu có và có thể phân tích cú pháp ngày). Tiêu đề này sẽ hết hạn dựa trên ngày này vì không yêu cầu tra cứu IndexedDB.

Cách sử dụng nâng cao

Nếu muốn sử dụng logic hết hạn tách biệt với mọi mô-đun Workbox khác, bạn có thể thực hiện việc này bằng lớp CacheExpiration.

Để áp dụng các quy tắc hạn chế cho bộ nhớ đệm, bạn sẽ tạo một thực thể của CacheExpiration cho bộ nhớ đệm mà bạn muốn kiểm soát như sau:

import {CacheExpiration} from 'workbox-expiration';

const cacheName = 'my-cache';
const expirationManager = new CacheExpiration(cacheName, {
  maxAgeSeconds: 24 * 60 * 60,
  maxEntries: 20,
});

Bất cứ khi nào cập nhật một mục trong bộ nhớ đệm, bạn cần gọi phương thức updateTimestamp() để cập nhật thời gian của mục đó.

await openCache.put(request, response);

await expirationManager.updateTimestamp(request.url);

Sau đó, bất cứ khi nào muốn hết hạn một tập hợp các mục nhập, bạn có thể gọi phương thức expireEntries(). Phương thức này sẽ thực thi cấu hình maxAgeSeconds và maxEntries.

await expirationManager.expireEntries();

Loại

CacheExpiration

Lớp CacheExpiration cho phép bạn xác định thời gian hết hạn và / hoặc giới hạn về số lượng phản hồi được lưu trữ trong Cache.

Thuộc tính

• hàm khởi tạo

  void

  Để tạo một thực thể CacheExpiration mới, bạn phải cung cấp ít nhất một trong các thuộc tính config.

  Hàm constructor có dạng như sau:

  (cacheName: string, config?: CacheExpirationConfig) => {...}

  • cacheName

    chuỗi

    Tên của bộ nhớ đệm cần áp dụng các quy định hạn chế.

  • config

    CacheExpirationConfig không bắt buộc

  • returns

    CacheExpiration

• xóa

  void

  Xoá kho đối tượng IndexedDB dùng để theo dõi siêu dữ liệu về thời gian hết hạn của bộ nhớ đệm.

  Hàm delete có dạng như sau:

  () => {...}

  • returns

    Promise<void>

• expireEntries

  void

  Hết hạn các mục nhập cho bộ nhớ đệm và tiêu chí đã cho.

  Hàm expireEntries có dạng như sau:

  () => {...}

  • returns

    Promise<void>

• isURLExpired

  void

  Có thể dùng để kiểm tra xem một URL có hết hạn hay chưa trước khi sử dụng.

  Quá trình này yêu cầu tra cứu từ IndexedDB, vì vậy có thể bị chậm.

  Lưu ý: Phương thức này sẽ không xoá mục nhập đã lưu vào bộ nhớ đệm, hãy gọi expireEntries() để xoá mục nhập indexedDB và bộ nhớ đệm.

  Hàm isURLExpired có dạng như sau:

  (url: string) => {...}

  • url

    chuỗi

  • returns

    Promise<boolean>

• updateTimestamp

  void

  Cập nhật dấu thời gian cho URL đã cho. Điều này đảm bảo rằng khi xoá các mục nhập dựa trên số mục nhập tối đa, mục nhập được sử dụng gần đây nhất là chính xác hoặc khi hết hạn, dấu thời gian là mới nhất.

  Hàm updateTimestamp có dạng như sau:

  (url: string) => {...}

  • url

    chuỗi

  • returns

    Promise<void>

ExpirationPlugin

Bạn có thể sử dụng trình bổ trợ này trong workbox-strategy để thường xuyên thực thi giới hạn về thời gian và / hoặc số lượng yêu cầu được lưu vào bộ nhớ đệm.

Bạn chỉ có thể sử dụng phương thức này với các thực thể workbox-strategy có thuộc tính cacheName tuỳ chỉnh được đặt. Nói cách khác, bạn không thể dùng tên này để hết hạn các mục trong chiến lược sử dụng tên bộ nhớ đệm thời gian chạy mặc định.

Bất cứ khi nào một phản hồi được lưu vào bộ nhớ đệm được sử dụng hoặc cập nhật, trình bổ trợ này sẽ xem xét bộ nhớ đệm liên quan và xoá mọi phản hồi cũ hoặc thừa.

Khi sử dụng maxAgeSeconds, bạn có thể sử dụng phản hồi một lần sau khi hết hạn vì quá trình dọn dẹp khi hết hạn sẽ không diễn ra cho đến sau khi phản hồi đã lưu vào bộ nhớ đệm được sử dụng. Nếu phản hồi có tiêu đề "Ngày", thì hệ thống sẽ thực hiện một quy trình kiểm tra thời gian hết hạn nhẹ và phản hồi sẽ không được sử dụng ngay lập tức.

Khi sử dụng maxEntries, mục nhập được yêu cầu gần đây nhất sẽ được xoá khỏi bộ nhớ đệm trước tiên.

Thuộc tính

• hàm khởi tạo

  void

  Hàm constructor có dạng như sau:

  (config?: ExpirationPluginOptions) => {...}

  • config

    ExpirationPluginOptions không bắt buộc

  • returns

    ExpirationPlugin

• deleteCacheAndMetadata

  void

  Đây là một phương thức trợ giúp thực hiện hai thao tác:

  • Xoá tất cả các thực thể bộ nhớ đệm cơ bản liên kết với thực thể trình bổ trợ này, bằng cách thay mặt bạn gọi caches.delete().
  • Xoá siêu dữ liệu khỏi IndexedDB dùng để theo dõi thông tin chi tiết về thời gian hết hạn cho từng thực thể Bộ nhớ đệm.

  Khi sử dụng thời gian hết hạn bộ nhớ đệm, bạn nên gọi phương thức này thay vì gọi trực tiếp caches.delete(), vì điều này sẽ đảm bảo rằng siêu dữ liệu IndexedDB cũng được xoá sạch và các thực thể IndexedDB đang mở sẽ bị xoá.

  Xin lưu ý rằng nếu bạn không sử dụng thời gian hết hạn bộ nhớ đệm cho một bộ nhớ đệm nhất định, thì bạn chỉ cần gọi caches.delete() và truyền tên của bộ nhớ đệm vào là đủ. Trong trường hợp đó, bạn không cần sử dụng phương thức dành riêng cho Workbox để dọn dẹp.

  Hàm deleteCacheAndMetadata có dạng như sau:

  () => {...}

  • returns

    Promise<void>

ExpirationPluginOptions

Thuộc tính

• matchOptions

  CacheQueryOptions không bắt buộc

• maxAgeSeconds

  số không bắt buộc

• maxEntries

  số không bắt buộc

• purgeOnQuotaError

  boolean không bắt buộc