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

View in English Always switch to English

ServiceWorker: statechange-Ereignis

Baseline Widely available

This feature is well established and works across many devices and browser versions. It’s been available across browsers since ⁨April 2018⁩.

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

Hinweis: Diese Funktion ist in Web Workers verfügbar.

Das statechange-Ereignis wird ausgelöst, sobald sich der ServiceWorker.state ändert.

Syntax

Verwenden Sie den Ereignisnamen in Methoden wie addEventListener() oder setzen Sie eine Ereignisbehandler-Eigenschaft.

js
addEventListener("statechange", (event) => { }) onstatechange = (event) => { } 

Ereignistyp

Ein generisches Event.

Beispiele

Dieses Codebeispiel stammt aus dem Beispiel für service worker-Registrierungsereignisse (Live-Demo). Der Code lauscht auf Änderungen im ServiceWorker.state und gibt dessen Wert zurück.

js
let serviceWorker; if (registration.installing) { serviceWorker = registration.installing; document.querySelector("#kind").textContent = "installing"; } else if (registration.waiting) { serviceWorker = registration.waiting; document.querySelector("#kind").textContent = "waiting"; } else if (registration.active) { serviceWorker = registration.active; document.querySelector("#kind").textContent = "active"; } if (serviceWorker) { logState(serviceWorker.state); serviceWorker.addEventListener("statechange", (e) => { logState(e.target.state); }); } 

Beachten Sie, dass beim Auslösen von statechange die Referenzen des Service Workers möglicherweise geändert wurden. Zum Beispiel:

js
navigator.serviceWorker.register("/sw.js").then((swr) => { swr.installing.state = "installing"; swr.installing.onstatechange = () => { swr.installing = null; // At this point, swr.waiting OR swr.active might be true. This is because the statechange // event gets queued, meanwhile the underlying worker may have gone into the waiting // state and will be immediately activated if possible. }; }); 

Spezifikationen

Specification
Service Workers Nightly
# dom-serviceworker-onstatechange

Browser-Kompatibilität