JavaScript Worker messageerror Event

Beginner
5 min read
Updated: Nov 2026
5 examples
Event
Decorative image with the word MESSAGEERROR

Definition

The messageerror event on a Worker fires when it receives a message that can’t be deserialized (MDN). Listen with addEventListener("messageerror", …) or the onmessageerror property.

Register a listener with addEventListener. Check readiness and browser support before you rely on this event.

Syntax

Listen for messageerror. Start with this line.

JavaScript
worker.addEventListener("messageerror", (event) => { … })
CallWhat it does
worker.addEventListener("messageerror", (event) => { … })Primary signature.

Built into the browser. Listen with worker.addEventListener("messageerror", …) or worker.onmessageerror — no import required.

Library declarations
JavaScript
worker.addEventListener("messageerror", (event) => { … })

Parameters

ParameterDescription
HandlerRequired. onmessageerror or addEventListener

Return Value

Return ValueDescription
*Fires as a WorkerTrackEvent (listener receives the event).

JavaScript Examples

Example 1 — addEventListener("messageerror") (MDN)

Wire message and messageerror together — MDN’s listen style.

JavaScript
const url = URL.createObjectURL(
  new Blob(['self.postMessage("I\'m alive!");'], {
    type: "application/javascript"
  })
);
const worker = new Worker(url);

worker.addEventListener("messageerror", (event) => {
  console.error("Error receiving message from worker:", event);
});

worker.addEventListener("message", (event) => {
  console.log("Received:", event.data);
  worker.terminate();
  URL.revokeObjectURL(url);
});
Try It Yourself

How It Works

  1. Attach both listeners. Success and deserialize-fail paths.
  2. Cloneable string posts. Fires message, not messageerror.
  3. messageerror stays ready. Catches rare decode failures.
  4. Clean up. Terminate and revoke when done.

Example 2 — onmessageerror (MDN)

Same pairing via handler properties.

JavaScript
const url = URL.createObjectURL(
  new Blob(['self.postMessage("I\'m alive!");'], {
    type: "application/javascript"
  })
);
const worker = new Worker(url);

worker.onmessageerror = (event) => {
  console.error("Error receiving message from worker:", event);
};

worker.onmessage = (event) => {
  console.log("Received:", event.data);
  worker.terminate();
  URL.revokeObjectURL(url);
};
Try It Yourself

How It Works

  1. Set onmessageerror. MDN’s property style.
  2. Set onmessage. Normal success path.
  3. Cloneable reply. Only message runs in this lab.
  4. One slot each. Prefer addEventListener for multiple handlers.

Example 3 — Pair for Object Payloads

Wire both handlers; a cloneable object still uses message.

JavaScript
const url = URL.createObjectURL(
  new Blob(
    ["self.postMessage({ type: 'result', value: 42 });"],
    { type: "application/javascript" }
  )
);
const worker = new Worker(url);

worker.onmessageerror = () => console.log("decode-fail");

worker.onmessage = (event) => {
  console.log("UI:", event.data.type, event.data.value);
  // → UI: result 42
  worker.terminate();
  URL.revokeObjectURL(url);
};
Try It Yourself

How It Works

  1. Plain objects clone fine. Expect message.
  2. Keep messageerror attached. Defense for edge payloads.
  3. Read event.data only on success. Decode-fail has no usable data.
  4. Prefer copyable types. Strings, numbers, plain objects, arrays.

Example 4 — Feature-Detect

Limited availability — check support before relying on the handler.

JavaScript
const supported = "onmessageerror" in Worker.prototype;
console.log("onmessageerror supported:", supported);

const url = URL.createObjectURL(
  new Blob(["self.postMessage('ping');"], {
    type: "application/javascript"
  })
);
const worker = new Worker(url);

if (supported) {
  worker.onmessageerror = () => console.log("messageerror fired");
}

worker.onmessage = (event) => {
  console.log("message:", event.data);
  worker.terminate();
  URL.revokeObjectURL(url);
};
Try It Yourself

How It Works

  1. Probe the prototype. Safe feature-detect for Limited availability.
  2. Attach only if present. Avoid assuming every browser has it.
  3. Still use message. Success path works everywhere Workers do.
  4. Ship cautiously. Prefer cloneable data so decode rarely fails.

Example 5 — Three Channels

message / messageerror / error — success vs script failure.

JavaScript
function makeWorker(source) {
  const url = URL.createObjectURL(
    new Blob([source], { type: "application/javascript" })
  );
  const worker = new Worker(url);
  worker.onmessage = (e) => console.log("ok:", e.data);
  if ("onmessageerror" in Worker.prototype) {
    worker.onmessageerror = () => console.log("decode-fail");
  }
  worker.onerror = (e) => {
    console.log("script-fail:", e.message || "error");
    e.preventDefault();
  };
  return worker;
}

// Healthy: makeWorker("self.onmessage=()=>self.postMessage('pong');")
// Broken:  makeWorker("throw new Error('boom');")
Try It Yourself

How It Works

  1. Three different failures. Success, decode fail, script crash.
  2. Healthy ping → message. Normal postMessage.
  3. Throw → error. Not messageerror.
  4. Know each channel. Don’t treat all failures the same.
Compatibility

Browser Support

The Worker messageerror event has Limited availability on MDN (not Baseline). Feature-detect before relying on it.

✓ Limited availability

Worker messageerror event

Supported in modern Chromium and Firefox-family browsers; check Safari/legacy carefully. Fires when a worker message cannot be deserialized.

72% Browser support
Google Chrome messageerror · supported
Full support
Microsoft Edge messageerror · Chromium
Full support
Mozilla Firefox messageerror · supported
Full support
Opera messageerror · Chromium
Full support
Apple Safari check version
Partial / check
Internet Explorer not supported
No support
Worker messageerror Limited

Bottom line: Always feature-detect. Prefer cloneable payloads so decode failures stay rare. Pair with message and error handlers.

Frequently Asked Questions

It fires on the Worker object when it receives a message that cannot be deserialized (MDN). Listen with worker.onmessageerror or worker.addEventListener("messageerror", handler).
No. MDN does not mark it Deprecated, Experimental, or Non-standard. It has Limited availability (not Baseline), so feature-detect. Available in Web Workers except Service Workers.
message means a reply arrived and decoded successfully (read event.data). messageerror means a message arrived but could not be deserialized—so you do not get a usable payload the normal way.
error means the worker script failed (throw, load failure, and similar). messageerror is specifically about failing to deserialize an incoming message, not about the worker script crashing.
No. Per MDN, this event is not cancellable and does not bubble.
Everyday cloneable values (strings, numbers, plain objects, arrays) deserialize fine. messageerror is for rarer deserialize failures. Labs focus on attaching handlers, feature detection, and contrasting related events.

Next: Worker error

Learn how to handle uncaught failures inside the worker script.

error tutorial →

About the author

Mari Selvan M P
Mari Selvan M P 🔗

Developer, cloud engineer, and technical writer

  • Experience 12 years building web and cloud systems
  • Focus Full Stack Development, AWS, and Developer Education

I write practical tutorials so students and working developers can learn by doing—from databases and APIs to deployment on AWS.

AWS Certified Developer – Associate (Credly)

10 people found this page helpful

JavaScript Worker message Event JavaScript Worker error Event