The ServiceWorkerMessageEvent interface of the {{domxref("ServiceWorker_API", "ServiceWorker API")}} contains information about an event sent to a navigator.serviceWorker
target. This extends the default {{event("message")}} event to allow setting a {{domxref("ServiceWorker")}} object as the source of a message. The event object is accessed via the handler function of a {{event("message_(ServiceWorker)","message")}} event, when fired by a message received from a service worker.
This interface inherits from the {{domxref("Event")}} interface.
Constructor
- {{domxref("ServiceWorkerMessageEvent.ServiceWorkerMessageEvent()")}}
- Creates a new
ServiceWorkerMessageEvent
object instance.
Properties
Inherits properties from its parent, {{domxref("Event")}}.
- {{domxref("ServiceWorkerMessageEvent.data")}} {{readonlyinline}}
- Returns the event's data. It can be any data type.
- {{domxref("ServiceWorkerMessageEvent.origin")}} {{readonlyinline}}
- Returns the origin of the service worker's environment settings object.
- {{domxref("ServiceWorkerMessageEvent.lastEventId")}} {{readonlyinline}}
- Represents, in server-sent events, the last event ID of the event source.
- {{domxref("ServiceWorkerMessageEvent.source")}} {{readonlyinline}}
- Returns a reference to the service worker that sent the message.
- {{domxref("ServiceWorkerMessageEvent.ports")}} {{readonlyinline}}
- Returns an array of {{domxref("MessagePort")}} objects.
Methods
Inherits methods from its parent, {{domxref("Event")}}.
Examples
When the following code is used inside the main thread to set up a message channel between it and a service worker for sending messages between the two, the event ovject of onmessage
will be a ServiceWorkerMessageEvent
.
navigator.serviceWorker.ready.then(function(reg) { ... // set up a message channel to communicate with the SW var channel = new MessageChannel(); channel.port1.onmessage = function(e) { console.log(e); handleChannelMessage(e.data); } mySW = reg.active; mySW.postMessage('hello', [channel.port2]); });
Specifications
Specification | Status | Comment |
---|---|---|
{{SpecName('Service Workers', '#serviceworkermessage-event-section', 'ServiceWorkerMessageEvent')}} | {{Spec2('Service Workers')}} | Initial definition. |
Browser compatibility
Feature | Chrome | Firefox (Gecko) | Internet Explorer | Opera | Safari (WebKit) |
---|---|---|---|---|---|
Basic support | {{CompatChrome(45.0)}} | {{CompatGeckoDesktop("44.0")}} | {{CompatNo}} | 24 | {{CompatNo}} |
Feature | Android | Android Webview | Firefox Mobile (Gecko) | Firefox OS | IE Mobile | Opera Mobile | Safari Mobile | Chrome for Android |
---|---|---|---|---|---|---|---|---|
Basic support | {{CompatNo}} | {{CompatNo}} | {{CompatVersionUnknown}} | {{CompatVersionUnknown}} | {{CompatNo}} | {{CompatUnknown}} | {{CompatNo}} | {{CompatChrome(45.0)}} |