2010-11-08 53 views
4

请考虑以下两个域:domain1.com和domain2。跨域哈希修改通讯

从domain1我打开一个指向domain2的iframe。

现在,我希望这些人互相沟通,我已经通过在两个域上应用哈希变化事件侦听器成功完成了这些工作。

这样,如果domain2使用新散列调用parent.location,父窗口(domain1)中的散列将触发。此外,如果来自父项的i将其src属性更改为新散列,则iframe中的散列更改事件将触发。

这很好用!

来了麻烦:

在浏览器中的前进和后退的功能得到弄糟。简单地说,通过创建两个散列实例,必须单击浏览器后退按钮两次以获取父散列,因为它必须先循环iframe的散列。

如何在不锁定历史记录对象的情况下与跨域iframe进行通信?

谢谢!

+0

一个可能的(丑陋!)解决方案我来想想:我可以在domain1上追加一个指向domain2的脚本,如下所示:。这个JS文件将设置一个cookie,以便domain2上的另一个JS文件将侦听更改。当cookie发生变化时,有些事情已经发生了变化,您会采取相应的措对这种方法有什么想法? – John 2010-11-08 09:12:10

+0

虽然这可能不起作用。每次都需要一个请求。 – John 2010-11-08 09:16:33

回答

7

使用easyXDM,它是一个JavaScript库,为您完成所有的艰苦工作,使您能够在所有浏览器(包括IE6)中执行跨域通信和RPC。

这不会使用任何当前浏览器(甚至不包括IE6)的HashTransport,因此不会更改历史记录。

你不会找到更好的东西..

您可以阅读有关它的一些内部运作的这个Script Junkie article,或直接去readme at github

+0

嗨,肖恩,哇,真的令人印象深刻的工作,我现在正在实施它!会让你知道它是如何解决我的感谢到目前为止,伙计 – John 2010-11-08 14:47:55

+0

顺便说一句,哪些浏览器将利用HashTransport?需要阻止它们,因为它会与我现有的哈希实现一起用于书签和导航。 – John 2010-11-08 14:50:09

+0

感谢,感谢它。支持所有'A级'浏览器的自述文件列表,它们不会使用HashTransport。 – 2010-11-08 16:21:37

2

另一种跨域通信技术是(ab)使用window.name。它需要一个iframe最初具有相同域src,然后移动到另一个设置window.name的域,然后退回到原始源(退回到历史记录中)。这个想法是window.name不会改变,除非它被明确设置,这意味着你可以转移window.name数据跨域。

这种技术进行了更详细的描述:
- http://skysanders.net/subtext/archive/2010/10/11/leveraging-window.name-transport-for-secure-and-efficient-cross-domain-communications.aspx
- http://jectbd.com/?p=611

一定要选择避免在IE中点击声音的实施。

不幸的是,它仍然与你的历史混杂在一起,但它向前迈进了一步,然后又回到了它所处的历史点。然而,一个很大的好处是,你不必解析和编码URI字符串,但可以立即使用JSON。

Using JSON lib for example

// access window.name from parent frame 
// note: only when iframe stepped back to same domain. 
var data = JSON.parse(iframe.contentWindow.name); 

// set child frame name 
// note: only when iframe stepped back to same domain. 
iframe.contentWindow.name = JSON.stringify({ 
    foo : "bar" 
}); // to JSON string 

// set own name (child frame) 
window.name = JSON.stringify({ 
    foo : "bar" 
}); // to JSON string 

该Cookie技术是可行的为好,因为如果你想避免历史的变化,但仍然需要http请求您需要执行目标的iframe Ajax请求这两种技术。 这样:

  1. 将数据发送到iframe的x(采用饼干或window.name技术)
  2. 与iframe中轮询器捕捉数据x
  3. 执行在iframe中X AJAX请求。
  4. 发送数据退回IFrame Y(使用的cookie或window.name技术)
  5. 与轮询器捕捉数据中的iframeý
  6. 执行做作狱。

任何页面刷新(httprequest)或网址更改都会更新历史记录(旧版或所有IE版本除外),因此需要更多的代码。

+0

谢谢你的详尽答案!非常感激。但是,你确定这是跨域的吗?当我尝试访问iframe中的window.name时:Error:Permission denied for 获取属性Window.name。 – John 2010-11-08 10:23:00

+0

研究它,你使用了哪个浏览器? – BGerrissen 2010-11-08 10:25:11

+0

macosx上的Firefox 3.6.12。在Chrome 7中也会发生:不安全的JavaScript尝试从URL http://domain2.com的帧中访问URL http://domain1.com。域,协议和端口必须匹配。 – John 2010-11-08 10:31:01