Uncaught DOMException: Blocked a frame with origin “你的url“ from accessing a cross-origin frame.

Uncaught DOMException: Blocked a frame with origin "你的url" from accessing a cross-origin frame.

父页面和子页面不是同一个域名,所以才会报这个错误；

我的业务逻辑是“子页面”需要向“父页面”传递数据；

----------

如果你的业务和我的业务是相反的；

你只需要子页面调用 window.addEventListener()方法，该方法的意思是接受消息。

父页面调用parent.postMessage()方法，该方法的意思是发送消息。

----------

延伸阅读

页面嵌套iframe怎么调用父页面的方法，子页面回调父页面函数方法_iframe子页面调用父页面函数_橙-极纪元的博客-CSDN博客

第一步：父页面页面需要这样写

  //回调方法
  var getChildCallBackFun = function (data) {
    console.log('子页面回调的【全部】数据data==', data);
	console.log('子页面回调的【我想要的】数据data==', data.data);
	}; 

 //监听message事件，
 window.addEventListener('message', getChildCallBackFun, false);

 //载入子页面
 document.write('<iframe src="你的url" frameborder="0" style="display: none; width: 0px; height: 0px;"></iframe>'); 

第二步：子页面页面需要这样写

parent.postMessage({mgs:'我是子页面传递过来的数据'}, "*");

结果 

子页面回调的【全部】数据data

子页面回调的【我想要的】数据data 

 

---

延伸阅读

window.postMessage

window.postMessage() 方法可以安全地实现跨源通信。通常，对于两个不同页面的脚本，只有当执行它们的页面位于具有相同的协议（通常为 https），端口号（443 为 https 的默认值），以及主机 (两个页面的模数 Document.domain设置为相同的值) 时，这两个脚本才能相互通信。window.postMessage() 方法提供了一种受控机制来规避此限制，只要正确的使用，这种方法就很安全。

window.postMessage - Web API 接口参考 | MDN

Window postMessage() 方法 | 菜鸟教程

Window 对象 | 菜鸟教程