浏览器标签之间的通信(communication between browser tab)

2019-07-31 04:29发布

我一个HTML页面(main.html中)在使用javascript用window.open(“newtab.html”)方法相同的域打开一个新的标签。

在新的选项卡的用户做一些事情结束了他的活动点击一个按钮。 在这一点上,我想将消息发送到揭幕战窗口。 我试着使用于PostMessage但新标签,我不能有开门红的参考。

从新选项卡,我想是这样,但我有“KO”

var w = window.opener;
if (w) {
    w.postMessage("hi", "http://10.150.10.43");
} else {
    alert("ko");
}

什么是从二级标签/窗口发送消息给主要的一个(在同一个域)的最好方法?

非常感谢你卢卡

Answer 1:

这很奇怪。 打开一个新的窗口window.open("newtab.html")应该给新打开的窗口通过引用揭幕战的能力window.opener

无论如何,有对同一域中的两个窗口之间通信的其他几个选项。 我认为,以下两个是最容易实现的:

  1. 使用localStorage的 。 如果您存储下的新标签窗口中的一些关键到localStorage的一些数据,那么首战窗口将得到一个存储事件。 如果赶上事件与处理程序,你可以阅读从localStorage的,你在新标签窗口写数据。 需要注意的是事件被触发只有当这两个网页相同的域,如果确实有问题两个窗口(事件不是写数据在同一窗口内发射)。 有关如何做到这一点的详细信息-例如参见: http://diveintohtml5.info/storage.html

  2. 使用共享的Web工人 。 网络工作者是在一个单独的线程后台执行JS脚本。 共享网络工作者是一种特殊类型的Web工人,允许任意数量的父文件用一个工人进行沟通。 所以,你可以用工人的揭幕战窗口和新的标签窗口之间中继消息。 与工人沟通的API是非常相似的postMessage API。 有关如何做到这一点的详细信息-例如参见: http://www.sitepoint.com/javascript-shared-web-workers-html5/ 。



文章来源: communication between browser tab