一种Web页面窗口对象的通信方法及系统技术方案

本发明专利技术提供一种Web页面窗口对象的通信方法及系统，所述Web页面窗口对象的通信方法包括如下步骤：调用发送窗口对象的消息发送函数向目标窗口对象发送消息事件，其中，所述消息事件包括：待发送的数据以及以所述发送窗口对象为来源的来源属性；令所述目标窗口对象调用监听函数对所述消息事件进行监听，在根据所监听到的消息事件的来源属性判断其来源于所述发送窗口对象时，显示所监听到的消息事件中的数据。本发明专利技术可实现以一种简单便捷的方式实现跨域、跨Web页面的通信，用户体验较好。

【技术实现步骤摘要】

本专利技术涉及一种通信
，特别是涉及一种Web页面窗口对象的通信方法及系统。 
技术介绍
一个HTML页面可以有一个或多个Web子页面，Web子页面中可以嵌套Web子页面，这些Web子页面可能属于不同的域，而不同域的Web子页面之间也有相互通信的需求。例如在开发过程中我们经常需要父子页面实现跨域。通信从安全性的角度来说，任何来自其他站点动态装载的内容，其安全性都是不可知的，所以对于浏览器来说，在要求动态内容时，只应该读取同源的HTTP应答和Cookies，而不能读取不同源的内容。由于同源策略的限制，JavaScript跨域的问题，一直是一个比较棘手的问题。目前存在多种克服同源策略的限制的方案，但基本都是利用的代理页面，也就不可避免的要产生网络请求，对于这些开销，在访问量超大的站点可能会对服务器产生相当大的压力。现有方法主要有两个方面的问题，1、安全性。当一个站点被攻击后，另一个站点会引起安全漏洞，或者数据直接暴漏在URL中。2、如果一个页面中引入一个iframe，想要能够操作所有iframe，必须设置相同的domain，数据容量和类型有限。所以亟需设计一种可以简单便捷的实现跨域、跨Web页面的通信方法。 
技术实现思路
鉴于以上所述现有技术的缺点，本专利技术的目的在于提供一种Web页面窗口对象的通信方法及系统，用于解决现有技术中跨Web页面通信较为复杂且消耗资源较大的问题。 为实现上述目的及其他相关目的，本专利技术提供一种Web页面窗口对象的通信方法包括如下步骤：调用发送窗口对象的消息发送函数向目标窗口对象发送消息事件，其中，所述消息事件包括：待发送的数据以及以所述发送窗口对象为来源的来源属性；所述目标窗口对象调用监听函数对所述消息事件进行监听，在根据所监听到的消息事件的来源属性判断其来源于所述发送窗口对象时，显示所监听到的消息事件中的数据。 可选的，所述目标窗口对象在根据所监听到的消息事件的来源属性判断其来源于所述发送窗口对象时，继续判断所述消息事件的来源是否可信任；当为是时，显示所述消息事件中的数据；当为否时，显示错误信息。 可选的，调用所述发送窗口对象的消息发送函数后，根据所述目标窗口对象的地址向目标窗口对象发送消息事件。 可选的，所述目标窗口对象的地址为URL格式。 可选的，所述发送窗口对象可同时向多个所述目标窗口对象发送消息事件。 可选的，所述消息发送函数为postMessage函数，所述监听函数为addEventListener函数。 可选的，所述发送窗口对象处于第一Web页面，所述目标窗口对象处于第二Web页面。 为实现上述目的及其他相关目的，本专利技术还提供一种Web页面窗口对象的通信系统包括：发送模块，调用发送窗口对象的消息发送函数向目标窗口对象发送消息事件，其中，所述消息事件包括：待发送的数据以及以所述发送窗口对象为来源的来源属性；监听模块，令所述目标窗口对象调用监听函数对所述消息事件进行监听；判断显示模块，在根据所述监听模块所监听到的消息事件的来源属性判断其来源于所述发送窗口对象时，显示所监听到的消息事件中的数据。 可选的，所述判断显示模块，在根据所述监听模块所监听到的消息事件的来源属性判断其来源于所述发送窗口对象时，继续判断所述消息事件的来源属性是否为可信任；当为是时，显示所述消息事件中的数据；当为否时，显示错误信息。 可选的，所述发送模块，调用所述发送窗口对象的消息发送函数，并根据所述目标窗口对象的地址向目标窗口对象发送消息事件；其中所述目标窗口对象的地址为URL格式。 如上所述，本专利技术的一种Web页面窗口对象的通信方法及系统，调用发送窗口对象的消息发送函数向目标窗口对象发送消息事件，其中，所述消息事件包括：待发送的数据以及以所述发送窗口对象为来源的来源属性；所述目标窗口对象调用监听函数对所述消息事件进行监听，在根据所监听到的消息事件的来源属性判断其来源于所述发送窗口对象时，显示所监听到的消息事件中的数据。本专利技术可实现以一种简单便捷的方式实现跨域、跨Web页面的通信，用户体验较好。 附图说明图1显示为本专利技术的一种Web页面窗口对象的通信方法的流程示意图。 图2显示为应用本专利技术的一种Web页面窗口对象的通信方法的原理流程图。 图3显示为应用本专利技术的一种Web页面窗口对象的通信方法的原理流程图。 图4显示为本专利技术的一种Web页面窗口对象的通信系统模块示意图。 元件标号说明 1         Web页面窗口对象的通信系统 11        发送模块 12        监听模块 13        判断显示模块 S11、S12  步骤 具体实施方式以下通过特定的具体实例说明本专利技术的实施方式，本领域技术人员可由本说明书所揭露的内容轻易地了解本专利技术的其他优点与功效。本专利技术还可以通过另外不同的具体实施方式加以实施或应用，本说明书中的各项细节也可以基于不同观点与应用，在没有背离本专利技术的精神下进行各种修饰或改变。需说明的是，在不冲突的情况下，以下实施例及实施例中的特征可以相互组合。 需要说明的是，以下实施例中所提供的图示仅以示意方式说明本专利技术的基本构想，遂图示中仅显示与本专利技术中有关的组件而非按照实际实施时的组件数目、形状及尺寸绘制，其实际实施时各组件的型态、数量及比例可为一种随意的改变，且其组件布局型态也可能更为复杂。 请参阅图1，显示为本专利技术的一种Web页面窗口对象的通信方法的流程示意图。 所述方法包括如下步骤： S11：调用发送窗口(window)对象的消息发送函数向目标窗口对象发送消息事件，例如调用所述发送窗口对象的消息发送函数后，根据所述目标窗口对象的地址向目标窗口对象发送消息事件，其中，所述消息事件包括：待发送的数据以及以所述发送窗口对象为来源的来源属性，所述目标窗口对象的地址为URL格式。例如所述发送窗口对象处于第一Web页面，所述目标窗口对象处于第二Web页面。所述第一Web页面为所述第二Web页面的父页面。优选的，所述发送窗口对象可同时向多个所述目标窗口对象发送消息事件。 S12：所述目标窗口对象调用监听函数对所述消息事件进行监听，在根据所监听到的消息事件的来源属性判断其来源于所述发送窗口对象时，显示所监听到的消息事件中的数据。 在另一具体实施例中，所述目标窗口对象在根据所监听到的消息事件的来源属性判断其来源于所述发送窗口对象时，继续判断所述消息事件的来源是否可信任；当为是时，显示所述消息事件中的数据；当为否时，显示错误信息。 请参阅图2，显示为应用本专利技术的一种Web页面窗口对象的通信方法的原理流程图，本实施例中，所述消息发送函数为postMessage函数，该函数将一个消息放入(寄送)到与指 定窗口创建的线程相联系消息队列里，不等待线程处理消息就返回，是异步消息模式。在HTML5中新增了postMessage方法，postMessage可以实现跨文档消息传输。所述监听函数为addEve本文档来自技高网...

【技术保护点】
一种Web页面窗口对象的通信方法，其特征在于，包括如下步骤：调用发送窗口对象的消息发送函数向目标窗口对象发送消息事件，其中，所述消息事件包括：待发送的数据以及以所述发送窗口对象为来源的来源属性；令所述目标窗口对象调用监听函数对所述消息事件进行监听，在根据所监听到的消息事件的来源属性判断其来源于所述发送窗口对象时，显示所监听到的消息事件中的数据。

【技术特征摘要】
1.一种Web页面窗口对象的通信方法，其特征在于，包括如下步骤：
调用发送窗口对象的消息发送函数向目标窗口对象发送消息事件，其中，所述消息事
件包括：待发送的数据以及以所述发送窗口对象为来源的来源属性；
令所述目标窗口对象调用监听函数对所述消息事件进行监听，在根据所监听到的消息
事件的来源属性判断其来源于所述发送窗口对象时，显示所监听到的消息事件中的数据。
2.根据权利要求1所述的Web页面窗口对象的通信方法，其特征在于：所述目标窗口对象
在根据所监听到的消息事件的来源属性判断其来源于所述发送窗口对象时，继续判断所述
消息事件的来源是否可信任；当为是时，显示所述消息事件中的数据；当为否时，显示错
误信息。
3.根据权利要求1所述的Web页面窗口对象的通信方法，其特征在于：调用所述发送窗口
对象的消息发送函数后，根据所述目标窗口对象的地址向目标窗口对象发送消息事件。
4.根据权利要求3所述的Web页面窗口对象的通信方法，其特征在于：所述目标窗口对象
的地址为URL格式。
5.根据权利要求1所述的Web页面窗口对象的通信方法，其特征在于：所述发送窗口对象
可同时向多个所述目标窗口对象发送消息事件。
6.根据权利要求1所述的Web页面窗口对象的通信方法，其特征在于：所述消息发送函数
为postMessag...

【专利技术属性】
技术研发人员：尚薇薇，
申请(专利权)人：上海斐讯数据通信技术有限公司，
类型：发明
国别省市：上海;31