浏览器页面间通信新接口BroadcastChannel的用法

时间:2022-02-17 16:42:16

Broadcast Channel API允许同源(同一站点)的浏览器上下文(包括窗口,标签,框架或iframe)之间的简单通信。
 

通信的方式如图:

浏览器页面间通信新接口BroadcastChannel的用法

用法

构建channel

var bc = new BroadcastChannel('test_channel');

test_channel参数用来指定channel的名称,连接到相同名称的BroadcastChannel,可以监听到这个channel分发的消息。

发送消息

bc.postMessage('This is a test message.'); 

接收消息

bc.onmessage = function (ev) { console.log(ev); }

关闭channel

bc.close()