Messager 跨域解决方案

本文介绍了一种使用Messager实现跨域通信的方法。通过在主页面加载子页面的iframe,并利用Messager作为信使进行消息传递,实现了不同域名下的页面间通信。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

网上别人资源,自己记录防止忘记

该方案使用Messager 做为跨域的信使,

1、主页面使用iframe对子页面进行加载

<iframe id="iframe1" src="http://www.test.com/child1.html" width="550px" height="300px"></iframe>

2、在主页面中添加js

(1)构造信使Messager

 var messenger = new Messenger('child', 'MessengerDemo');

(2)在父页面添加对子页面消息的监听,

messenger.listen(function (msg) {
         //具体对接收到的页面的消息的处理
        });

  (3)要向子页面发送消息,就要先添加子页面的Window的对象

messenger.addTarget(iframe1.contentWindow, 'iframe1');

3、在子页面中添加js,在子页面中添加的js也和父页面中相同


注意:

在父页面中添加目标(messenger.addTarget(object,"Name"))一定要保证object是有效的,如

  messenger.addTarget(document.getElementById('iframe1').contentWindow, "Name");

这局话一定要放在<iframe id="iframe1" src="http://www.test.com/child1.html" width="550px" height="300px"></iframe>之后

将主页面和子页面进行通信是,子页面中messenger.addTarget(object,"Name")和父页面中的new Messenger('Name', 'MessengerDemo')中Name必须相同;

父页面中的messenger.addTarget(object,"Name")和子页面中的new Messenger('Name', 'MessengerDemo')的Name必须相同才能进行消息传递。

Messager文件下载

  


评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值