iframe在同域时能自由操作iframe和父框架的内容(DOM),在跨域时可以实现页面跳转。
<iframe id="iframe" :src="iframeSrc" style="height: calc(100% - 50px)" width="100%" frameborder="0"></iframe>
获取iframe里面的内容
iframe.contentWindow, 获取iframe的window对象
iframe.contentDocument, 获取iframe的document对象
const _iframe = document.getElementById('iframe').contentWindow
CDM跨域
如果你设置的iframe的域名和你top window的域名完全不同,可以使用CDM(cross document messaging)进行跨域消息的传递。
发送消息: 使用postmessage方法
postMessage(message, targetOrigin)
message: 传递给iframe的内容, 通常是string,最好不要传object对象,需要传对象时,使用JSON.stringfy转换。
targetOrigin: 接受你传递消息的域名,可以设置绝对路径,也可以设置""或者"/"。 表示任意域名都行,"/