JavaScript;具有相同原点的标签/窗口之间的通信[重复

StackOverflow https://stackoverflow.com/questions/2236828

题

这个问题在这里已经有一个答案：

我有两个窗口：窗口A和窗口B。

  • 窗口A和窗口B具有相同的域
  • 窗口A和窗口B没有任何父窗口。

问题：

  1. 窗口A是否可以获取窗口B的引用？
  2. 什么是使窗口通知窗口B的最优雅方法？
    （包括新的HTML5规格）

我知道这样做的两种方式：

  • 服务器消息传递：窗口B监管询问服务器是否已通知了某些内容
  • 通过本地数据消息传递（HTML5）：当窗口A想要通知某些内容时，它会更改本地数据，窗口B监管检查本地数据是否有任何更改。

但是两种方式并不是那么优雅。
例如，可以获取窗口B的引用并使用window.postmessage（）（html5），这是很不错的

最终目标是制作类似Facebook的事情，如果您打开4个Facebook标签并在一个选项卡中聊天，则聊天在每个Facebook选项卡中都是最新的，这很整洁！

有帮助吗？

解决方案

我坚持使用问题中提到的共享本地数据解决方案 localStorage. 。就可靠性，性能和浏览器兼容性而言，它似乎是最好的解决方案。

localStorage 在所有现代浏览器中都实现。

这 storage 事件会发射 其他 标签更改为 localStorage. 。这对于沟通目的非常方便。

参考可以在此处找到：
网站
Webstorage-存储事件

其他提示

BroadcastChannel标准允许这样做。现在它在Firefox和Chrome中实施（我可以用吗, MDN):

// tab 1
var ch = new BroadcastChannel('test');
ch.postMessage('some data');

// tab 2
var ch = new BroadcastChannel('test');
ch.addEventListener('message', function (e) {
    console.log('Message:', e.data);
});

共享工作者是可以在选项卡之间进行通信的通用过程的Whatwg/ HTML5规格。

你说你的：

Ut气候的目标是制作类似Facebook的事情，如果您打开4个Facebook选项卡，然后在一个选项卡中聊天，则在每个Facebook选项卡上实现聊天，Wich很整洁！

这应该作为您设计的副产品发生，查看模型（可能是服务器）以进行聊天的更新，而不是您必须在跨视图通信中进行设计。除非您正在处理传输大量数据，否则为什么要担心它？似乎没有巨大收益会使事情复杂化。

几年前，我发现如果我这样做 window.open 使用现有窗口和空白URL的名称，我得到了对现有窗口的引用（此行为甚至是 记录在MDC上 和评论 MSDN文档 建议它也适用于IE）。但是那是几年前，我不知道当今世界对此的支持有多普遍，当然，除非所有窗户都包含一个命名 iframe 用于通信，通过服务器端代码唯一命名，然后通过服务器端代码通信到其他窗口...（可怕的思想：这实际上可能是可行的。存储与已登录的“当前”窗口名称 - 在表中的帐户中，将列表提供给创建该帐户中的任何新窗口，cull旧的无活动条目。但是，如果列表略有过时，您将在搜索其他窗口时打开新窗口...从浏览器到浏览器，BET支持是IFF的。）

除了即将到来的 共享工作者, ，您也可以使用 跨文档消息传递, ，更广泛地 支持的. 。在这种情况下，必须有一个主窗口，该窗口负责打开所有其他窗口 window.open. 。然后，子窗可以使用 邮政 在他们的 window.opener.

如果使用闪光灯是您的选择 LocalConnection 实际上在安装闪存的任何客户端上都支持（示例代码).

其他后备方法：
带窗口的jQuery的后插件
基于饼干的非天然通信解决方案

阿法克（Afaik），如果他们没有同一个父母，就不可能在窗口上进行交流。

如果它们都从父窗口打开，则应该能够掌握父级的变量引用。

在父母中，这样打开窗户：

childA = window.open(...);
childB = window.open(...)

在Childa中，访问这样的孩子：

childB = window.opener.childA

我有一个整洁的方法来做这种技巧，但是有限制：您应该允许域名弹出式弹出窗口，并且您将始终打开一个页面（如tab或弹出窗口），这将在窗口之间实现通信。

这是一个例子：http://test.gwpanel.org/test/page_one.html（在启用域弹出式范围后，刷新页面）

此技巧的主要功能 - 弹出窗口是用URL片段“＃”打开的，最终，该强制浏览器不会更改窗口位置并存储所有数据。和窗口。

许可以下： CC-BY-SA 和 归因
不隶属于 StackOverflow
scroll top