Worker: message event
The message
event is fired on a Worker
object when the worker's parent receives a message from its worker (i.e. when the worker sends a message using DedicatedWorkerGlobalScope.postMessage()
).
This event is not cancellable and does not bubble.
Syntax
Use the event name in methods like addEventListener()
, or set an event handler property.
addEventListener('messageerror', event => { });
onmessageerror = event => { };
Event type
An MessageEvent
. Inherits from Event
.
Event properties
This interface also inherits properties from its parent, Event
.
MessageEvent.data
Read only-
The data sent by the message emitter.
MessageEvent.origin
Read only-
A
USVString
representing the origin of the message emitter. MessageEvent.lastEventId
Read only-
A
DOMString
representing a unique ID for the event. MessageEvent.source
Read only-
A
MessageEventSource
(which can be aWindowProxy
,MessagePort
, orServiceWorker
object) representing the message emitter. MessageEvent.ports
Read only-
An array of
MessagePort
objects representing the ports associated with the channel the message is being sent through (where appropriate, e.g. in channel messaging or when sending a message to a shared worker).
Examples
This code creates a new worker and listens to messages from it using addEventListener()
:
const worker = new Worker("static/scripts/worker.js");
worker.addEventListener('message', (event) => {
console.log(`Received message from worker: ${event.data}`)
});
Alternatively, it could listen using the onmessage
event handler property:
const worker = new Worker("static/scripts/worker.js");
worker.onmessage = (event) => {
console.log(`Received message from worker: ${event.data}`)
};
The worker posts messages using self.postMessage()
:
// static/scripts/worker.js
self.postMessage('I\'m alive!');
Specifications
Specification |
---|
HTML Standard # event-message |
Browser compatibility
BCD tables only load in the browser
See also
- Related events:
messageerror
. DedicatedWorkerGlobalScope.postMessage()
.