The message
event is used in a page controlled by a service worker to receive messages from the service worker.
Bubbles | No |
Cancelable | No |
Interface | MessageEvent
|
Event handler property | onmessage
|
Examples
In this example the service worker get the client's ID from a fetch
event and then sends it a message using Client.postMessage
:
// in the service worker
async function messageClient(clientId) {
const client = await clients.get(clientId);
client.postMessage('Hi client!');
}
addEventListener('fetch', (event) => {
messageClient(event.clientId);
event.respondWith(() => {
// ...
});
});
The client can receive the message by listening to the message
event:
// in the page being controlled
navigator.serviceWorker.addEventListener('message', (message) => {
console.log(message);
});
Specifications
Specification | Status |
Service WorkersThe definition of 'message' in that specification. | Working Draft |
Browser compatibility
The compatibility table on this page is generated from structured data. If you'd like to contribute to the data, please check out https://github.com/mdn/browser-compat-data and send us a pull request.
Update compatibility data on GitHub
Desktop | Mobile | |||||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|
message event
|
Chrome
Full support 40 |
Edge Full support 17 Full support 17 Full support 16 Disabled' From version 16: this feature is behind the |
Firefox Full support 44 Full support 44 Notes' Extended Support Releases (ESR) before Firefox 78 ESR do not support service workers and the Push API. |
IE
No support No |
Opera
Full support 27 |
Safari
Full support 11.1 |
WebView Android
Full support 40 |
Chrome Android
Full support 40 |
Firefox Android
Full support 44 |
Opera Android
Full support 27 |
Safari iOS
Full support 11.3 |
Samsung Internet Android
Full support 4.0 |
Legend
- Full support
- Full support
- No support
- No support
- See implementation notes.'
- See implementation notes.
- User must explicitly enable this feature.'
- User must explicitly enable this feature.
See also
ServiceWorkerContainer: message event by Mozilla Contributors is licensed under CC-BY-SA 2.5.