window.postmessage() to communicate between applications in different tabs

送分小仙女□ 提交于 2019-11-29 23:53:10

问题


Is there a chance to use window.postmessage() to communicate between two different applications in different tabs in the same browser?

I know you can do it between application and iFrame, but how about different tabs?

Update:

Case scenario:

  1. user plays audio from vk.com in one tab

  2. user starts playing video from youtube.com in another tab

  3. youtube.com sends postmessage() to vk.com that video started playing

  4. vk.com makes audio silent

Thanks


回答1:


It can be done if you use an "intermediate page" loaded in an iFrame.

The (theoretical) solution uses two separate methods of inter-page communication:

  • window.postMessage()
  • localStorage or sessionStorage - see this guide for how this works; the technique involves setting values in one iFrame, and listening for events in the other iFrame.

The "intermediate page" acts as a proxy, translating message events into localStorage events, and vice-versa. If you load this "intermediate page" in an iFrame from both pages, then any messages you post in one tab will pop out in the other tab:

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

If one of the tabs is on the same domain as the intermediate page (illustrated here as Tab 2), this can be simplified (without affecting the other tab's setup).

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


来源:https://stackoverflow.com/questions/25271243/window-postmessage-to-communicate-between-applications-in-different-tabs

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!