Skip to content

The BroadcastChannel API

New Course Coming Soon:

Get Really Good at Git

Learn the basics of 1-to-many communication using the BroadcastChannel API

The Channel Messaging API is a great way to send 1-to-1 messages from a window to an iframe, from a window to a Web Worker, and so on.

The BroadcastChannel API can be used to send 1-to-many messages, communicating to multiple entities at the same time.

You start by initializing a BroadcastChannel object:

const channel = new BroadcastChannel('thechannel')

To send a message on the channel you use the postMessage() method:

channel.postMessage('Hey!')

A message can be any of those supported values:

To receive messages from the channel, listen to the message event:

channel.onmessage = (event) => {
  console.log('Received', event.data)
}

This event is fired for all listeners, except the one that is sending the message.

You can close the channel using:

channel.close()
Are you intimidated by Git? Can’t figure out merge vs rebase? Are you afraid of screwing up something any time you have to do something in Git? Do you rely on ChatGPT or random people’s answer on StackOverflow to fix your problems? Your coworkers are tired of explaining Git to you all the time? Git is something we all need to use, but few of us really master it. I created this course to improve your Git (and GitHub) knowledge at a radical level. A course that helps you feel less frustrated with Git. Launching May 21, 2024. Join the waiting list!
→ Read my DOM Tutorial on The Valley of Code
→ Read my Browser Events Tutorial on The Valley of Code
→ Read my Browser APIs Tutorials on The Valley of Code

Here is how can I help you: