From 074785cea106179cb3305637055ab0a009ca74f2 Mon Sep 17 00:00:00 2001 From: Peter Bengtsson Date: Tue, 8 Dec 2020 14:42:52 -0500 Subject: initial commit --- files/ru/web/api/cachestorage/index.html | 205 +++++++++++++++++++++++++ files/ru/web/api/cachestorage/match/index.html | 99 ++++++++++++ files/ru/web/api/cachestorage/open/index.html | 141 +++++++++++++++++ 3 files changed, 445 insertions(+) create mode 100644 files/ru/web/api/cachestorage/index.html create mode 100644 files/ru/web/api/cachestorage/match/index.html create mode 100644 files/ru/web/api/cachestorage/open/index.html (limited to 'files/ru/web/api/cachestorage') diff --git a/files/ru/web/api/cachestorage/index.html b/files/ru/web/api/cachestorage/index.html new file mode 100644 index 0000000000..76de523901 --- /dev/null +++ b/files/ru/web/api/cachestorage/index.html @@ -0,0 +1,205 @@ +--- +title: CacheStorage +slug: Web/API/CacheStorage +tags: + - API + - CacheStorage + - Experimental + - Interface + - NeedsTranslation + - Reference + - Service Workers + - ServiceWorker + - TopicStub +translation_of: Web/API/CacheStorage +--- +

{{APIRef("Service Workers API")}}{{SeeCompatTable}}

+ +

Интерфейс CacheStorage представляет собой хранилище для объектов {{domxref("Cache")}}. Он предоставляет главную директорию всех именованых кешей, к которым могут получить доступ {{domxref("ServiceWorker")}}, другие типы воркеров или {{domxref("window")}} (вы не обязаны использовать их с service workers, даже если существует спецификация, определяющая это) и поддерживает отображение строковых имен соответствующих объектов {{domxref("Cache")}}.

+ +

CacheStorage также позволяет вызвать {{domxref("CacheStorage.open()")}} и {{domxref("CacheStorage.match()")}}. Используйте {{domxref("CacheStorage.open()")}} для получения экземпляров {{domxref("Cache")}}. Используйте {{domxref("CacheStorage.match()")}} для проверки того, является ли данный {{domxref("Request")}} ключом в любом из объектов {{domxref("Cache")}}, отслеживаемых объектом CacheStorage.

+ +

Вы можете получить доступ к CacheStorage через глобальное свойство {{domxref("WorkerGlobalScope.caches", "caches")}}.

+ +
Заметка: CacheStorage всегда возвращает отказ с SecurityError для ненадежных источников (т.e. тех, что не используют HTTPS, хотя это утверждение, вероятно, станет более общим в будущем). При тестировании это можно обойти, установив опцию "Enable Service Workers over HTTP (when toolbox is open)" в меню Firefox Devtools options/gear.
+ +
Заметка: {{domxref("CacheStorage.match()")}} удобный метод. Подобный функционал сопоставления записей кеша может быть реализован путем открытия вашего кеша с помощью {{domxref("CacheStorage.open()")}}, возвращения записей, в ней содержащихся, через {{domxref("CacheStorage.keys()")}} и сравнения необходимой {{domxref("CacheStorage.match()")}}.
+ +

Методы

+ +
+
{{domxref("CacheStorage.match()")}}
+
Проверяет, является ли данный {{domxref("Request")}} ключом в любом из объектов {{domxref("Cache")}}, отслеживаемых объектом {{domxref("CacheStorage")}}, и возвращает {{jsxref("Promise")}}, который успешно завершится, когда найдет совпадение.
+
{{domxref("CacheStorage.has()")}}
+
Возвращает {{jsxref("Promise")}}, который успешно завершится и вернет true, если объект {{domxref("Cache")}} содержит кеш с установленным cacheName.
+
{{domxref("CacheStorage.open()")}}
+
Возвращает {{jsxref("Promise")}}, который успешно завершится, когда объект {{domxref("Cache")}} найдет необходимый объект с cacheName (если такого нет, то создаст новый).
+
{{domxref("CacheStorage.delete()")}}
+
Находит объект {{domxref("Cache")}}, соответствующий cacheName, и, если такой обнаружен, удаляет объект {{domxref("Cache")}} и возвращает {{jsxref("Promise")}}, завершающийся с true. Если объект {{domxref("Cache")}} не найдет, то возвращается false.
+
{{domxref("CacheStorage.keys()")}}
+
Возвращает {{jsxref("Promise")}}, который вернет массив, содержащий строки, соответствующие всем именованым объектам {{domxref("Cache")}}, отслеживаемым {{domxref("CacheStorage")}}. Используйте этот метод для прохода по списку всех объектов {{domxref("Cache")}}.
+
+ +

Примеры

+ +

Фрагмент кода взят с MDN sw-test example (смотри sw-test running live). Этот service worker ожидает старта события {{domxref("InstallEvent")}}, затем запускает {{domxref("ExtendableEvent.waitUntil","waitUntil")}} для обработки процесса установки приложения. Он состоит из вызова {{domxref("CacheStorage.open")}} для создания нового кеша и затем использует {{domxref("Cache.addAll")}} для добавления к нему списка ресурсов.

+ +

Во втором блоке кода мы ждем запуска события {{domxref("FetchEvent")}}. Мы создаем встроенный ответ:

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

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

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

+ + + + + + + + + + + + + + +
СпецификацияСтатусКомментарий
{{SpecName('Service Workers', '#cache-storage', 'CacheStorage')}}{{Spec2('Service Workers')}}Начальное определение.
+ +

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

+ +

{{CompatibilityTable}}

+ +
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
ФункционалChromeFirefox (Gecko)Internet ExplorerOperaSafari
Базовая поддержка{{CompatChrome(40.0)}}{{CompatGeckoDesktop(44)}}[1]{{CompatNo}}{{CompatUnknown}}{{CompatNo}}
Доступ через {{domxref("Window")}}{{CompatChrome(43.0)}}{{CompatGeckoDesktop(44)}}[1]{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}
Доступ через {{domxref("WorkerGlobalScope")}}{{CompatChrome(43.0)}}{{CompatGeckoDesktop(44)}}[1]{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}
+
+ +
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
ФункционалAndroidAndroid WebviewFirefox Mobile (Gecko)IE MobileOpera MobileSafari MobileChrome for Android
Базовая поддержка{{CompatNo}}{{CompatNo}}{{CompatGeckoMobile(44)}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatChrome(40.0)}}
Доступ через {{domxref("Window")}}{{CompatNo}}{{CompatNo}}{{CompatGeckoMobile(44)}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}{{CompatChrome(43.0)}}
Доступ через {{domxref("WorkerGlobalScope")}}{{CompatNo}}{{CompatNo}}{{CompatGeckoMobile(44)}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}{{CompatChrome(43.0)}}
+
+ +

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

+ +

Смотри также

+ + diff --git a/files/ru/web/api/cachestorage/match/index.html b/files/ru/web/api/cachestorage/match/index.html new file mode 100644 index 0000000000..6b60a861ce --- /dev/null +++ b/files/ru/web/api/cachestorage/match/index.html @@ -0,0 +1,99 @@ +--- +title: CacheStorage.match() +slug: Web/API/CacheStorage/match +tags: + - API + - CacheStorage + - Service Workers + - Service worker API + - ServiceWorker + - match + - Экспериментальная функция +translation_of: Web/API/CacheStorage/match +--- +

{{APIRef("Service Workers API")}}{{SeeCompatTable}}

+ +

Метод match() интерфейса {{domxref("CacheStorage")}} (доступный через глобальное свойство caches) проверяет  является ли данный {{domxref("Request")}} или строка url ключом для какого-либо хранимого {{domxref("Response")}}. Метод возвращает {{jsxref("Promise")}} если {{domxref("Response")}} найден, или undefined если нет ни одного совпадения.

+ +

Объекты Cache проверяются в порядке создания.

+ +
Note: {{domxref("CacheStorage.match()", "caches.match()")}} это метод для удобства в работе. Такая функциональность достигается вызовом {{domxref("cache.match()")}} для каждого объекта cache (в порядке полученом запросом {{domxref("CacheStorage.keys()", "caches.keys()")}}) пока {{domxref("Response")}} не будет найден.
+ +

Синтаксис

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

Параметры

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

Возвращаемое значение

+ +

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

+ +

Примеры

+ +

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

+ +
    +
  1. Проверяем, совпадения для запроса в {{domxref("CacheStorage")}} используя {{domxref("CacheStorage.match","CacheStorage.match()")}}. Если совпадение найдено, возвращаем response.
    2. +
  2. Если нет, открываем v1 объект кэша, используя метод open(), добавляем изначальный запрос в кэш используя {{domxref("Cache.put","Cache.put()")}} и возвращаем клонированный объект запроса, используя return response.clone(). Это необходимо, потому что метод put() сохраняет в кэш тело запроса, изменяя, таким образом, изначальный запрос.
    3. +
  3. Если произошла какая-либо ошибка (например, из-за проблем с сетью), возвращаем резервный ответ.
    4. +
+ +
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');
+});
+ +

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

+ + + + + + + + + + + + + + +
SpecificationStatusComment
{{SpecName('Service Workers', '#dom-cachestorage-match', 'CacheStorage: match')}}{{Spec2('Service Workers')}}Initial definition.
+ +

Совместимость с браузерами

+ + + +

{{Compat("api.CacheStorage.match")}}

+ +

Смотрите также

+ + diff --git a/files/ru/web/api/cachestorage/open/index.html b/files/ru/web/api/cachestorage/open/index.html new file mode 100644 index 0000000000..8e7535fdc9 --- /dev/null +++ b/files/ru/web/api/cachestorage/open/index.html @@ -0,0 +1,141 @@ +--- +title: CacheStorage.open() +slug: Web/API/CacheStorage/open +tags: + - API + - CacheStorage + - Experimental + - Method + - Reference + - ServiceWorker +translation_of: Web/API/CacheStorage/open +--- +

{{APIRef("Service Workers API")}}{{SeeCompatTable}}

+ +

open() метод из {{domxref("CacheStorage")}} интерфейса возвращает {{jsxref("Promise")}} который резолвится в {{domxref("Cache")}} обьект с соответствующим cacheName (именем тега кеша).

+ +
+

Note: If the specified {{domxref("Cache")}} does not exist, a new cache is created with that cacheName.

+
+ +

Синтакс

+ +
caches.open(cacheName).then(function(cache) {
+  //обрабатываем кеш например: cache.AddAll(filesToCache); где filesToCache = ['/mypic.png', ...]
+});
+
+ +

Возвращает

+ +

{{jsxref("Promise")}} который резолвится в запрашиваемый {{domxref("Cache")}} обьект.

+ +

Параметры

+ +
+
cacheName
+
Имя (тег) кеша заданное заранее которое необходимо открыть.
+
+ +

Примеры

+ +

This code snippet is from the MDN sw-test example (see sw-test running live). Here we wait for a {{domxref("FetchEvent")}} to fire. Then we construct a custom response like so:

+ +
    +
  1. Check whether a match for the request is found in the {{domxref("CacheStorage")}} using {{domxref("CacheStorage.match")}}. If so, serve that.
    2. +
  2. If not, open the v1 cache using {{domxref("CacheStorage.open")}}, put the default network request in the cache using {{domxref("Cache.put")}} and return a clone of the default network request using return response.clone() — necessary because put() consumes the response body.
    3. +
  3. If this fails (e.g., because the network is down), return a fallback response.
    4. +
+ +
var response;
+var cachedResponse = 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');
+});
+ +

Specifications

+ + + + + + + + + + + + + + +
SpecificationStatusComment
{{SpecName('Service Workers', '#cache-storage', 'CacheStorage')}}{{Spec2('Service Workers')}}Initial definition.
+ +

Browser compatibility

+ +

{{CompatibilityTable}}

+ +
+ + + + + + + + + + + + + + + + + + + +
FeatureChromeFirefox (Gecko)Internet ExplorerOperaSafari
Basic support{{CompatChrome(40.0)}}{{CompatGeckoDesktop(44)}}[1]{{CompatNo}}{{CompatUnknown}}{{CompatNo}}
+
+ +
+ + + + + + + + + + + + + + + + + + + + + + + +
FeatureAndroidAndroid WebviewFirefox Mobile (Gecko)IE MobileOpera MobileSafari MobileChrome for Android
Basic support{{CompatNo}}{{CompatNo}}{{CompatGeckoMobile(44)}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatChrome(40.0)}}
+
+ +

[1] Service workers (and Push) have been disabled in the Firefox 45 Extended Support Release (ESR.)

+ +

See also

+ + -- cgit v1.2.3-54-g00ecf