CacheStorage.open()

实验性: 这是一项实验性技术
在将其用于生产之前，请仔细检查浏览器兼容性表格。

CacheStorage 接口的 open() 方法返回一个 resolve 为匹配 cacheName 的 Cache 对象的 Promise .

备注： 如果指定的 Cache 不存在，则使用该 cacheName 创建一个新的 cache，并返回一个 resolve 为该新 Cache 对象的Promise.

语法

js

// "caches" is a global read-only variable, which is an instance of CacheStorage,
// For more info, refer to: https://developer.mozilla.org/zh-CN/docs/Web/API/caches

caches.open(cacheName).then(function (cache) {
  // Do something with your cache
});

参数

cacheName

要打开的 cache 对象 name.

返回值

一个 resolve 为请求的 Cache 对象的 Promise .

示例

此示例来自于 MDN sw-test example （请参阅 sw-test running live）。这里，等待 FetchEvent 事件触发。我们构建自定义响应，像这样：

  1. 使用 CacheStorage.match() 检查 CacheStorage 中是否存在匹配请求，如果存在，则使用它。
  2. 如果没有，使用 CacheStorage.open() 打开 v1 cache，使用 Cache.put() 将默认网络请求放入 cache 中，并使用 return response.clone() 返回默认网络请求的克隆副本。最后一个是必须的，因为 put() 使用响应主体。
  3. 如果此操作失败（例如，因为网络已关闭），则返回备用响应。

js

var cachedResponse = caches
  .match(event.request)
  .catch(function () {
    return fetch(event.request);
  })
  .then(function (response) {
    caches.open("v1").then(function (cache) {
      cache.put(event.request, response);
    });
    return response.clone();
  })
  .catch(function () {
    return caches.match("/sw-test/gallery/myLittleVader.jpg");
  });

规范

Specification
Service Workers
# cache-storage-open

浏览器兼容性

BCD tables only load in the browser

See also