Dieser Inhalt wurde automatisch aus dem Englischen übersetzt, und kann Fehler enthalten. Erfahre mehr über dieses Experiment.

View in English Always switch to English

Web Periodic Background Synchronization API

Sicherer Kontext: Diese Funktion ist nur in sicheren Kontexten (HTTPS) in einigen oder allen unterstützenden Browsern verfügbar.

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 in Web Workers verfügbar.

Die Periodic Background Synchronization API bietet eine Möglichkeit, Aufgaben zu registrieren, die in einem Service Worker in regelmäßigen Abständen mit Netzwerkverbindung ausgeführt werden sollen. Diese Aufgaben werden als Anfragen für periodische Hintergrundsynchronisierung bezeichnet.

Konzepte und Verwendung

Die Periodic Background Sync API ermöglicht es Webanwendungen, ihren Service Worker dazu zu veranlassen, in regelmäßigen Abständen Aktualisierungen vorzunehmen. Dies kann beinhalten, die neuesten Inhalte herunterzuladen, während ein Gerät mit Wi-Fi verbunden ist, oder Hintergrundaktualisierungen einer Anwendung zuzulassen.

Das minimale Zeitintervall wird festgelegt, wenn die API aufgerufen wird; der Benutzeragent kann jedoch auch andere Faktoren berücksichtigen, die beeinflussen, wann der Service Worker das Ereignis empfängt. Zum Beispiel das vorherige Engagement mit der Website oder die Verbindung zu einem bekannten Netzwerk.

Die Schnittstelle PeriodicSyncManager ist über ServiceWorkerRegistration.periodicSync verfügbar. Ein eindeutiges Tag wird festgelegt, um das Synchronisierungsereignis zu "benennen", das dann im Skript des ServiceWorker abgehört werden kann. Sobald das Ereignis eingetroffen ist, können Sie jede verfügbare Funktionalität ausführen, wie das Aktualisieren von Caches oder das Abrufen neuer Ressourcen.

Da diese API auf Service Worker angewiesen ist, ist die durch diese API bereitgestellte Funktionalität nur in einem sicheren Kontext verfügbar.

Schnittstellen

PeriodicSyncManager Experimentell

Registriert Aufgaben, die in einem Service Worker in regelmäßigen Abständen mit Netzwerkverbindung ausgeführt werden sollen. Diese Aufgaben werden als Anfragen für periodische Hintergrundsynchronisierung bezeichnet.

PeriodicSyncEvent Experimentell

Repräsentiert ein Synchronisierungsereignis, das an den globalen Bereich eines ServiceWorkers gesendet wird. Es bietet eine Möglichkeit, Aufgaben im Service Worker mit Netzwerkverbindung auszuführen.

Erweiterungen zu anderen Schnittstellen

Die folgenden Ergänzungen zur Service Worker API sind in der Spezifikation der Periodic Background Sync definiert, um einen Einstiegspunkt für die Nutzung der Periodic Background Sync bereitzustellen.

ServiceWorkerRegistration.periodicSync Schreibgeschützt Experimentell

Gibt eine Referenz auf die Schnittstelle PeriodicSyncManager zurück, um Aufgaben zu registrieren, die zu bestimmten Intervallen ausgeführt werden.

periodicsync Ereignis Experimentell

Tritt in regelmäßigen Abständen auf, die bei der Registrierung eines PeriodicSyncManager festgelegt wurden.

Beispiele

Die folgenden Beispiele zeigen, wie man die Schnittstelle verwendet.

Anfordern einer Periodischen Hintergrundsynchronisation

Die folgende asynchrone Funktion registriert eine periodische Hintergrundsynchronisation in einem Mindestintervall von einem Tag aus einem Browsing-Kontext:

js
async function registerPeriodicNewsCheck() {
  const registration = await navigator.serviceWorker.ready;
  try {
    await registration.periodicSync.register("get-latest-news", {
      minInterval: 24 * 60 * 60 * 1000,
    });
  } catch {
    console.log("Periodic Sync could not be registered!");
  }
}

Überprüfen einer Hintergrundsynchronisation nach Tag

Dieser Code überprüft, ob eine Aufgabe für die Periodische Hintergrundsynchronisation mit einem gegebenen Tag registriert ist.

js
navigator.serviceWorker.ready.then((registration) => {
  registration.periodicSync.getTags().then((tags) => {
    if (tags.includes("get-latest-news")) skipDownloadingLatestNewsOnPageLoad();
  });
});

Entfernen einer Aufgabe für Periodische Hintergrundsynchronisation

Der folgende Code entfernt eine Aufgabe für die Periodische Hintergrundsynchronisation, um das synchronisieren von Artikeln im Hintergrund zu stoppen.

js
navigator.serviceWorker.ready.then((registration) => {
  registration.periodicSync.unregister("get-latest-news");
});

Abhören einer Periodischen Hintergrundsynchronisation innerhalb eines Service Workers

Das folgende Beispiel zeigt, wie man auf ein periodisches Synchronisierungsereignis im Service Worker reagiert.

js
self.addEventListener("periodicsync", (event) => {
  if (event.tag === "get-latest-news") {
    event.waitUntil(fetchAndCacheLatestNews());
  }
});

Spezifikationen

Specification
Web Periodic Background Synchronization

Browser-Kompatibilität

api.PeriodicSyncManager

api.ServiceWorkerGlobalScope.periodicsync_event

Siehe auch