We're looking for a user researcher to understand the needs of developers and designers. Is this you or someone you know? Check out the post: https://mzl.la/2IGzdXS

这篇翻译不完整。请帮忙从英语翻译这篇文章

这是一个实验中的功能
此功能某些浏览器尚在开发中,请参考浏览器兼容性表格以得到在不同浏览器中适合使用的前缀。由于该功能对应的标准文档可能被重新修订,所以在未来版本的浏览器中该功能的语法和行为可能随之改变。

Cache接口的 add()方法接受一个URL作为参数,请求参数指定的URL,并将返回的response对象添加到给定的cache中。 add() 方法在功能上等同于以下代码:

fetch(url).then(function (response) {
  if (!response.ok) {
    throw new TypeError('bad response status');
  }
  return cache.put(url, response);
})

对于更复杂的操作,您可以直接使用Cache.put()这个API。

注意: add() 将会覆盖之前存储在cache中与request匹配的任何key/value对。

注意: 之前的Cache  (Blink 和 Gecko内核版本) 在实现Cache.add, Cache.addAll, 和 Cache.put 的策略是在response结果完全写入缓存后才会resolve当前的promise。更新后的规范版本中一旦条目被记录到数据库就会resolve当前的promise,即使当前response结果还在传输中。

语法

cache.add(request).then(function() {
  //request has been added to the cache
});

参数

request
要添加到cache的request。它可以是一个 Request 对象,也可以是 URL。

返回值

void返回值的 Promise 

Exceptions

Exception Happens when
TypeError

URL的协议不是 http 或 https。

请求返回的http状态码不是2xx (不是一个成功的响应) 。这种情况常常发生在请求不成功,或者是一个没有配置CORS的跨域请求(这种情况下返回的状态码永远是0)。

示例

下面的代码块等待 InstallEvent 事件触发,然后运行 waitUntil 来处理该应用程序的安装过程。 包括调用 CacheStorage.open 来创建一个新的缓存,然后使用 Cache.add 来添加一个请求资源到该缓存。

this.addEventListener('install', function(event) {
  event.waitUntil(
    caches.open('v1').then(function(cache) {
      return cache.add('/sw-test/index.html');
    })
  );
});

规范

Specification Status Comment
Service Workers
Cache
Working Draft Initial definition.

浏览器兼容性

We're converting our compatibility data into a machine-readable JSON format. This compatibility table still uses the old format, because we haven't yet converted the data it contains. Find out how you can help!

Feature Chrome Firefox (Gecko) Internet Explorer Opera Safari (WebKit)
Basic support 46.0 (Yes)[1] 未实现 24 未实现
Require HTTPS 46.0 (Yes)[1] ? ? ?
TypeError if request is not successful (Yes) 47.0 (47.0)[1] (Yes) (Yes) (Yes)
Feature Android Android Webview Firefox Mobile (Gecko) Firefox OS IE Mobile Opera Mobile Safari Mobile Chrome for Android
Basic support 未实现 未实现 (Yes) ? 未实现 ? 未实现 46.0
Require HTTPS 未实现 未实现 (Yes) ? ? ? ? 46.0
TypeError if request is not successful (Yes) (Yes) (Yes) (Yes) (Yes) (Yes) (Yes) (Yes)

[1] Service workers (and Push) have been disabled in the Firefox 45 & 52 Extended Support Releases (ESR.)

参见

文档标签和贡献者

此页面的贡献者: chalecao, flyingsouthwind
最后编辑者: chalecao,