Themessageerror event is fired to theServiceWorkerContainer when an incoming message sent to the associated worker can't be deserialized.

This event is not cancelable and does not bubble.

Syntax

Use the event name in methods likeaddEventListener(), or set an event handler property.

addEventListener("messageerror", (event) => { })onmessageerror = (event) => { }

Event type

AMessageEvent. Inherits fromEvent.

Event properties

This interface also inherits properties from its parent,Event.

MessageEvent.dataRead only

The data sent by the message emitter.

MessageEvent.originRead only

A string representing the origin of the message emitter.

MessageEvent.lastEventIdRead only

A string representing a unique ID for the event.

MessageEvent.sourceRead only

AMessageEventSource (which can be aWindowProxy,MessagePort, orServiceWorker object) representing the message emitter.

MessageEvent.portsRead only

An array ofMessagePort 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

In this example the service worker get the client's ID from afetch event and then sends it a message usingClient.postMessage:

// service-worker.jsasync function messageClient(clientId) {  const client = await self.clients.get(clientId);  client.postMessage("Hi client!");}self.addEventListener("fetch", (event) => {  messageClient(event.clientId);  event.respondWith(() => {    // …  });});

The service worker can listen for the message deserialization error by listening to themessageerror event:

// main.jsnavigator.serviceWorker.addEventListener("messageerror", (event) => {  console.error("Receive message from service worker failed!");});

Alternatively, the script can listen for the message deserialization error usingonmessageerror:

// main.jsnavigator.serviceWorker.onmessageerror = (event) => {  console.error("Receive message from service worker failed!");};

Specifications

Browser compatibility

See also

• message
• Client.postMessage()
• Using Service Workers
• Service workers basic code example
• Using Web Workers