вложенная выборка для ответа у сервисного работника - PullRequest
0 голосов
/ 25 мая 2018

Я новичок в сфере обслуживания.Я учусь на Mobile Web Specialist , которую проводит Udacity, и для этого использую Google-Chrome.Я хочу получить ответ из сети, и если он возвращает 404 в качестве статуса, я получаю и другой ответ из сети.Это код для извлечения из сети только один раз.Этот код прекрасно работает:

self.addEventListener('fetch', function(event) {
  event.respondWith(
    fetch(event.request).then(function(response) {
      if (response.status === 404) {
        return new Response("Whoops, not found");
      }
      return response;
    }).catch(function() {
      return new Response("Uh oh, that totally failed!");
    })
  );
});

Я сделал некоторые обновления для этого кода, выдав ошибку после получения response.status === 404 и управляя ею так же, как try/catch.Обновленный код приведен ниже:

self.addEventListener('fetch', function(event) {
 try {
  event.respondWith(
    fetch(event.request).then(function(response) {
      if (response.status === 404) {
        throw (Error);
      }
      return response;
    }).catch(function() {
      return new Response("Uh oh, that totally failed!");
    })
  );
 } catch (Error) {
   event.respondWith(
    fetch('/imgs/dr-evil.gif').then(function(response) {
      if (response.status === 404) {
        return new Response('couldn\'t fetch twice');
      }
      return response;
    }).catch(function() {
      return new Response("Uh oh, that totally failed twice!");
    })
  );
 }
});

Я знаю, что есть лучший способ сделать вложенную выборку с помощью сервисного работника, но я хочу знать, что я здесь сделал неправильно.

1 Ответ

0 голосов
/ 25 мая 2018

Я не запускал это, так что, возможно, ему нужны некоторые настройки, но попробуйте что-то вроде этогоПроблема с вашим текущим кодом заключается в том, что цепочка обещаний при первом извлечении всегда разрешается в ответ.Либо в первом then, либо в первом catch, где вы возвращаете ответ "Uh oh, that totally failed!".event.respondWith принимает этот ответ и счастливо идет своим путем.

Внешний try/catch существует в синхронном пространстве, где при извлечении запускается асинхронная цепочка, поэтому для вашего кода не будет никакого путичтобы достичь внешнего улова, поскольку он не находится в контексте выполнения для выборки.

Если совместимость одинакова как для работника службы, так и для async / await (я не знаю), возможно, вы захотите взглянуть на это, так как это было бы гораздо более удобным способом структурирования вашего кода.

self.addEventListener('fetch', function(event) {
    event.respondWith(
        fetch(event.request).then(function(response) {
            if (response.status === 404) {
                throw (Error);
            }
            return response;
        }).catch(function() {
            return fetch('/imgs/dr-evil.gif').then(function(response) {
                if (response.status === 404) {
                    throw (Error);
                }
                return response;
            })
        }).catch(function() {
            return new Response("Uh oh, that totally failed twice!");
        })
    ); 
});
...