iframe 跨域

今天网站有个奇葩需求，OA系统和统计数据是两个站，统计数据在OA系统的iframe中打开，然后根据统计的量，要点开看明细，这些都是在数据层面处理出来的，然后又要明细上面能连接到OA系统的详细页上面去。当我正常操作，给了个错：

Blocked a frame with origin "http://XXXX" from accessing a frame with origin "http://XXXX".Protocols, domains, and ports must match.

阻止来源为“http://xxxx”的帧访问来源为“http://xxxx”的帧。协议、域和端口必须匹配。

意思就是协议、域名、端口不一致导致的，总的来说就跨域了，妈蛋。

 

其实解决方法很简单，在OA站的iframe外面注册一个事件

$(function () {
//注册量化页面弹出层
window.addEventListener('message', function (e) {
if (e.data[1] == "2")
MainshowIF("http://XXXXX?ID=" + e.data[0], 700, 500, '');//弹出
else
MainshowIF("http://XXXXX?id=" + e.data[0], 700, 500, '');//弹出
}, false);
})

 然后在点弹出层的页面上加入方法

function Show(ID, Type) {
        //* 为指定父级域名
        window.parent.postMessage([ID, Type], '*');
    }

调用这个方法就可以去执行父级的方法了。 

 [ID,Type] 对应前面e.data[0],e.data[1]，这个地方可以是各种类型，bool，int，Object

*可以指定域名，如果父级域名和指定的域名不一致，那么就无法调用父级页面的方法。

 

全js代码，真好，靠谱！