前端广播式通信 BroadCast Channel(实现页面之间通信)

BroadCast Channel 可以帮我们创建一个用于广播的通信频道。当所有页面都监听同一频道的消息时,其中某一个页面通过它发送的消息就会被其他所有页面收到。它的API和用法都非常简单。

下面的方式就可以创建一个标识为AlienZHOU的频道:

const bc = new BroadcastChannel('AlienZHOU');

各个页面可以通过onmessage来监听被广播的消息:

bc.onmessage =function(e){constdata = e.data;consttext ='[receive] '+ data.msg +' —— tab '+ data.from;console.log('[BroadcastChannel] receive message:', text);};

要发送消息时只需要调用实例上的postMessage方法即可:

bc.postMessage(mydata);



详情参考  https://github.com/alienzhou/blog/issues/26     3分钟速览】前端广播式通信



页面之间通信其他方法           LocalStorage     vue专属 vuex

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容