BackgroundFetchUpdateUIEvent: updateUI() Methode

Limited availability

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

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 updateUI()-Methode des BackgroundFetchUpdateUIEvent-Interfaces aktualisiert den Titel und das Symbol in der Benutzeroberfläche, um den Status eines Hintergrundabrufs anzuzeigen.

Diese Methode kann nur einmal ausgeführt werden, um den Benutzer über einen fehlgeschlagenen oder erfolgreichen Abruf zu informieren.

Syntax

js
updateUI()
updateUI(options)

Parameter

options Optional

Ein Objekt, das eines oder mehrere der folgenden enthält:

icons Optional

Eine Liste von einem oder mehreren Bildressourcen, die Symbole für die Verwendung in der Benutzeroberfläche enthalten. Eine Bildressource ist ein Objekt, das Folgendes enthält:

src

Ein String, der eine URL eines Bildes ist.

sizes Optional

Ein String, der dem sizes-Attribut des <link>-Elements entspricht.

type Optional

Ein String, der einen Bild-MIME-Typ enthält.

label Optional

Ein String, der einen Namen für das zugehörige Bild bereitstellt.

title Optional

Ein String, der den neuen Titel der Benutzeroberfläche enthält.

Rückgabewert

Ein Promise.

Ausnahmen

InvalidStateError DOMException

Wird ausgelöst, wenn eines der folgenden zutrifft:

  • Die Eigenschaft isTrusted ist false.
  • Das BackgroundFetchUpdateUIEvent-UI-aktualisierte-Flag ist bereits gesetzt, was darauf hinweist, dass die updateUI()-Methode bereits aufgerufen wurde.
  • Das BackgroundFetchUpdateUIEvent ist nicht aktiv.

Beispiele

Das folgende Beispiel zeigt, wie die Benutzeroberfläche mit einem Titel und einem Bildsymbol bei einem erfolgreichen Abruf aktualisiert wird.

js
addEventListener("backgroundfetchsuccess", (event) => {
  event.updateUI({
    title: "Episode 5 ready to listen!",
    icon: {
      src: "path/to/success.ico",
      sizes: "16x16 32x32 64x64",
    },
  });
});

Spezifikationen

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

Browser-Kompatibilität