CacheStorage.match()

caches.match(request, options).then(function(response) {
  // Какие-либо действия с response
});

request

Request для поиска. Может быть объектом Request или строкой URL.

options Необязательный

Объект, свойства которого определяют, как проверяется совпадение в операции сопоставления. Доступны следующие варианты:

• ignoreSearch: Boolean свойство. Определяет, следует ли игнорировать параметры запроса в строке url или нет. Например, если установлено true, параметры ?value=bar запроса http://foo.com/?value=bar будут проигнорированы во время сопоставления. Значением по умолчанию является false.
• ignoreMethod: Boolean свойство. Когда установлено true, предотвращает проверку http метода запроса Request (обычно разрешены только GET и HEAD.) По умолчанию установлено false.
• ignoreVary: Boolean свойство, определяющее, следует ли выполнять проверку заголовка VARY. Если установлено true, совпадения будут найдены, независимо от того, имеет ли Response заголовок VARY или нет. По умолчанию установлено false.
• cacheName: Строка DOMString - имя кеша для поиска.

Метод возвращает Promise который разрешается совпавшим Response. Если ни одного совпадений не было найдено, promise разрешается с undefined.

Это пример из MDN sw-test example (см. sw-test running live). В данном примере, мы обрабатываем событие FetchEvent. Мы строим проверку ответа следующим образом:

1. Проверяем, совпадения для запроса в CacheStorage используя CacheStorage.match(). Если совпадение найдено, возвращаем response.
2. Если нет, открываем v1 объект кеша, используя метод open(), добавляем изначальный запрос в кеш используя Cache.put() и возвращаем клонированный объект запроса, используя return response.clone(). Это необходимо, потому что метод put() сохраняет в кеш тело запроса, изменяя, таким образом, изначальный запрос.
3. Если произошла какая-либо ошибка (например, из-за проблем с сетью), возвращаем резервный ответ.

caches
  .match(event.request)
  .then(function (response) {
    return (
      response ||
      fetch(event.request).then(function (r) {
        caches.open("v1").then(function (cache) {
          cache.put(event.request, r);
        });
        return r.clone();
      })
    );
  })
  .catch(function () {
    return caches.match("/sw-test/gallery/myLittleVader.jpg");
  });

• Использование Service Workers
• Cache
• self.caches