获取来自另一个域的 iframe 完整 url

Question

父页面可以获取 iframe 的 URL（和片段），但在 iframe 更新其 URL 片段后，父页面无法获取带有片段的更新 URL。

示例 iframe 网址： http://example.com/a/b/c/d.html?k1=v1#i1=j1（笔记片段）

这是在跨域环境中。父域与 iframe 域不同。目前仅使用 firefox 进行测试。

使用以下代码：

var ifr = document.getElementById('myiframe');
if(ifr){
   alert(ifr.src);
}

因为安全原因不可能吗？

我正在尝试让 iframe 使用片段作为有效负载与父级通信。

这两个域都在我的控制之下，我正在努力避免实现页面之间的通信。

还有其他不涉及服务器往返的技术吗？

Answer 1

您可以通过在任何window 对象上调用postMessage 来使用window.postMessage API 在帧之间进行通信。这适用于跨域消息传递，只要接收帧具有message 事件侦听器。

postMessage 用法：

otherWindow.postMessage(message, targetOrigin);
//e.g.
yourIFrame.contentWindow.postMessage({curURL: location.href}, "http://www.your2ndDomain.com");
//or
top.postMessage({curURL: location.href}, "http://www.your1stDomain.com");

收听消息：

window.addEventListener("message", function(e){
  //You must check your origin!
  if(event.origin !== "http://www.your1stDomain.com")
    return;
  //Get the data
  var data = event.data;
  alert(data.curURL);
}, false);