MDN’s new design is in Beta! A sneak peek: https://blog.mozilla.org/opendesign/mdns-new-design-beta/

Перевод не завершен. Пожалуйста, помогите перевести эту статью с английского.

Это экспериментальная технология
Так как спецификация этой технологии ещё не стабилизировалась, смотрите таблицу совместимости по поводу использования в различных браузерах. Также заметьте, что синтаксис и поведение экспериментальной технологии может измениться в будущих версиях браузеров, вслед за изменениями спецификации.

Интерфейс 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.match() удобный метод. Подобный функционал сопоставления записей кеша может быть реализован путем открытия вашего кеша с помощью 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. Мы создаем встроенный ответ:

  1. Проверяем, был ли необходимый запрос найден в CacheStorage. Если да, выполняем его.
  2. Если нет, получаем запрос от сети, затем так же открываем кеш, созданный в первом блоке, и добавляем клон запроса в него, используя Cache.put (cache.put(event.request, response.clone()).)
  3. Если произошла ошибка (например, из-за отсутствия подключения), возвращаем ответ с отказом.

Наконец, возвращаем ответ, был ли встроенный запрос в итоге равнозначным, используя 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');
  }));
});

Спецификации

Спецификация Статус Комментарий
Service Workers
Определение 'CacheStorage' в этой спецификации.
Рабочий черновик Начальное определение.

Поддержка браузерами

Функционал Chrome Firefox (Gecko) Internet Explorer Opera Safari
Базовая поддержка 40.0 44 (44)[1] Нет ? Нет
Доступ через Window 43.0 44 (44)[1] ? ? ?
Доступ через WorkerGlobalScope 43.0 44 (44)[1] ? ? ?
Функционал Android Android Webview Firefox Mobile (Gecko) IE Mobile Opera Mobile Safari Mobile Chrome for Android
Базовая поддержка Нет Нет 44.0 (44) (Да) (Да) (Да) 40.0
Доступ через Window Нет Нет 44.0 (44) ? ? ? 43.0
Доступ через WorkerGlobalScope Нет Нет 44.0 (44) ? ? ? 43.0

[1] Сервисные воркеры (и Push) были отключены в Firefox 45 Extended Support Release (ESR.)

Смотри также

Метки документа и участники

 Внесли вклад в эту страницу: zhrivodkin, z56, curdwithraisins, yujianrong@gmail.com
 Обновлялась последний раз: zhrivodkin,