[发明专利]在web端界面使用iframe技术实现界面插件的方法

说明书

本发明涉及一种在web端界面使用iframe技术实现界面插件的方法，该方法利用server端作为中间层，分别和web端的不同模块进行数据交互，从而实现不同iframe模块之间的数据交互。该技术方案能有效解决不同页面作为web界面插件时，不同iframe模块之间的数据交互问题。

技术领域

本发明涉及一种车体表面防护附件，具体涉及一种在web端界面使用iframe技术实现界面插件的方法。

背景技术

通常情况下，一个B/S架构的软件，分为Browser端和Server端，其中，Browser端运行于客户端的浏览器中，Server端运行于服务器中。在Browser端的web界面通常采用来源相同的页面组合而成，各个界面模块中，如果需要数据交互，可以直接通过顶层window对象，或者web端数据总线类框架，或者全局数据总线，甚至组件之间直接调用数据等等方式进行组件数据交换。

如果需要将来源不同的web页面集成到一个页面中，可以采用iframe技术来集成不同页面，但是iframe技术会导致各个页面之间无法直接进行数据交互。

发明内容

本发明的目的是提供一种在web端界面使用iframe技术实现界面插件的方法，解决了将不同页面作为web界面插件时，不同iframe模块之间的数据交互问题。

本发明所采用的技术方案为：

在web端界面使用iframe技术实现界面插件的方法，其特征在于：

该方法利用server端作为中间层，分别和web端的不同模块进行数据交互，从而实现不同iframe模块之间的数据交互。

具体包括以下步骤：

在webUI端，使用iframe技术将不同来源的页面集成在同一个页面中，Iframe1下为来源地址1中的页面webPage1，iframe2下为来源地址2中的页面webPage2；

webPage1向自己的server端即Server1发送数据，接口采用http接口；Server1收到数据后发送到server2；server2是webPage2的对应的server端，然后server2通过webSocket将数据推送到webPage2中，实现webpage1到webpage2的数据传输；

当webPage2需要向webPage1传输数据时，采用相同的流程。

Server端根据client端的数据要求采用适宜的交互方式向client端推送数据。

client主动发送或请求数据，不会被动接收数据时，采用http接口，client通过http的get或post方法向server端请求数据或者发送数据，server端采用http的交互方式。

Client需要被动接收数据时，采用websocket接口，页面生成时，即创建webSocket连接，并保持数据通道畅通，Server端向client端推送数据，server端采用webSocket的交互方式。

本发明具有以下优点：

本发明涉及的方法利用server端作为中间层，分别和web端的不同模块进行数据交互，对于基于iframe技术集成的不同页面，可以进行数据交互，简单易行，有效解决了不同页面作为web界面插件时，不同iframe模块之间的数据交互问题。

附图说明

图1为本发明原理示意图。

图2为前端页面结构图。

图3为数据通道图。

具体实施方式