【3分钟速览】前端广播式通信：Broadcast Channel

Broadcast Channel 是什么？

在前端，我们经常会用postMessage来实现页面间的通信，但这种方式更像是点对点的通信。对于一些需要广播（让所有页面知道）的消息，用postMessage不是非常自然。Broadcast Channel 就是用来弥补这个缺陷的。

顾名思义，Broadcast Channel 会创建一个所有同源页面都可以共享的（广播）频道，因此其中某一个页面发送的消息可以被其他页面监听到。

下面就来速览一下它的使用方法。

如何使用？

Broadcast Channel 的 API 非常简单易用。

创建

首先我们会使用构造函数创建一个实例：

const bc = new BroadcastChannel('alienzhou');
复制代码

可以接受一个DOMString作为 name，用以标识这个 channel。在其他页面，可以通过传入相同的 name 来使用同一个广播频道。用 MDN 上的话来解释就是：

There is one single channel with this