Web/API/ExtendableMessageEvent

The ExtendableMessageEvent interface of the Service Worker API represents the event object of a message event fired on a service worker (when a message is received on the ServiceWorkerGlobalScope from another context) — extends the lifetime of such events.

This interface inherits from the ExtendableEvent interface.

Constructor

ExtendableMessageEvent(): Creates a new ExtendableMessageEvent object instance.

Properties

Inherits properties from its parent, ExtendableEvent.

ExtendableMessageEvent.data Read only: Returns the event's data. It can be any data type.
ExtendableMessageEvent.origin Read only: Returns the origin of the Client that sent the message.
ExtendableMessageEvent.lastEventId Read only: Represents, in server-sent events, the last event ID of the event source. This is an empty string.
ExtendableMessageEvent.source Read only: Returns a reference to the Client object that sent the message.
ExtendableMessageEvent.ports Read only: Returns the array containing the MessagePort objects representing the ports of the associated message channel.

Methods

Inherits methods from its parent, ExtendableEvent.

Examples

In the below example a page gets a handle to the ServiceWorker object via ServiceWorkerRegistration.active, and then calls its postMessage() function.

// in the page being controlled
if (navigator.serviceWorker) {

  navigator.serviceWorker.register('service-worker.js');

  navigator.serviceWorker.addEventListener('message', event => {
    // event is a MessageEvent object
    console.log(`The service worker sent me a message: ${event.data}`);
  });

  navigator.serviceWorker.ready.then( registration => {
    registration.active.postMessage("Hi service worker");
  });

}

The service worker can receive the message by listening to the message event:

// in the service worker
addEventListener('message', event => {
  // event is an ExtendableMessageEvent object
  console.log(`The client sent me a message: ${event.data}`);

  event.source.postMessage("Hi client");
});

Specifications

Specification	Status	Comment
Service WorkersThe definition of 'ExtendableMessageEvent' in that specification.	Working Draft	Initial definition.

Browser compatibility

Update compatibility data on GitHub

	Desktop						Mobile
	Chrome	Edge	Firefox	Internet Explorer	Opera	Safari	Android webview	Chrome for Android	Firefox for Android	Opera for Android	Safari on iOS	Samsung Internet
`ExtendableMessageEvent` Experimental'	Chrome Full support Yes	Edge Full support ≤18	Firefox Full support 45 Notes' Full support 45 Notes' Notes' Extended Support Releases (ESR) before Firefox 78 ESR do not support service workers and the Push API.	IE No support No	Opera ?	Safari No support No	WebView Android No support No	Chrome Android Full support Yes	Firefox Android Full support 45	Opera Android ?	Safari iOS No support No	Samsung Internet Android Full support Yes
`ExtendableMessageEvent()` constructor Experimental'	Chrome ?	Edge ?	Firefox Full support 45 Notes' Full support 45 Notes' Notes' Extended Support Releases (ESR) before Firefox 78 ESR do not support service workers and the Push API.	IE No support No	Opera ?	Safari No support No	WebView Android No support No	Chrome Android ?	Firefox Android Full support 45	Opera Android ?	Safari iOS No support No	Samsung Internet Android ?
`data` Experimental'	Chrome Full support 51	Edge Full support ≤79	Firefox Full support 45 Notes' Full support 45 Notes' Notes' Extended Support Releases (ESR) before Firefox 78 ESR do not support service workers and the Push API.	IE No support No	Opera ?	Safari No support No	WebView Android No support No	Chrome Android Full support 51	Firefox Android Full support 45	Opera Android ?	Safari iOS No support No	Samsung Internet Android Full support 5.0
`lastEventId` Experimental'	Chrome ?	Edge Full support 17	Firefox Full support 45 Notes' Full support 45 Notes' Notes' Extended Support Releases (ESR) before Firefox 78 ESR do not support service workers and the Push API.	IE No support No	Opera ?	Safari No support No	WebView Android No support No	Chrome Android ?	Firefox Android Full support 45	Opera Android ?	Safari iOS No support No	Samsung Internet Android ?
`origin` Experimental'	Chrome ?	Edge ?	Firefox No support No	IE No support No	Opera ?	Safari No support No	WebView Android No support No	Chrome Android ?	Firefox Android No support No	Opera Android ?	Safari iOS No support No	Samsung Internet Android ?
`ports` Experimental'	Chrome ?	Edge ?	Firefox Full support 45 Notes' Full support 45 Notes' Notes' Extended Support Releases (ESR) before Firefox 78 ESR do not support service workers and the Push API.	IE No support No	Opera ?	Safari No support No	WebView Android No support No	Chrome Android ?	Firefox Android Full support 45	Opera Android ?	Safari iOS No support No	Samsung Internet Android ?
`source` Experimental'	Chrome ?	Edge ?	Firefox Full support 45 Notes' Full support 45 Notes' Notes' Extended Support Releases (ESR) before Firefox 78 ESR do not support service workers and the Push API.	IE No support No	Opera ?	Safari No support No	WebView Android No support No	Chrome Android ?	Firefox Android Full support 45	Opera Android ?	Safari iOS No support No	Samsung Internet Android ?

Legend

Full support: Full support
No support: No support
Compatibility unknown: Compatibility unknown
Experimental. Expect behavior to change in the future.': Experimental. Expect behavior to change in the future.
See implementation notes.': See implementation notes.