在同一浏览器的选项卡/窗口之间进行Javascript通信的最可靠方法是什么?例如,当Tab 2开始音频播放时,Tab 1以某种方式知道这一点并且可以暂停它的播放器.
我正在建立一个带有音乐播放器的网站...所以,如果你打开两个标签到网站,你可以在两者上开始播放音乐.这显然很糟糕,所以我试图找到一个解决方案.
有任何想法吗?谢谢
我正在寻找一种方法,如何在浏览器中的多个选项卡或窗口之间进行通信(在同一个域上,而不是CORS),而不留痕迹.有几个解决方案:
第一个可能是最糟糕的解决方案 - 你需要从当前窗口打开一个窗口,然后只要你打开窗户就可以进行通信.如果您在任何窗口中重新加载页面,则很可能会丢失通信.
第二种方法,使用postMessage,可能启用跨源通信,但遇到与第一种方法相同的问题.您需要维护一个窗口对象.
第三种方式,使用cookie,在浏览器中存储一些数据,这可以有效地看起来像向同一域上的所有窗口发送消息,但问题是你永远不知道所有标签是否已经读过"消息"打扫干净.您必须实现某种超时以定期读取cookie.此外,您受限于最大cookie长度,即4KB.
使用localStorage的第四种解决方案似乎克服了cookie的限制,甚至可以使用事件进行监听.接受的答案中描述了如何使用它.
编辑2018:接受的答案仍然有效,但现代浏览器有一个更新的解决方案,使用BroadcastChannel.有关如何使用BroadcastChannel在选项卡之间轻松传输消息的简单示例,请参阅其他答案.
是否有机会使用window.postmessage()在同一浏览器的不同选项卡中的两个不同应用程序之间进行通信?
我知道你可以在应用程序和iFrame之间做到这一点,但不同的标签呢?
更新:
案例场景:
用户在一个选项卡中播放来自vk.com的音频
用户开始在另一个标签页面中播放来自youtube.com的视频
youtube.com将postmessage()发送到视频开始播放的vk.com
谢谢