合作页面之间的跨域、跨表通信

Cross-domain, cross-tab communication between co-operating pages

本文关键字:通信 之间      更新时间:2023-09-26

假设我有两个选项卡,每个选项卡都有一个加载到不同域上的网页。 两个选项卡中的页面想要通信。

我能看到的最简单的解决方案是这个(我对我在搜索重复项时发现的一个密切相关问题的回答),其中一个或两个页面加载一个中间页面 iFrame,该页面代理postMessage()localStorage事件之间。 但是,这确实需要将此页面托管在某个位置,以及客户端的额外请求。

是否有任何技术不需要由其中一个域提供专门的"代理页面"? (也就是说,这可以由没有支持服务器的JavaScript库实现?

这个javascript库似乎提供了你正在寻找的功能(即,支持浏览器选项卡之间的跨源通信)。我还没有使用过这个,但会在我的应用程序中尝试这个。https://github.com/wingify/across-tabs 退房。

我可能选择创建一个后端 API 服务作为 2 个不同网站之间的公共通信隧道。

例如。 Site-A send a POST message to https://your-API-service When Site-B asks for an update to https://your-API-service Then API service returns the message previously sent from Site-A 如果您需要实时通信,您还可以使用 WebSockets 或推送通知

窗口。PostMessage API就是你要找的。

https://developer.mozilla.org/en-US/docs/Web/API/Window/postMessage

window.postMessage() 方法安全地启用 Window 对象之间的跨源通信;例如,在页面和它生成的弹出窗口之间,或者页面和嵌入其中的 iframe 之间。