Web页面跨域通信方法和装置制造方法及图纸

技术编号:8685642 阅读:143 留言:0更新日期:2013-05-09 05:13
一种Web页面跨域通信方法,包括以下步骤:添加能被不同域的Web页面访问的API对象,所述对象实现了消息通知方法以及所述方法的监听事件;绑定第一Web页面的回调函数与所述监听事件;在第二Web页面向所述第一Web页面发送消息时,调用所述消息通知方法;触发所述监听事件,将所述消息传递给所述第一Web页面的回调函数;所述第一Web页面与所述第二Web页面属于不同的域。上述Web页面跨域通信方法实现了不同域的Web页面之间的跨域通信,且成本较低。此外,还提供一种Web页面跨域通信装置。

【技术实现步骤摘要】
Web页面跨域通信方法和装置
本专利技术涉及网络技术,特别涉及一种Web页面跨域通信方法和装置。
技术介绍
API(ApplicationProgrammingInterface,应用程序编程接口)是一些预先定义的函数,目的是提供应用程序(或开发人员)基于某软件(或硬件)的访问一组例程的能力,而又无需访问软件的源码,或理解软件的内部工作机制的细节。WindowsAPI是一套用来控制Windows的各个部件的外观和行为的预先定义的Windows函数。用户的每个动作都会引发一个或几个函数的运行以告诉Windows发生了什么。一个HTML页面可以有一个或多个Web子页面(子框架),Web子页面中可以嵌套Web子页面,这些Web子页面可能属于不同的域,而不同域的Web子页面之间也有相互通信的需求。但是IE8版本以前的浏览器出于安全的考虑,不能自动支持不同域的Web页面之间的跨域通信,而IE8版本以前的浏览器又占有很大的市场份额。因此,需要解决IE8版本以前的浏览器中不同域的Web页面之间的跨域通信的问题。传统的方法是设置一台中转服务器,需要跨域通信的两个Web页面通过中转服务器通信。还有一种方法是采用部署代理文件的方式,例如,在域名为A的Web页面中部署域名为B的Web页面的代理文件,并在域名为B的Web页面中部署域名为A的Web页面的代理文件,两个Web页面通过代理文件实现跨域通信。但是,上述设置中转服务器的方法会带来额外的开销,增加了成本,而采用部署代理文件的方法,则也需要较高的部署成本。
技术实现思路
基于此,有必要提供一种能减少成本的Web页面跨域通信方法。一种Web页面跨域通信方法,包括以下步骤:添加能被不同域的Web页面访问的API对象,所述对象实现了消息通知方法以及所述方法的监听事件;绑定第一Web页面的回调函数与所述监听事件;在第二Web页面向所述第一Web页面发送消息时,调用所述消息通知方法;触发所述监听事件,将所述消息传递给所述第一Web页面的回调函数;其中,所述第一Web页面与所述第二Web页面属于不同的域。此外,还有必要提供一种能减少成本的Web页面跨域通信装置。一种Web页面跨域通信装置,包括:初始化模块,用于添加能被不同域的Web页面访问的API对象,所述对象实现了消息通知方法以及所述方法的监听事件,以及绑定第一Web页面的回调函数与所述监听事件;消息通知模块,用于在第二Web页面向所述第一Web页面发送消息时,调用所述消息通知方法;回传模块,用于触发所述监听事件,将所述消息传递给所述第一Web页面的回调函数;其中,所述第一Web页面与所述第二Web页面属于不同的域。上述Web页面跨域通信方法及装置,通过添加能被不同域的Web页面访问的、且实现了消息通知方法以及该方法的监听事件的API对象,不同域的Web页面都可调用此API对象的消息通知方法发送消息,还可以绑定其回调函数与消息通知方法的监听事件,以响应向该Web页面传送的消息,实现了不同域的Web页面之间的跨域通信。由于不需要设置中转服务器或者部署代理文件来进行跨域通信,因此上述Web页面跨域通信方法和装置能减少成本。【附图说明】图1为一个实施例中的Web页面跨域通信方法的流程示意图;图2为一个实施例中第一Web页面与第二Web页面通信的示意图;图3为一个实施例中的Web页面跨域通信装置的结构示意图。【具体实施方式】如图1所示,在一个实施例中,一种Web页面跨域通信方法,包括以下步骤:步骤S10,添加能被不同域的Web页面访问的API对象,该对象实现了消息通知方法以及该方法的监听事件。具体的,在一个实施例中,该API对象为窗口对象的全局成员对象。由于Web页面都继承自它们的基类,即窗口对象(window对象),属于不同域的Web页面都可访问窗口对象的全局成员对象(即external成员),因此API对象可以为窗口对象的全局成员对象,以能够被不同域的Web页面访问。该API对象为窗口对象的全局成员对象,则不同域的Web页面都可调用该API对象的消息通知方法来传送消息。进一步的,为了响应消息通知方法传送的消息,该API对象还实现消息通知方法的监听事件。当消息通知方法被调用时,即可触发监听事件。在一个实施例中,API对象可封装在浏览器插件或浏览器扩展组件中、或者内置于浏览器中。具体的,对于基于组件对象模型(componentobjectmodel,COM)的浏览器,如IE浏览器,可将该API对象封装在浏览器的扩展组件中,因为IE浏览器内核有一种扩展机制,提供了专门的接口(扩展组件)来实现窗口对象(window对象)的全局成员对象(extemal成员)。另外,对于可安装浏览器插件的浏览器,API对象也可封装在浏览器插件中,并通过安装浏览器插件来添加API对象;其次,对于可自定义的浏览器,可直接将API对象添加到浏览器的代码中。步骤S20,绑定第一Web页面的回调函数与上述监听事件。具体的,可在第一Web页面加载时或在加载完成后注册API对象的消息通知方法的监听事件,即绑定页面的回调函数与该监听事件。触发该监听事件即是触发回调函数,因此当消息通知方法被调用时,即可触发回调函数以响应消息通知方法通知的消息。步骤S30,在第二Web页面向第一Web页面发送消息时,调用API对象的消息通知方法,其中,第一Web页面和第二Web页面属于不同的域。由于添加的该API对象可被不同域的Web页面访问,因此在第二Web页面向第一Web页面发送消息时,可将第二Web页面要发送的消息传递给消息通知方法,并调用该消息通知方法。在一个实施例中,调用API对象的消息通知方法的步骤为:将第一Web页面的属性信息及第二Web页面的消息传递给该消息通知方法,调用该消息通知方法。具体的,第一Web页面的属性信息可包括第一Web页面的名称、所属域名等。将第一Web页面的属性信息传递给消息通知方法,这样便能根据第一Web页面的属性信息将消息正确地传送到第一Web页面。步骤S40,触发上述监听事件,将第二Web页面的消息传递给第一Web页面的回调函数。在一个实施例中,在将第二Web页面的消息传递给第一Web页面的回调函数之前,还包括:根据传递给API对象的消息通知方法的第一Web页面的属性信息查找第一Web页面的回调函数。具体的,API对象的监听事件可能与多个页面的回调函数绑定,所以在监听事件被触发后,需要判断把消息传送给哪个页面的回调函数。可根据在上述传递给API对象的消息通知方法的第一Web页面的属性信息来查找第一Web页面的回调函数。进一步的,将第二Web页面的消息传递给第一Web页面的回调函数。第一Web页面的回调函数可以对第二Web页面的消息作相应的处理。在一个实施例中,如图2所示,第一Web页面与第二Web页面属于不同的域。具体的,第一Web页面和第二Web页面可以包含于一个HTML页面中,例如,是HTML页面中的两个Frame(也称IFrame,HTML页面中的frame标签定义了一个框架)。本实施例中,第二Web页面嵌套在第一Web页面中。应当说明的是,第一Web页面与第二Web页面也可以是并列关系。本实施例中,extemal成员为添加的能被不同本文档来自技高网...
Web页面跨域通信方法和装置

【技术保护点】
一种Web页面跨域通信方法,包括以下步骤:添加能被不同域的Web页面访问的API对象,所述对象实现了消息通知方法以及所述方法的监听事件;绑定第一Web页面的回调函数与所述监听事件;在第二Web页面向所述第一Web页面发送消息时,调用所述消息通知方法;触发所述监听事件,将所述消息传递给所述第一Web页面的回调函数;其中,所述第一Web页面与所述第二Web页面属于不同的域。

【技术特征摘要】
1.一种Web页面跨域通信方法,包括以下步骤:通过基于组件对象模型的浏览器内核提供的扩展组件添加能被不同域的Web页面访问的API对象,所述API对象为窗口对象的全局成员对象,所述对象实现了消息通知方法以及所述消息通知方法的监听事件;绑定第一Web页面的回调函数与所述监听事件;在第二Web页面向所述第一Web页面发送消息时,将所述消息传递给所述消息通知方法,调用所述消息通知方法;触发所述监听事件,将所述消息传递给所述第一Web页面的回调函数;其中,所述第一Web页面与所述第二Web页面属于不同的域。2.根据权利要求1所述的Web页面跨域通信方法,其特征在于,所述API对象封装在浏览器插件或浏览器扩展组件中、或者内置于浏览器中。3.根据权利要求1所述的Web页面跨域通信方法,其特征在于,所述调用所述消息通知方法的步骤为:将所述第一Web页面的属性信息及所述消息传递给所述消息通知方法,调用所述方法。4.根据权利要求3所述的Web页面跨域通信方法,其特征在于,在所述将消息传递给所述第一Web页面的回调函数的步骤之前,还包括:根据所述传递给消息通知方法的第一Web页面的属性信息查找所述第一Web页面的回调函数。5.根据权利要求1至4任意一项所述的Web页面跨域通信方法,其特征在于,所述API对象为窗口对象的全局成员对象。6.一种Web页面跨域通信装置...

【专利技术属性】
技术研发人员:黄奎李临郭学亨龙丁奋
申请(专利权)人:腾讯科技深圳有限公司
类型:发明
国别省市:

网友询问留言 已有0条评论
  • 还没有人留言评论。发表了对其他浏览者有用的留言会获得科技券。

1