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 (en-US) и backgroundfetchfail (en-US), который предосталвяет метод для обновления заголовка и иконки приложения, для информирования юзера об успехе или провале фонового запроса.

Event ExtendableEvent (en-US) BackgroundFetchEvent BackgroundFetchUpdateUIEvent

Конструктор

BackgroundFetchUpdateUIEvent()

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

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

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

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

BackgroundFetchUpdateUIEvent.updateUI()

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

Примеры

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

js
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 готов к прослушиванию!" });
    })(),
  );
});

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

Specification
Background Fetch
# background-fetch-update-ui-event

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

BCD tables only load in the browser