如何知道 Event.respondWith 已经完成（Event.respondWith() 的回调答案

【问题标题】：How to know that Event.respondWith has finished(callback for Event.respondWith()如何知道 Event.respondWith 已经完成（Event.respondWith() 的回调
【发布时间】：2016-03-22 22:57:07
【问题描述】：

目前我在 ServiceWorker 中有一个逻辑，我需要在 Service Worker 中检查特定 event.respondWith() 是否完成，只有在那之后我才需要删除缓存。有什么方法可以知道。我检查 event.respondWith() 没有 then() 或回调。

【问题讨论】：

你能澄清一下这个问题吗？
基本上我想知道我是否可以为 event.respondWith() 提供回调函数，如何从 serviceworker 知道请求已完成？

标签： service-worker fetch-api

【解决方案1】：

如果您的缓存清理独立于用于履行传递给event.respondWith() 的承诺的Response，那么您可以（可能）在fetch 事件处理程序中异步启动它，而不必担心@ 987654324@ 已完成。例如，如果您想在缓存的大小超过 N 个条目时清理缓存，就会出现这种情况。

如果您的缓存清理特定于用于实现 Promise 的 Response，那么您将需要将逻辑插入到 Promise 链中，并确保通过使用有效值来结束链Response。我假设您可以控制fetch 事件处理程序并且可以做到这一点。这是一种通用（未经测试）的方法：

self.addEventListner('fetch', event => {
  const p = promiseThatFulfillsWithResponse(); // Your logic goes here.

  event.respondWith(p.then(response => {
    return caches.open('my-cache-name')
      .then(cache => cache.delete(event.request)) // Or whatever you want to delete.
      .then(() => response); // Return response at the end of the chain!
  });
});

您不想在 Promise 链中做太多事情，因为您所做的一切都会延迟 Response 被传递到受控页面。

【讨论】：

您也可以在const p 之后执行p.then(_ => { deleteTheCache(); })，然后只需event.respondWith(p)。