Javascript window.opener.postMessage 具有多个子域的跨源

Question

我正在尝试允许多个子域：

window.opener.postMessage(...);

这可行，但这并不安全，因为所有可能的域都被允许，我不希望这样：

window.opener.postMessage('MyMSG', '*');

这适用于单个域：

window.opener.postMessage('MyMSG', 'https://example.com');

但是如果我想允许这个怎么办：*.example.com ?

当然是这个：

window.opener.postMessage('MyMSG', '*.example.com');
window.opener.postMessage('MyMSG', 'https://*.example.com');
window.opener.postMessage('MyMSG', 'https://(.*)example.com');

无效

正确的做法是什么？这可能吗？

谢谢

Answer 1

targetOrigin 需要 * 或确切的 uri，即没有子域通配符。

如果您想 post 到多个目标，则需要为每个单独的 postMessage() 调用。为了使这更容易，您可以将所有域放入一个列表并遍历该列表，而不是对每个调用进行硬编码。

var someData = {};
var subdomains = ["one","two","three"];
for(var subdomain of subdomains){
  let target = "http://"+subdomain+".example.com"
  window.postMessage(someData,target);
}

但这伴随着保持列表更新的维护成本

现在，根据您的代码在哪一端，您还可以使用某些方法在运行时获取准确的 uri。注意示例使用 URL 仅解析协议和主机以获得传递给 postMessage.

的正确值

如果你在打开 window 的那一端，或者 iframe 的父级，你可以只获取 src、href 或任何属性用来指示 url 对于 window、iframe 等

//if using for instance window.open()
//you already know the url as it has to be passed to the function
var target = window.open("http://example.com/some/path");

//so in this case you would first save the url to a variable and use that variable for both
var url = new URL("http://example.com/some/path");
var targetDomain = url.protocol + "//" + url.host;

var target = window.open(url.href);
target.postMessage("message",targetDomain);

//if using an iframe just grab the src property and parse the domain from that
var url = new URL(iframeElement.src);
var targetDomain = url.protocol+"//"+url.host;
iframeElement.contentWindow.postMessage("message",targetDomain);

现在，如果您在另一端，即在 iframe 或打开的 window 中，您可以使用 document.referrer，但从安全页面。这意味着当您打开 http:// url 时，当您的页面使用 https://

时，不会设置 document.referrer

var url = new URL( document.referrer );
var target = url.protocol+"//"+url.host;
//opened window
window.opener.postMessage("message",target);
//iframe
window.parent.postMessage("message",target);

Javascript window.opener.postMessage 具有多个子域的跨源

Javascript window.opener.postMessage Cross Origin with multiple sub domains

javascript

cross-domain

postmessage

multiple-domains