Я наткнулся на проблему, с которой борюсь уже два дня, и не могу заставить ее работать.
Я пытаюсь предварительно кэшировать несколько вызовов API, используя плагин Google Workbox для сервисного работника.
Мой код выглядит так:
workbox.skipWaiting();
workbox.clientsClaim();
const precacheController = new workbox.precaching.PrecacheController();
self.addEventListener("install", event => {
const assetsLoaded = fetch("http://localhost:8000/pages")
.then(response => response.json())
.then(response => {
let pagesList = response.map(
page =>
`http://localhost:8000/pages?slug=${page.slug}`
);
pagesList.push("http://localhost:8000/frontpage");
precacheController.addToCacheList(pagesList);
})
.then(() => {
precacheController.install();
});
event.waitUntil(assetsLoaded);
});
self.__precacheManifest = [].concat(self.__precacheManifest || []);
workbox.precaching.suppressWarnings();
workbox.precaching.precacheAndRoute(self.__precacheManifest, {});
Он основан на коде, показанном в этом потоке: Сервисный работник добавляет файлы из Вызов API для предварительного кэширования
В инспекторе я вижу, что эти запросы выполняются и хранятся в workbox-precache-http://localhost:3001/-temp кеше. Но параллельно этому кешу я вижу, что создается workbox-precache-http://localhost:3001/ кеша, который пустой.
Кроме того, в workbox-precache-http://localhost:3001/-temp я вижу, что каждый кешированный ответ имеет Content-Length: 0. Не знаю почему, но это может быть подсказкой. Хотя, когда я смотрю на данный ответ, я вижу его полное содержание в инспекторе...
Когда я пытаюсь сделать какой-либо вызов API, который должен быть предварительно кэширован, он не будет использовать кешированный ответ, а вместо этого сделает новый запрос. В автономном режиме это вызывает ошибку.
Моя цель - сохранить эти запросы в кеше, чтобы пользователь мог просматривать всю страницу в автономном режиме.
Что я делаю не так?
