BroadcastChannel

The BroadcastChannel interface represents a named channel that any browsing context of a given origin can subscribe to. It allows communication between different documents (in different windows, tabs, frames or iframes) of the same origin. Messages are broadcasted via a message event fired at all BroadcastChannel objects listening to the channel.

  <div id="interfaceDiagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 11.666666666666666%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 70" preserveAspectRatio="xMinYMin meet"><a xlink:href="https://developer.mozilla.org/en-US/docs/Web/API/EventTarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#D4DDE4" stroke-width="2px" /><text  x="56" y="30" font-size="12px" font-family="Consolas,Monaco,Andale Mono,monospace" fill="#4D4E53" text-anchor="middle" alignment-baseline="middle">EventTarget</text></a><polyline points="111,25  121,20  121,30  111,25" stroke="#D4DDE4" fill="none"/><line x1="121" y1="25" x2="151" y2="25" stroke="#D4DDE4"/><a xlink:href="https://developer.mozilla.org/en-US/docs/Web/API/BroadcastChannel" target="_top"><rect x="151" y="1" width="160" height="50" fill="#F4F7F8" stroke="#D4DDE4" stroke-width="2px" /><text  x="231" y="30" font-size="12px" font-family="Consolas,Monaco,Andale Mono,monospace" fill="#4D4E53" text-anchor="middle" alignment-baseline="middle">BroadcastChannel</text></a></svg></div>

  a:hover text { fill: #0095DD; pointer-events: all;}

Constructor

BroadcastChannel()

Creates an object linking to the named channel.

Properties

This interface also inherits properties from its parent, EventTarget.

BroadcastChannel.name Read only

Returns a DOMString, the name of the channel.

Event handlers

BroadcastChannel.onmessage

An EventHandler property that specifies the function to execute when a message event is fired on this object.

BroadcastChannel.onmessageerror

An EventHandler called when a MessageEvent of type MessageError is fired—that is, when it receives a message that cannot be deserialized.

Methods

This interface also inherits methods from its parent, EventTarget.

BroadcastChannel.postMessage()

Sends the message, of any type of object, to each BroadcastChannel object listening to the same channel.

BroadcastChannel.close()

Closes the channel object, indicating it won't get any new messages, and allowing it to be, eventually, garbage collected.

Events

message

Fired when when a message arrives on the channel.
Also available via the onmessage property.

messageerror

Fired when a message arrives that can't be deserialized.
Also available via the onmessageerror property.

Specifications

Browser compatibility

See also

• Another, more heavyweight, way of communicating between browser contexts: ServiceWorker.
• Broadcast Channel API overview