Я создал веб-приложение с @ vue / cli-plugin-pwa и использую плагин workbox-webpack-plugin в моем сервис-воркере. js для предварительного кэширования маршрутов из моего веб-пакета. Это отлично работает с:
// in service-worker.js...
// Precache
workbox.precaching.precacheAndRoute(self.__precacheManifest)
// Cache routes
workbox.routing.registerNavigationRoute(workbox.precaching.getCacheKeyForURL('/index.html'),
{
whitelist: [/./
],
blacklist: [
/(api|precache-manifest)/
]
}
)
... Но как мне ad ho c добавлять новые файлы в мой кеш? Если мой пользователь подписывается на серию статей, я хотел бы добавить изображения в мой кеш в фоновом режиме, чтобы пользователю не приходилось ждать загрузки при первом открытии статьи
У меня есть пробовал что-то вроде ...
// in app code...
const cache = await caches.open('cachename')
await cache.add('/path/to/file.ext')
Но даже если файл добавляется в кеш, я не могу заставить сервис-воркера понять это и перехватить будущие выборки, чтобы обслуживать их из кеша. Я понимаю, что это должно быть перехвачено в сервис-воркере, но этот Workbox делает это под капотом, и простой eventListener добавлен в сервис-воркер. js конфликтует с Workbox.
Кто-нибудь может мне объяснить какова наилучшая практика для этого специального c сценария добавления в кеш?