window.postmessage()在不同选项卡中的应用程序之间进行通信

Question

是否有机会使用window.postmessage()在同一浏览器的不同选项卡中的两个不同应用程序之间进行通信？

我知道你可以在应用程序和iFrame之间做到这一点,但不同的标签呢？

更新:

案例场景:

1. 用户在一个选项卡中播放来自vk.com的音频

2. 用户开始在另一个标签页面中播放来自youtube.com的视频

3. youtube.com将postmessage()发送到视频开始播放的vk.com

4. vk.com使音频保持沉默

谢谢

Answer 1

如果您使用iFrame中加载的"中间页面",则可以执行此操作.

(理论)解决方案使用两种不同的页间通信方法:

• window.postMessage()
• localStorage或sessionStorage(参见本指南了解其工作原理)

"中间页面"充当代理,将消息事件转换为localStorage事件,反之亦然.如果您从两个页面的iFrame中加载此"中间页面",那么您在一个选项卡中发布的任何邮件都会在另一个标签中弹出:

[Tab 1] --(postMessage)--> [iFrame 1]
                                |
                          (localStorage)
                                |
                                v
                           [iFrame 2] --(postMessage)--> [Tab 2]

如果其中一个选项卡与中间页面位于同一域中(此处显示为Tab 2),则可以简化(不影响其他选项卡的设置).

[Tab 1] --(postMessage)--> [iFrame 1]
                                |
                          (localStorage)
                                |
                                v
                             [Tab 2]