Question

有没有办法在javascript中的多个网页之间进行客户端进程间通信？理想情况下，我希望在没有任何复杂的服务器状态更新，ping等的情况下完成此操作，并使其仅在客户端上运行。如果我也可以制作这种跨浏览器，我会在天堂哈哈。有任何想法吗？谢谢！

Answer 1

进行窗口间通信的方法有很多种。它们是Window.postMessage，本地存储，WebRTC，以及现在的共享Web工作者。

每一项都有各自的优点/缺点：

本地存储仅适用于同源页面（来源为protocol：// website：port）。它还将消息广播到同一来源的每个打开的窗口，因此如果你打开了很多页面它会很慢）不幸的是，这是IE11及以下版本支持的唯一跨窗口技术。
共享工作者仅在Chrome和Firefox中受支持（并且仅支持同源，并且worker.js文件必须从同一来源加载）。您还必须将通信流量从一个页面“中继”到另一个页面。
Window.postMessage仅适用于父/子窗口，但它支持跨源！

在两个独立网站之间进行跨域通信非常笨拙。您必须从第一个网站执行window.open（）并使用postMessage与第二个网站进行通信，或者您必须设置这个复杂的体系结构，您可以在每个网站上使用隐藏的iframe与托管的网页进行通信在相同的网站地址上，这些iframe然后通过本地存储或共享工作者相互通信。这被称为“通信枢纽”。（很复杂，对吗？）

更糟糕的是，页面间通信被视为一个安全漏洞而且几乎被避开了。如果有些人有他们的方式，我想象将删除跨源postMessage。我希望看到的是一些协议增强功能和一些类似oAuth的技术，因此我们可以保证技术的合理性。将来会有很多数据移动到客户端，并且在网页之间共享它将变得至关重要。

那就是说，不要重新制造车轮。有几个库可以使窗口间通信成为可能。

Endpoint.js - 我开发的一个库（免责声明），用于调解窗口（多个源），选项卡，Web工作者，客户端/服务器之间的通信，以及进程之间的IPC。它还创建了一个ad-hoc覆盖网络，允许所有这些技术相互传递信息。
crosstab - 实施上述“通信中心”方法。
ozp-iwc - 来自OZone Widget Framework的IPC框架。启用本地存储和PostMessage

Answer 2

尝试使用message writer

的代码

function sendMessage(name, value) {
    var expires = "";
    document.cookie = name + "=" + value + expires + "; path=/";
}

sendMessage("test", "hello world!")

打开第二个窗口并try this message listener

function getMessage(c_name) {
    if (document.cookie.length > 0) {
        c_start = document.cookie.indexOf(c_name + "=");
        if (c_start != -1) {
            c_start = c_start + c_name.length + 1;
            c_end = document.cookie.indexOf(";", c_start);
            if (c_end == -1) {
                c_end = document.cookie.length;
            }
            return unescape(document.cookie.substring(c_start, c_end));
        }
    }
    return "";
}
function check() {
    var message = getMessage('test');
    var element = document.getElementById('output');
    element.innerHTML = message;
}
window.setInterval(check, 1000);

在Chrome上正常运行，你也应该确保它在其他主流浏览器中运行，特别是在IE上

WWW中的页面间通信？

2 个答案: