Communication between multiple tab

Introduction

Communication between multiple tab is a common need in web app now a days.

e.g- Apps like music players, video players etc require players to be stopped in one tab when user start player in another tab.

For this a new Api BroadcastChannel has been introduced to have communication between tabs.

If you want to look at codes, feel free to use project — https://github.com/ujjwalguptaofficial/broadcastchannel-demo

Let’s Code

Create Channel

var channel = new BroadcastChannel("my_channel");

Recieve message

channel.onmessage = function (payload) {
   var message = payload.data
}

Send message

channel.postMessage("Hello");

Note :- It can be only used for same domain app.

References

• https://developer.mozilla.org/en-US/docs/Web/API/BroadcastChannel/BroadcastChannel
• https://github.com/ujjwalguptaofficial/broadcastchannel-demo