使用window.postMessage进行iframe跨域数据通信

Posted 2023-03-09

参考技术A iframe跨域，但又需要进行通信，决定使用window.postMessage进行通信。以下是使用中遇到的一些注意点。

受限的window对象打印展示global，一开始以为是非window对象，后来经实验发现其实它就是子iframe的window对象，只不过是跨域受限，只能访问部分接口

通过给iframe传消息，获取到父级窗口的window，拿iframe的window跟父级的frames里存的iframe的受限window进行判断，结果为true。

一开始以为只要调用window.parent.postMessage('test'); 就能给父级传数据；

第二个参数指定哪个窗口可以接受消息，不在指定范围内的，不会传播。

所以猜测第二个参数不传的话，默认是同域窗口可以接收。所以才会出现同域可以，跨域接收不到。

一般不建议用*，会有安全问题，这里只作为测试

window.postMessage的第二个参数指定哪些窗口可以接收消息，不指定的话默认是同域可接收。故跨域情况下，需要指定第二个参数为父级域名，才能通信成功。