Workbox предоставляет мощные инструменты для управления кэшированием ресурсов, включая авторизационные данные и защищённые API-запросы. При работе с авторизационными ресурсами важно учитывать их ограниченный срок жизни и необходимость своевременного обновления или удаления устаревших данных из кэша.
Основной инструмент — ExpirationPlugin,
который позволяет ограничивать количество записей в кэше и устанавливать
максимальное время хранения (maxAgeSeconds) для каждого
ресурса. Для авторизационных токенов и защищённых данных это критично,
так как устаревшие токены могут привести к ошибкам авторизации или
угрозе безопасности.
Пример настройки кэширования для авторизационного API:
import { registerRoute } from 'workbox-routing';
import { NetworkFirst } from 'workbox-strategies';
import { ExpirationPlugin } from 'workbox-expiration';
registerRoute(
({ url }) => url.pathname.startsWith('/api/auth/'),
new NetworkFirst({
cacheName: 'auth-cache',
plugins: [
new ExpirationPlugin({
maxAgeSeconds: 300, // 5 минут
purgeOnQuotaError: true
})
]
})
);
maxAgeSeconds задаёт время хранения
ресурса в секундах.purgeOnQuotaError автоматически
очищает кэш при нехватке места на устройстве.Использование стратегии NetworkFirst гарантирует, что
всегда будет попытка получить свежие данные с сервера, что критично для
авторизационных ресурсов.
Workbox позволяет автоматически удалять устаревшие записи через
ExpirationPlugin. Важно учитывать, что кэшированные токены
и сессии не должны храниться дольше их срока действия. Это минимизирует
риск использования просроченных токенов:
new ExpirationPlugin({
maxAgeSeconds: 600, // 10 минут для короткоживущих токенов
maxEntries: 50, // ограничение количества сохранённых токенов
purgeOnQuotaError: true
});
maxEntries контролирует количество
объектов в кэше, предотвращая переполнение и снижая риск хранения
устаревших данных.По умолчанию Workbox ориентирован на GET-запросы, однако
авторизационные ресурсы часто требуют POST-запросы с токенами в
заголовках. Для таких случаев необходимо использовать стратегию
NetworkOnly с явной очисткой кэша при истечении срока
действия токена:
import { NetworkOnly } from 'workbox-strategies';
registerRoute(
({ url, request }) => url.pathname.startsWith('/api/auth/') && request.method === 'POST',
new NetworkOnly({
plugins: [
{
fetchDidSucceed: async ({ request, response }) => {
const clonedResponse = response.clone();
// Здесь можно обновлять внутренние кэши или локальное хранилище
return clonedResponse;
}
}
]
})
);
NetworkOnly гарантирует отсутствие
кэширования устаревших данных.response.clone()) позволяет
безопасно обработать данные для локального хранения или аналитики без
вмешательства в оригинальный поток ответа.Для токенов с коротким сроком жизни рекомендуется хранить их только
во внутреннем кэше Workbox с ограничением по времени
(maxAgeSeconds) и автоматическим удалением после истечения
срока действия. Это снижает риск утечки и обеспечивает согласованность
данных между клиентом и сервером.
const authCachePlugin = new ExpirationPlugin({
maxAgeSeconds: 300, // 5 минут
purgeOnQuotaError: true
});
registerRoute(
({ url }) => url.pathname.startsWith('/api/token/refresh'),
new NetworkFirst({
cacheName: 'token-cache',
plugins: [authCachePlugin]
})
);
Использование отдельного кэша для токенов (token-cache)
позволяет разделить ресурсы по уровням безопасности и избежать
случайного использования общих данных.
maxAgeSeconds) для всех токенов и защищённых данных.purgeOnQuotaError и ExpirationPlugin.NetworkFirst или
NetworkOnly для критичных ресурсов с ограниченным сроком
действия.Workbox позволяет отслеживать устаревшие ресурсы и инициировать их обновление. Для авторизационных данных можно настроить периодическую проверку их валидности и удаление устаревших токенов из кэша, что повышает безопасность и стабильность приложения.