Request: thuộc tính cache

// Tải một tài nguyên với cache busting để bỏ qua cache hoàn toàn.
fetch("some.json", { cache: "no-store" }).then((response) => {
  /* xử lý response */
});

// Tải một tài nguyên với cache busting, nhưng cập nhật HTTP cache
// bằng tài nguyên vừa tải.
fetch("some.json", { cache: "reload" }).then((response) => {
  /* xử lý response */
});

// Tải một tài nguyên với cache busting khi làm việc với
// một máy chủ được cấu hình đúng, gửi ETag và Date chính xác
// và xử lý đúng If-Modified-Since và If-None-Match,
// nhờ đó có thể dựa vào xác thực để đảm bảo phản hồi mới.
fetch("some.json", { cache: "no-cache" }).then((response) => {
  /* xử lý response */
});

// Tải một tài nguyên với tư duy tiết kiệm! Ưu tiên phản hồi
// đã cache dù hơi cũ để tiết kiệm băng thông tối đa.
fetch("some.json", { cache: "force-cache" }).then((response) => {
  /* xử lý response */
});

// Triển khai stale-while-revalidate ở cấp client một cách đơn giản.
// Ưu tiên phản hồi đã cache, dù hơi cũ; nhưng cập nhật nếu nó đã quá cũ.
// AbortController và signal giúp dọn bộ nhớ tốt hơn.
// Trên thực tế, đây sẽ là một hàm nhận đường dẫn và một tham chiếu
// đến controller vì nó cần thay đổi giá trị
let controller = new AbortController();
fetch("some.json", {
  cache: "only-if-cached",
  mode: "same-origin",
  signal: controller.signal,
})
  .catch((e) =>
    e instanceof TypeError && e.message === "Failed to fetch"
      ? { status: 504 } // Cách xử lý cho chrome; nơi này trả về TypeError
      : Promise.reject(e),
  )
  .then((res) => {
    if (res.status === 504) {
      controller.abort();
      controller = new AbortController();
      return fetch("some.json", {
        cache: "force-cache",
        mode: "same-origin",
        signal: controller.signal,
      });
    }
    const date = res.headers.get("date"),
      dt = date ? new Date(date).getTime() : 0;
    if (dt < Date.now() - 86_400_000) {
      // nếu cũ hơn 24 giờ
      controller.abort();
      controller = new AbortController();
      return fetch("some.json", {
        cache: "reload",
        mode: "same-origin",
        signal: controller.signal,
      });
    }

    // Các điều kiện khác có thể có
    if (dt < Date.now() - 300_000)
      // Nếu nó cũ hơn 5 phút
      fetch("some.json", { cache: "no-cache", mode: "same-origin" }); // không hủy và không có giá trị trả về.
    return res;
  })
  .then((response) => {
    /* xử lý response (có thể đã cũ) */
  })
  .catch((error) => {
    /* Có thể là AbortError/DOMException hoặc TypeError */
  });