Window: message-Ereignis
Baseline
Weitgehend verfügbar
Diese Funktion ist gut etabliert und funktioniert auf vielen Geräten und in vielen Browserversionen. Sie ist seit August 2017 browserübergreifend verfügbar.
Das message-Ereignis wird auf einem Window-Objekt ausgelöst, wenn das Fenster eine Nachricht empfängt, beispielsweise durch einen Aufruf von Window.postMessage() aus einem anderen Browsing-Kontext.
Dieses Ereignis kann nicht abgebrochen werden und wird nicht nach oben weitergereicht.
Syntax
Verwenden Sie den Ereignisnamen in addEventListener():
addEventListener("message", (event) => { })
Alternativ können Sie ihn der Event-Handler-Eigenschaft der Schnittstelle zuweisen:
onmessage = (event) => { }
Ereignistyp
Ein MessageEvent. Es erbt von Event.
Beispiele
Angenommen, ein Skript sendet mit folgendem Code eine Nachricht an einen anderen Browsing-Kontext, beispielsweise an ein anderes <iframe>:
const targetFrame = window.top.frames[1];
const targetOrigin = "https://example.org";
const windowMessageButton = document.querySelector("#window-message");
windowMessageButton.addEventListener("click", () => {
targetFrame.postMessage("hello there", targetOrigin);
});
Der Empfänger kann mit addEventListener() und folgendem Code auf die Nachricht warten:
window.addEventListener("message", (event) => {
console.log(`Received message: ${event.data}`);
});
Alternativ kann der Listener die Event-Handler-Eigenschaft onmessage verwenden. Beachten Sie jedoch, dass dadurch andere mit onmessage hinzugefügte Event-Listener ersetzt werden, sofern vorhanden:
window.onmessage = (event) => {
console.log(`Received message: ${event.data}`);
};
Spezifikationen
| Spezifikation |
|---|
| HTML # event-message |
| HTML # handler-window-onmessage |
Browser-Kompatibilität
Siehe auch
- Verwandtes Ereignis:
messageerror. Window.postMessage().