ServiceWorkerContainer: message-Ereignis
Baseline
Weitgehend verfügbar
Diese Funktion ist gut etabliert und funktioniert auf vielen Geräten und in vielen Browserversionen. Sie ist seit April 2018 browserübergreifend verfügbar.
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 message-Ereignis wird auf einer Seite verwendet, die von einem Service Worker kontrolliert wird, um Nachrichten vom Service Worker zu empfangen.
Dieses Ereignis kann nicht abgebrochen werden und wird nicht weitergegeben.
Syntax
Verwenden Sie den Ereignisnamen in Methoden wie addEventListener() oder legen Sie eine Ereignishandler-Eigenschaft fest.
addEventListener("message", (event) => { })
onmessage = (event) => { }
Ereignistyp
Ein MessageEvent. Erbt von Event.
Beispiele
In diesem Beispiel erhält der Service Worker die ID des Clients von einem fetch-Ereignis und sendet ihm dann eine Nachricht über Client.postMessage:
// service-worker.js
async function messageClient(clientId) {
const client = await clients.get(clientId);
client.postMessage("Hi client!");
}
addEventListener("fetch", (event) => {
messageClient(event.clientId);
event.respondWith(() => {
// …
});
});
Der Client kann die Nachricht empfangen, indem er dem message-Ereignis lauscht:
// main.js
navigator.serviceWorker.addEventListener("message", (message) => {
console.log(message);
});
Alternativ kann der Client die Nachricht mit dem onmessage-Ereignishandler empfangen:
// main.js
navigator.serviceWorker.onmessage = (message) => {
console.log(message);
};
Spezifikationen
| Spezifikation |
|---|
| Service Workers Nightly # dom-serviceworkercontainer-onmessage |