查看来自service worker的请求是否成功

Seeing if a request succeeds from within a service worker

本文关键字:请求 是否 成功 worker service      更新时间:2023-09-26

我的service worker中有以下代码:

self.addEventListener('fetch', function (event) {
  var fetchPromise = fetch(event.request);
  fetchPromise.then(function () {
    // do something here
  });
  event.respondWith(fetchPromise);
});

然而,它在开发控制台中做了一些奇怪的事情,似乎使脚本异步加载而不是同步加载(在这种情况下是坏的)。

是否有任何方法可以在不手动调用fetch(event.request)的情况下侦听请求何时完成?

例如:

// This doesn't work
self.addEventListener('fetch', function (event) {
  event.request.then(function () {
    // do something here
  });
});

如果你想确保在响应返回到页面之前执行整个系列的操作,你应该响应整个承诺链,而不仅仅是fetch返回的初始承诺。

self.addEventListener('fetch', function(event) {
  event.respondWith(fetch(event.request).then(function(response) {
    // The fetch() is complete and response is available now.
    // response.ok will be true if the HTTP response code is 2xx
    // Make sure you return response at the end!
    return response;
  }).catch(function(error) {
    // This will be triggered if the initial fetch() fails,
    // e.g. due to network connectivity. Or if you throw an exception
    // elsewhere in your promise chain.
    return error;
  }));
});