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: Dieses Feature ist verfügbar in Web Workers.
Das statechange
-Ereignis wird jedes Mal ausgelöst, wenn sich der ServiceWorker.state
ändert.
Syntax
Verwenden Sie den Ereignisnamen in Methoden wie addEventListener()
oder legen Sie eine Ereignishandler-Eigenschaft fest.
addEventListener("statechange", (event) => {});
onstatechange = (event) => {};
Ereignistyp
Ein generisches Event
.
Beispiele
Dieser Codeausschnitt stammt aus dem Beispiel für Service Worker Registrierungsevents (Live-Demo). Der Code lauscht auf jede Änderung des ServiceWorker.state
und gibt dessen Wert zurück.
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, wenn statechange
ausgelöst wird, die Referenzen des Service Workers möglicherweise geändert wurden. Zum Beispiel:
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 # dom-serviceworker-onstatechange |
Browser-Kompatibilität
BCD tables only load in the browser