Cache: addAll() 方法

Baseline 已广泛支持

此功能已成熟,可跨多种设备和浏览器版本工作。它自 ⁨2018 年 4 月⁩ 起已在所有浏览器中可用。

安全上下文: 此功能仅在安全上下文(HTTPS)中可用,且支持此功能的浏览器数量有限。

注意:此功能在 Web Workers 中可用。

Cache 接口的 addAll() 方法接受一个 URL 数组,检索它们,并将结果响应对象添加到给定的缓存中。检索过程中创建的请求对象成为存储的响应操作的键。

注意: addAll() 会覆盖缓存中先前存储的与请求匹配的任何键/值对,但如果由此产生的 put() 操作会覆盖由同一个 addAll() 方法存储的先前缓存条目,则会失败。

语法

js
addAll(requests)

参数

requests

要添加到缓存的资源的请求数组。这些可以是 Request 对象或 URL。

这些请求用作 Request() 构造函数的参数,因此 URL 遵循与该构造函数相同的规则。特别是,URL 可以相对于基础 URL,在窗口上下文中是文档的 baseURI,在 worker 上下文中是 WorkerGlobalScope.location

返回值

一个 Promise,解析为 undefined

异常

TypeError

URL 方案不是 httphttps

Response 状态不在 200 范围内(即,不是成功的响应。)当请求未成功返回时会发生这种情况,但当请求是跨域无 CORS 请求时也会发生这种情况(在这种情况下,报告的状态始终为 0。)

示例

此代码块等待 InstallEvent 触发,然后运行 waitUntil() 来处理应用程序的安装过程。这包括调用 CacheStorage.open 来创建一个新的缓存,然后使用 addAll() 将一系列资源添加到其中。

js
this.addEventListener("install", (event) => {
  event.waitUntil(
    caches
      .open("v1")
      .then((cache) =>
        cache.addAll([
          "/",
          "/index.html",
          "/style.css",
          "/app.js",
          "/image-list.js",
          "/star-wars-logo.jpg",
          "/gallery/",
          "/gallery/bountyHunters.jpg",
          "/gallery/myLittleVader.jpg",
          "/gallery/snowTroopers.jpg",
        ]),
      ),
  );
});

规范

规范
Service Workers
# cache-addAll

浏览器兼容性

另见