小编Awo*_*wol的帖子

我在 chrome 上使用 service worker 来缓存网络响应。当客户请求资源时我打算做什么：

检查缓存 - 如果存在，从缓存返回，但如果文件与缓存版本不同，也会向服务器发送请求并更新缓存。如果缓存没有它，向服务器发送一个请求，然后缓存响应。

这是我当前用于执行相同操作的代码：

self.addEventListener('fetch', function (event) {
    var requestURL = new URL(event.request.url);
    var freshResource = fetch(event.request).then(function (response) {
        if (response.ok && requestURL.origin === location.origin) {
            // All good? Update the cache with the network response
            caches.open(CACHE_NAME).then(function (cache) {
                cache.put(event.request, response);
            });
        }
        // Return the clone as the response would be consumed while caching it
        return response.clone();
    });
    var cachedResource = caches.open(CACHE_NAME).then(function (cache) {
        return cache.match(event.request);
    });
    event.respondWith(cachedResource.catch(function () {
        return freshResource;
    })); …