BackgroundFetchUpdateUIEvent

Eingeschränkt verfügbar

Diese Funktion ist nicht Baseline, da sie in einigen der am weitesten verbreiteten Browser nicht funktioniert.

title: "BackgroundFetchUpdateUIEvent" slug: Web/API/BackgroundFetchUpdateUIEvent page-type: web-api-interface status:

experimental browser-compat: api.BackgroundFetchUpdateUIEvent

Experimentell: Dies ist eine experimentelle Technologie
Überprüfen Sie die Browser-Kompatibilitätstabelle sorgfältig vor der Verwendung auf produktiven Webseiten.

Hinweis: Diese Funktion ist nur in Service Workers verfügbar.

Die BackgroundFetchUpdateUIEvent-Schnittstelle der Background Fetch API ist ein Ereignistyp für die backgroundfetchsuccess- und backgroundfetchfail-Ereignisse und bietet eine Methode, um den Titel und das Icon der App zu aktualisieren, um den Benutzer über den Erfolg oder Misserfolg eines Hintergrundabrufs zu informieren.

Event ExtendableEvent BackgroundFetchEvent BackgroundFetchUpdateUIEvent

In diesem Artikel

Konstruktor

BackgroundFetchUpdateUIEvent()

Erstellt ein neues BackgroundFetchUIEvent-Objekt. Dieser Konstruktor wird typischerweise nicht verwendet, da der Browser diese Objekte selbst für die backgroundfetchsuccess- und backgroundfetchfail-Ereignisse erstellt.

Instanz-Eigenschaften

Erbt auch Eigenschaften von seinem Elternteil, BackgroundFetchEvent.

Instanz-Methoden

Erbt auch Methoden von seinem Elternteil, BackgroundFetchEvent.

BackgroundFetchUpdateUIEvent.updateUI()

Aktualisiert den Titel und das Icon in der Benutzeroberfläche, um den Status eines Hintergrundabrufs anzuzeigen. Löst sich mit einem Promise auf.

Beispiele

In diesem Beispiel wird auf das backgroundfetchsuccess-Ereignis gehört, was darauf hinweist, dass ein Abruf erfolgreich abgeschlossen wurde. Die updateUI()-Methode wird dann mit einer Nachricht aufgerufen, um den Benutzer wissen zu lassen, dass die heruntergeladene Episode bereit ist.

js
addEventListener("backgroundfetchsuccess", (event) => {
  const bgFetch = event.registration;

  event.waitUntil(
    (async () => {
      // Create/open a cache.
      const cache = await caches.open("downloads");
      // Get all the records.
      const records = await bgFetch.matchAll();
      // Copy each request/response across.
      const promises = records.map(async (record) => {
        const response = await record.responseReady;
        await cache.put(record.request, response);
      });

      // Wait for the copying to complete.
      await Promise.all(promises);

      // Update the progress notification.
      event.updateUI({ title: "Episode 5 ready to listen!" });
    })(),
  );
});

Spezifikationen

Spezifikation

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

Browser-Kompatibilität

JavaScript aktivieren, um diese Browser-Kompatibilitätstabelle anzuzeigen.

Help improve MDN

War diese Übersetzung hilfreich?

Ja Nein

Erfahren Sie, wie Sie beitragen können Diese Seite wurde automatisch aus dem Englischen übersetzt.

Übersetzung auf GitHub anzeigen • Fehler mit dieser Übersetzung melden

Background Fetch API
BackgroundFetchUpdateUIEvent
Konstruktor
1. BackgroundFetchUpdateUIEvent()
Instanzmethoden
1. updateUI()
Vererbung
Verwandte Seiten für Background Fetch API