CacheStorage
Интерфейс CacheStorage
представляет собой хранилище для объектов Cache
. Он предоставляет главную директорию всех именованных кешей, к которым могут получить доступ ServiceWorker
, другие типы воркеров или window
(вы не обязаны использовать их с service workers, даже если существует спецификация, определяющая это) и поддерживает отображение строковых имён соответствующих объектов Cache
.
CacheStorage
также позволяет вызвать CacheStorage.open()
и CacheStorage.match()
. Используйте CacheStorage.open()
для получения экземпляров Cache
. Используйте CacheStorage.match()
для проверки того, является ли данный Request
ключом в любом из объектов Cache
, отслеживаемых объектом CacheStorage
.
Вы можете получить доступ к CacheStorage
через глобальное свойство caches
.
Примечание:
CacheStorage всегда возвращает отказ с SecurityError
для ненадёжных источников (т.e. тех, что не используют HTTPS, хотя это утверждение, вероятно, станет более общим в будущем). При тестировании это можно обойти, установив опцию "Enable Service Workers over HTTP (when toolbox is open)" в меню Firefox Devtools options/gear.
Примечание:
Подобная функциональность сопоставления записей кеша может быть реализована путём открытия вашего кеша с помощью CacheStorage.open()
, возвращения записей, в ней содержащихся, через CacheStorage.keys()
и сравнения необходимой CacheStorage.match()
.
Методы
CacheStorage.match()
-
Проверяет, является ли данный
Request
ключом в любом из объектовCache
, отслеживаемых объектомCacheStorage
, и возвращаетPromise
, который успешно завершится, когда найдёт совпадение. CacheStorage.has()
-
Возвращает
Promise
, который успешно завершится и вернётtrue,
если объектCache
содержит кеш с установленнымcacheName
. CacheStorage.open()
-
Возвращает
Promise
, который успешно завершится, когда объектCache
найдёт необходимый объект сcacheName
(если такого нет, то создаст новый). CacheStorage.delete()
-
Находит объект
Cache
, соответствующийcacheName
, и, если такой обнаружен, удаляет объектCache
и возвращаетPromise
, завершающийся сtrue
. Если объектCache
не найдёт, то возвращаетсяfalse
. CacheStorage.keys()
-
Возвращает
Promise
, который вернёт массив, содержащий строки, соответствующие всем именованным объектамCache
, отслеживаемымCacheStorage
. Используйте этот метод для прохода по списку всех объектовCache
.
Примеры
Фрагмент кода взят с MDN sw-test example (смотри sw-test running live). Этот service worker ожидает старта события InstallEvent
, затем запускает waitUntil
для обработки процесса установки приложения. Он состоит из вызова CacheStorage.open
для создания нового кеша и затем использует Cache.addAll
для добавления к нему списка ресурсов.
Во втором блоке кода мы ждём запуска события FetchEvent
. Мы создаём встроенный ответ:
- Проверяем, был ли необходимый запрос найден в CacheStorage. Если да, выполняем его.
- Если нет, получаем запрос от сети, затем так же открываем кеш, созданный в первом блоке, и добавляем клон запроса в него, используя
Cache.put
(cache.put(event.request, response.clone())
.) - Если произошла ошибка (например, из-за отсутствия подключения), возвращаем ответ с отказом.
Наконец, возвращаем ответ, был ли встроенный запрос в итоге равнозначным, используя FetchEvent.respondWith
.
this.addEventListener("install", function (event) {
event.waitUntil(
caches.open("v1").then(function (cache) {
return cache.addAll([
"/sw-test/",
"/sw-test/index.html",
"/sw-test/style.css",
"/sw-test/app.js",
"/sw-test/image-list.js",
"/sw-test/star-wars-logo.jpg",
"/sw-test/gallery/bountyHunters.jpg",
"/sw-test/gallery/myLittleVader.jpg",
"/sw-test/gallery/snowTroopers.jpg",
]);
}),
);
});
this.addEventListener("fetch", function (event) {
var response;
event.respondWith(
caches
.match(event.request)
.catch(function () {
return fetch(event.request);
})
.then(function (r) {
response = r;
caches.open("v1").then(function (cache) {
cache.put(event.request, response);
});
return response.clone();
})
.catch(function () {
return caches.match("/sw-test/gallery/myLittleVader.jpg");
}),
);
});
Спецификации
Specification |
---|
Service Workers # cachestorage-interface |
Совместимость с браузерами
BCD tables only load in the browser