Я создал базовую стратегию Workbox StaleWhileRevalidate для favicon , и она должна возвращать кэшированное значение в запросе, если сеть отключена. Работает частично. На самом деле он возвращает кэшированное значение только для 2 запросов, а другие запросы не выполняются. В консоли мы видим ошибки о необработанном исключении и не удалось получить . Мне интересно, как это возможно?
Обработчик сервисного работника.
self.addEventListener('fetch', (event) => {
console.log(5555); // basically works every time
if (event.request.url.indexOf('favicon.ico') !== -1) {
event.respondWith((async () => {
// Configure the strategy in advance.
const strategy = new workbox.strategies.StaleWhileRevalidate({cacheName: 'favicon-cache-v1'});
// Make two requests using the strategy.
// Because we're passing in event, event.waitUntil() will be called automatically.
return strategy.handle({event, request: event.request.url})
.catch(() => {
// it's never happens somehow (propably because it's always fetch from cache, but I'm not sure
console.log("WHOOOPSS, CATCH")
})
})());
}
});
Как видите, в консоли есть ошибки, связанные с извлечением Failed favicon. Но как это возможно? Workbox должен его перехватить, он напечатает отладочное сообщение '5555' и вернет кэшированный значок для всех запросов. Но он делает это только для 2 запросов, а другие запросы терпят неудачу. Почему это происходит? ![Console errors](https://i.stack.imgur.com/ztIJ3.png)
Chrome Сетевой отчет Devtool (сеть не подключена) ![network report](https://i.stack.imgur.com/ABSQB.png)