本文详细介绍了在iframe嵌套场景中解决跨域通信的问题。通过创建一个代理iframe（proxy）进行参数传递，利用localStorage事件监听或window.top对象触发父页面（main）的方法，实现child与main之间的交互。讨论了两种方法的实现细节、浏览器兼容性和适用场景，指出这些方法仅支持子到父的单向通信，并提醒避免传输重要数据。
1. 问题描述：
两个不同系统之间的iframe需要进行进行交互，例如在main（代指主页面 80端口）里用iframe嵌套了child（代指嵌套的iframe 8080端口），child进行一些操作成功后，通知main，main再进行相应的操作。2. 解决思路：
利用iframe可以跨域的特点，
1. 在child内部动态创建一个url为proxy（代指和main在同一系统内的页面 80端口）的iframe，
2. 通过url把参数传递给proxy，
3. 最后再利用proxy去触发main的相应操作
3. 实现方式：
- 方式一
通过监听storage的变化来实现通知main页面
main
<!DOCTYPE html>
<html lang="en">
最低0.47元/天 解锁文章
扫一扫
1328
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
