因为嵌入的页面和主页面不同源,导致跨域问题,所以想使用postmessage进行通信。
//主页面调用方式
function excute(method){
var targetOrigin = 'http://www.a.com';
document.getElementById('iframeId').contentWindow.postMessage(method,targetOrigin);
}
嵌入页面 (域:http://www.b.com)
window.addEventListener('message',function(event){
var origin = event.origin || event.originalEvent.origin;
if(origin == 'http://www.a.com'){
console.log(event.data);
console.log(event.source);
if (!event.data) {
return;
}
excute(event.data);
}
},false);
function excute(methodName){
switch(methodName){
case 'methodA':
methodA();
break;
default:
console.log('cant match method');
}
}
如此使用会爆出methodA not defined的异常
但是在同源的情况下,直接使用又是可以的。
document.getElementById('iframeId').contentWindow.contentPane.methodA()
请问一下这个是什么问题哈