为什么iframe不能设置其父级的location.hash？

Question

我有一个包含iframe的窗口,其中包含iframe,如下所示:

+---------------+
|      Top      |
| +-----------+ |
| |   Middle  | |
| | +-------+ | |
| | | Inner | | |
| | +-------+ | |
| +-----------+ |
+---------------+

Top和Middle位于同一个域中,但Inner位于不同的域中.我需要Inner与Top交流.我知道这样做的唯一方法是IE7支持(我需要支持)是改变窗口位置的哈希值.但是,我不希望信息在位置栏中闪烁,所以我介绍了中间iframe.

我希望Inner改变Middle的哈希值.Middle会读取它的哈希并通知Top,它有权直接与之交谈.

但是,在Firefox 3中,我无法从Inner写入Middle的哈希.不会引发错误,但哈希值不会改变.写入它location.href会引发权限错误.

Top可以写入Middle的哈希值,而Middle可以写入Inner的哈希值,Top可以写入Inner的哈希值,而Inner和Middle都可以写入Top的哈希值,因此唯一无效的有序对就是我想!(我一直在研究这个问题.)

我在最小的测试用例中复制了这个.起初,我在同一个域中提供了所有三个页面.当我将Inner放在不同的域上时,我会遇到有问题的行为.当我将Middle放在第二个域名时,每个人都可以再次写信给所有人.

为什么Inner不能写入Middle的哈希？

---

附录:许多人认为,由于同源政策,这不可能实现.这正是我试图解决的政策.这个确切的案例 - 设置(但不是读取)另一个窗口的位置 - 应该可以跨域.我没有找到这种效果的浏览器文档,但我发现了很多文章和演示.这基本上是HTML 5的前身postMessage().

参考:http://softwareas.com/cross-domain-communication-with-iframes

Answer 1

父框架可以使用以下方法设置子项的iframe'src属性(此处使用jquery):

$("#iframeWindow").attr('src', "http://<CHILD URL>/#hello");

子iframe可以使用以下方法设置父窗口的href(地址栏内容):

window.top.location.href = "http://<PARENT URL>/#hello"

在父母和/或孩子中,您需要轮询更改,

var last = "";
setInterval(function() {
    if(last == window.location.href) return;
    last = window.location.href;

    //do stuff with 'window.location.hash'
}, 1000);

请注意,如果可以,那就太好了

window.top.location.href = window.top.location.href + "#hello"

但是不允许读取位置对象(href和hash)

在11月3日测试,在chrome,ie6/7/9,firefox 3.6/4

edit1:如果人们愿意,可以进行现场演示

edit2:http://dl.dropboxusercontent.com/u/14376395/html/xdomain.html :)

edit3:注意:如果您使用的是这种方法,请确保您可以控制所有iframe页面,否则恶意的第三方网站可能会使用哈希标记控制您的

edit4:更好的解决方案http://ternarylabs.com/2011/03/27/secure-cross-domain-iframe-communication/目前正被Google JavaScript API使用

edit5:dropbox域名更改为"dl.dropboxusercontent.com"