BackgroundFetchUpdateUIEvent

Limited availability

This feature is not Baseline because it does not work in some of the most widely-used browsers.

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

ИнтерфейсBackgroundFetchUpdateUIEvent, из набораBackground Fetch API это тип события для событийbackgroundfetchsuccess иbackgroundfetchfail, который предосталвяет метод для обновления заголовка и иконки приложения, для информирования юзера об успехе или провале фонового запроса.

Конструктор

BackgroundFetchUpdateUIEvent()Экспериментальная возможность: Создаёт новый объектBackgroundFetchUIEvent. Этот конструктор обычно не используется, так как браузер сам создаёт эти объекты для событий backgroundfetchsuccess иbackgroundfetchfail.

Свойства экземпляра

Этот интерфейс не реализует каких-либо особенных свойств, но наследует свойстваEvent, иBackgroundFetchEvent.

Методы экземпляра

BackgroundFetchUpdateUIEvent.updateUI()Экспериментальная возможность: Обновляет заголовок и иконку в пользовательском интерфейсе, чтобы показать статус фонового запроса. Результатом работы является Promise.

Примеры

В этом примере слушается событиеbackgroundfetchsuccess, для того чтобы показать, что фоновый запрос успешно завершился. Затем вызывается методupdateUI(), дающий пользователю знать, что загруженный им эпизод готов.

addEventListener("backgroundfetchsuccess", (event) => {  const bgFetch = event.registration;  event.waitUntil(    (async () => {      // Создать/открыть кэш.      const cache = await caches.open("downloads");      // Получить все записи.      const records = await bgFetch.matchAll();      // Копировать каждый запрос/ответ.      const promises = records.map(async (record) => {        const response = await record.responseReady;        await cache.put(record.request, response);      });      // Ждать пока копирование завершиться      await Promise.all(promises);      // Обновить уведомление о прогрессе      event.updateUI({ title: "Эпизод 5 готов к прослушиванию!" });    })(),  );});