CN110109664B - 一种页面集成***及方法 - Google Patents
一种页面集成***及方法 Download PDFInfo
- Publication number
- CN110109664B CN110109664B CN201910299029.7A CN201910299029A CN110109664B CN 110109664 B CN110109664 B CN 110109664B CN 201910299029 A CN201910299029 A CN 201910299029A CN 110109664 B CN110109664 B CN 110109664B
- Authority
- CN
- China
- Prior art keywords
- page
- css
- path
- loading
- unit
- Prior art date
- Legal status (The legal status is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the status listed.)
- Active
Links
Images
Classifications
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F8/00—Arrangements for software engineering
- G06F8/30—Creation or generation of source code
- G06F8/38—Creation or generation of source code for implementing user interfaces
Landscapes
- Engineering & Computer Science (AREA)
- Software Systems (AREA)
- General Engineering & Computer Science (AREA)
- Theoretical Computer Science (AREA)
- Human Computer Interaction (AREA)
- Physics & Mathematics (AREA)
- General Physics & Mathematics (AREA)
- Information Transfer Between Computers (AREA)
- Information Retrieval, Db Structures And Fs Structures Therefor (AREA)
Abstract
本发明提供了一种页面集成***及方法，属于页面集成领域。所述页面集成***包括受理平台，所述受理平台包括支撑结构和业务***界面；所述支撑结构为所述业务***界面中的页面提供css路径、js路径和页面路径的接口；所述支撑结构包括本***js和css加载单元、页面加载单元、初始化根容器单元、页面url准备单元、当前页面js和css路径准备单元和数据存储单元；所述业务***界面包括进入单元、访问单元、结构页面加载单元和其他***页面加载单元。利用本发明的***和方法，用户想使用某个***的某个页面，就可以直接把这个***的页面拿到自己的***中，使用者还是在当前的业务***，不会跳出这个***。
Description
技术领域
本发明属于页面集成领域，具体涉及一种页面集成***及方法。
背景技术
随着应用技术的发展和不同领域的业务种类的拓展，用户接触和面对的web***会变得越来越多，操作也变得越来越复杂和繁琐。传统的单体***的使用方式，已经逐渐无法满足用户的使用需求，对于单一产品来说，对用户使用体验感并无区别，但***增加后，用户则需要根据不同种类产品区分不同***，既耗费脑力又浪费时间，效率相对低下，用户体验度很差。对于开发人员来说，不同***间重叠的功能，需要多次开发，增加了风险和工作量。此为现有技术的不足之处。
发明内容
本发明的目的在于解决上述现有技术中存在的难题，提供一种页面集成***及方法，方便用户使用。
本发明是通过以下技术方案实现的：
一种页面集成***，包括受理平台，所述受理平台包括支撑结构和业务***界面；
所述支撑结构为所述业务***界面中的页面提供css路径、js路径和页面路径的接口；
所述支撑结构包括本***js和css加载单元、页面加载单元、初始化根容器单元、页面url准备单元、当前页面js和css路径准备单元和数据存储单元；
所述业务***界面包括进入单元、访问单元、结构页面加载单元和其他***页面加载单元。
所述进入单元接收并验证所述业务***界面接收的数据，将接收到的数据与所述数据存储单元中的存储数据进行对比获取网页全路径、js全路径和css全路径，并将所述网页全路径、所述js全路径和所述css全路径发送给本***js和css加载单元；
所述访问单元通过http请求的方式对页面进行访问；
所述结构页面加载单元用于加载结构页面；
所述其他***页面加载单元用于加载js文件，查询所述css路径数组是否存在link标签，如果不存在，则先建立一个link标签，然后加载css文件。
所述本***js和css加载单元根据进入单元发送来的网页全路径、js全路径和css全路径加载本***的js文件和css文件；
所述页面加载单元用于调用页面，并执行页面内的js代码和css代码；
所述初始化根容器单元用于建立新的页面；
所述页面url准备单元用于准备页面完整的url；
所述当前页面js和css路径准备单元用于准备当前页面的js和css路径；
所述数据存储单元用于存储各种数据。
所述支撑结构保存使用到的***的页面信息和配置，所述支撑结构根据其他***的js路径和css路径加载其他***。
一种利用上述***实现的页面集成方法，包括：
进入***首页面；
加载本***的js和css；
加载页面结构；
初始化根容器；
加载其他***页面的预设好的结构页面；
加载其他***页面的js和css。
所述加载本***的js和css的操作包括：
将业务***界面接收的数据与数据存储单元存储的数据进行对比，获取所需要的网页的全路径、js全路径和css全路径；
根据所述网页全路径、所述js全路径和所述css全路径加载本***的js文件和css文件。
所述加载其他***页面的js和css的操作包括：
建立新的页面对象；
查询所述css路径数组是否存在link标签，如果不存在，则先建立一个link标签，然后加载css文件；
准备页面的完整url；
准备当前页面的js和css路径；
获取页面的完整url、当前页面js和css路径；
加载页面的完整url，加载当前页面的js和css路径。
所述页面在***内切换是采用单页面局部刷新实现的；
所述页面在各个***间的切换是采用全页面刷新实现的。
与现有技术相比，本发明的有益效果是：利用本发明的***和方法，用户想使用某个***的某个页面，就可以直接把这个***的页面拿到自己的***中，使用者还是在当前的业务***，不会跳出这个***。多页面集成***可以让***直接互相运用自己需要的部分，同一***产品的相同功能，无需多次开发，可以反复使用，避免因为多次开发而耗费的时间和精力，使开发人员更注重业务上的逻辑。各个***之间，运用局部作用域的方式，css不会互相污染，也不会互相干涉，保证各个***的页面都能完整显示。使用方式非常简单，可以在现有的***基础上，进行升级，不需要二次开发，节省时间和人力。***在集成页面后，可以根据***是否需要使用的情况，进行打开和关闭此功能，不会影响到***的单独使用。
附图说明
图1是本发明支撑结构流程图。
图2是本发明业务***界面流程图。
图3是本发明单页面引用的整体结构示意图。
图4是本发明页面支撑结构示意图。
具体实施方式
下面结合附图对本发明作进一步详细描述：
如图1-图4所示，本发明一种页面集成***，包括受理平台，所述受理平台包括支撑结构和业务***界面，所述支撑结构包括本***js和css加载单元、页面加载单元、初始化根容器单元、页面url准备单元、当前页面js和css路径准备单元和数据存储单元；所述业务***界面包括进入单元、访问单元、结构页面加载单元和其他***页面加载单元。
所述进入单元接受并验证所述业务***界面接受的数据，所述进入单元将所述数据与所述数据存储单元中的存储数据进行对比获取网页全路径、js全路径和css全路径，所述进入单元将所述网页全路径、所述js全路径和所述css全路径发送给至本***js和css加载***，所述本***js和css加载单元通过require方式加载本***的js文件和css文件，所述require方式的参数是首页要加载的js文件名称数组和css文件名称数组。
所述页面加载单元采用addchild方法调用page对象，所述addchild方法的参数是结构页面路径和结构页面父元素id，所述addchild方法先创建新的page对象，所述addchild方法根据结构页面路径和结构页面父元素id对所述page对象初始化，所述addchild方法建立所述page对象与现有页面的父子关系，所述页面加载单元采用ajaxget方法拉取页面，所述ajaxget方法解析所述页面dom元素，所述ajaxget方法将解析的所述页面dom元素返回到所述页面上，所述addchild方法执行所述页面上的加载js和css资源方法，之后所述addchild方法执行所述页面内的js代码和css代码。
所述初始化根容器单元建立新的page对象。
所述结构页面加载单元采用addchild方法，所述addchild方法的参数是所述结构页面路径和所述结构页面父元素id。
所述加载其他页面单元采用linkJs方法和linkCss方法，所述linkJs的参数是js路径数组，所述linkJs方法采用require方式加载js文件，所述linkCss的参数是css路径数组，所述linkCss方法先查询所述css路径数组是否存在link标签，如果不存在，则所述linkCss方法先建立一个link标签，然后加载css文件。
所述页面url准备单元准备页面完整的url。
所述当前页面js和css路径准备单元准备当前页面的js和css路径。
所述访问单元通过http请求的方式获取。
所述支撑结构需要保存使用到的***的页面信息和配置，所述支撑结构根据所使用的其他***的js路径和css路径加载其他***，所述页面在***内切换使用单页面局部刷新，所述***间切换使用全页面刷新完成。
所述支撑结构加载所述css文件需要以页面名称id作为作业空间，各部分页面由各自的***提供html页面，通过所述html进行页面请求，整个页面是在***页面中完成组装的，所述支撑结构提供css路径、js路径和页面路径的接口供所述业务***界面的页面获取。
本发明的工作流程为：进入***首页面；加载本***的js和css；加载页面结构；初始化根容器；加载其他***页面的预设好的结构页面；加载其他***页面的js和css。具体如下：
受理平台启动后，进入单元将业务***界面接受的数据与数据存储***存储的数据进行对比，获取进入单元所需要的网页的全路径、js全路径和css全路径，所述进入单元将所述网页全路径、所述js全路径和所述css全路径发送给至本***js和css加载单元，所述本***js和css加载单元通过require方式加载本***的js文件和css文件。
require方式的加载过程如下：从入口模块开始，将模块名转换成实际的路径和模块定义，遍历该入口模块所需要的所有依赖，接着使用事件处理，在每个子模块中绑定一个‘已定义’事件，该事件所触发的函数是存在父模块中的匿名函数，而事件存在于子模块定义中，并保存在一个对象中，这个对象用来模拟哈希对象，模块名便是这个对象的属性，而属性对应的值则是这个模块的定义，模块的事件、状态等信息都保存在这个对象中，使用script加载依赖模块，监听load函数，每个script元素都会有一个自定义的属性用来指明模块名，当模块加载成功之后，通过元素属性来获取模块名，接着通过模块名来获取模块的定义，接着对模块进行初始化，初始化之后，当该子模块还有依赖的话，就会继续重复上面的步骤，如果没有的话，则对模块进行检查，当子模块没有其他要加载的依赖的时候表明子模块已经加载完毕，这个时候如果有回调函数，则调用回调函数，紧接着就会出发‘已定义’这个事件，接着保存在父模块的匿名函数，这个时候会将依赖的数量减一，然后检查父模块，检查父模块与检查子模块步骤相同，在子模块触发‘已定义’的事件之后，同时将接口传递给父模块中的匿名函数，然后将接口绑定到模块的定义之中，当执行回调函数的时候，使用apply将模块定义中的接口传递给回调函数。此时，模块依赖的接口作为参数传递给回调函数，在模块加载依赖的时候，先检查依赖中是否存在正在注册的模块，如果存在的话，则先将模块依赖的数量减一，通过这种方法用来解决循环依赖的问题，将已定义的模块保存在一个对象中，当加载模块依赖的时候，如果在这个对象中存在的话，则直接返回这个模块，否则的话，则再走一遍加载模块的流程。
页面***加载单元采用addchild方法调用page对象，addchild方法加载的参数是结构页面路径和结构页面父元素id，addchild方法创建新的所述page对象，addchild方法根据所述结构页面路径和所述结构页面父元素id对page对象进行初始化，addchild方法建立page对象与现有页面的父子关系，页面***加载***采用ajaxget方法拉取页面，ajaxget方法解析页面dom元素，ajaxget方法将解析的页面dom元素返回到页面上，addchild方法执行所述页面上的加载js和css资源方法，addchild方法执行所述页面内的js代码和css代码。初始化根容器单元建立新的page对象，结构页面加载单元采用addchild方法，加载其他***页面单元采用linkJs方法和linkCss方法，linkJs的参数是js路径数组，linkJs方法采用require方式加载js文件，需要配置好path路径和shim依赖关系，linkCss的参数是css路径数组，linkCss方法先查询所述css路径数组是否存在link标签，如果不存在，则linkCss方法先建立一个所述link标签，然后加载css文件。页面url准备单元准备页面完整url,当前页面js和css路径准备单元准备当前页面js和css路径，访问单元通过http请求的方式获取页面完整url、当前页面js和css路径，结构页面加载单元加载页面完整url，其他***页面加载单元加载当前页面js和css路径，页面在***内切换使用单页面局部刷新，***间切换使用全页面刷新完成。
上述技术方案只是本发明的一种实施方式，对于本领域内的技术人员而言，在本发明公开了应用方法和原理的基础上，很容易做出各种类型的改进或变形，而不仅限于本发明上述具体实施方式所描述的方法，因此前面描述的方式只是优选的，而并不具有限制性的意义。
Claims (6)
1.一种页面集成***，其特征在于：所述页面集成***包括受理平台，所述受理平台包括支撑结构和业务***界面；
所述支撑结构为所述业务***界面中的页面提供css路径、js路径和页面路径的接口；
所述支撑结构包括本***js和css加载单元、页面加载单元、初始化根容器单元、页面url准备单元、当前页面js和css路径准备单元和数据存储单元；
所述业务***界面包括进入单元、访问单元、结构页面加载单元和其他***页面加载单元;
所述进入单元接收并验证所述业务***界面接收的数据，将接收到的数据与所述数据存储单元中的存储数据进行对比获取网页全路径、js全路径和css全路径，并将所述网页全路径、所述js全路径和css全路径发送给本***js和css加载单元；
所述访问单元通过http请求的方式对页面进行访问；
所述结构页面加载单元用于加载结构页面；
所述其他***页面加载单元用于加载js文件，查询css路径数组是否存在link标签，如果不存在，则先建立一个link标签，然后加载css文件;
所述本***js和css加载单元根据进入单元发送来的网页全路径、js全路径和css全路径加载本***的js文件和css文件；
所述页面加载单元用于调用页面，并执行页面内的js代码和css代码；
所述初始化根容器单元用于建立新的页面；
所述页面url准备单元用于准备页面完整的url；
所述当前页面js和css路径准备单元用于准备当前页面的js和css路径；
所述数据存储单元用于存储各种数据。
2.根据权利要求1所述的页面集成***，其特征在于：所述支撑结构保存使用到的***的页面信息和配置，所述支撑结构根据其他***的js路径和css路径加载其他***。
3.一种利用权利要求1-2任一项所述的页面集成***实现的页面集成方法，其特征在于：所述方法包括：
进入***首页面；
加载本***的js和css；
加载页面结构；
初始化根容器；
加载其他***页面的预设好的结构页面；
加载其他***页面的js和css。
4.根据权利要求3所述的方法，其特征在于：所述加载本***的js和css的操作包括：
将业务***界面接收的数据与数据存储单元存储的数据进行对比，获取所需要的网页的全路径、js全路径和css全路径；
根据所述网页全路径、所述js全路径和所述css全路径加载本***的js文件和css文件。
5.根据权利要求4所述的方法，其特征在于：所述加载其他***页面的js和css的操作包括：
建立新的页面对象；
查询css路径数组是否存在link标签，如果不存在，则先建立一个link标签，然后加载css文件；
准备页面的完整url；
准备当前页面的js和css路径；
获取页面的完整url、当前页面js和css路径；
加载页面的完整url，加载当前页面的js和css路径。
6.根据权利要求5所述的方法，其特征在于：所述页面在***内切换是采用单页面局部刷新实现的；
所述页面在各个***间的切换是采用全页面刷新实现的。
Applications Claiming Priority (2)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN2018112152395 | 2018-10-18 | ||
| CN201811215239 | 2018-10-18 |
Publications (2)
| Publication Number | Publication Date |
|---|---|
| CN110109664A CN110109664A (zh) | 2019-08-09 |
| CN110109664B true CN110109664B (zh) | 2023-03-03 |
Family
ID=67483905
Family Applications (1)
| Application Number | Title | Priority Date | Filing Date |
|---|---|---|---|
| CN201910299029.7A Active CN110109664B (zh) | 2018-10-18 | 2019-04-15 | 一种页面集成***及方法 |
Country Status (1)
| Country | Link |
|---|---|
| CN (1) | CN110109664B (zh) |
Family Cites Families (9)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| US20110029899A1 (en) * | 2009-08-03 | 2011-02-03 | FasterWeb, Ltd. | Systems and Methods for Acceleration and Optimization of Web Pages Access by Changing the Order of Resource Loading |
| CN102902725A (zh) * | 2012-09-05 | 2013-01-30 | 曙光信息产业(北京)有限公司 | 一种基于扩展点实现Web页面重用的页面 |
| CN104714980B (zh) * | 2013-12-17 | 2018-04-06 | 阿里巴巴集团控股有限公司 | 页面嵌套路径确定方法及装置 |
| US20160379324A1 (en) * | 2015-06-29 | 2016-12-29 | Ken Hantman | Internet based tier sales and distribution of employee educational training, webisodes and related materials for loss prevention or sales training |
| CN106293675B (zh) * | 2015-06-08 | 2020-12-25 | 腾讯科技（深圳）有限公司 | ***静态资源加载方法及装置 |
| CN106708496B (zh) * | 2015-11-18 | 2020-03-17 | 腾讯科技（深圳）有限公司 | 图形界面中标签页的处理方法和装置 |
| US10365916B2 (en) * | 2016-04-19 | 2019-07-30 | Dropbox, Inc. | Providing access to a hybrid application offline |
| CN108073435B (zh) * | 2016-11-18 | 2021-05-07 | 中国电子科技集团公司第十五研究所 | 一种多信息集成显示方法及*** |
| CN108495192B (zh) * | 2018-03-13 | 2021-04-23 | 武汉斗鱼网络科技有限公司 | 页面编辑处理方法及装置 |
-
2019
- 2019-04-15 CN CN201910299029.7A patent/CN110109664B/zh active Active
Also Published As
| Publication number | Publication date |
|---|---|
| CN110109664A (zh) | 2019-08-09 |
Similar Documents
| Publication | Publication Date | Title |
|---|---|---|
| US20200099606A1 (en) | Distrubuted testing service | |
| CN105045802B (zh) | 一种消息驱动的多类型文件预览*** | |
| CN102223398B (zh) | 一种部署在云计算环境中部署服务的方法 | |
| CN113360812B (zh) | 一种业务执行方法及装置 | |
| US9529578B2 (en) | Automated service version upgrading | |
| CN102880503A (zh) | 数据分析***及数据分析方法 | |
| JP2015167014A (ja) | ウェブアプリケーションを実施する方法、装置、サーバ、及びシステム | |
| CN105763619A (zh) | 客户端与服务端进行通讯的方法及装置 | |
| CN102591724A (zh) | 消息交互方法及装置 | |
| US11003835B2 (en) | System and method to convert a webpage built on a legacy framework to a webpage compatible with a target framework | |
| CN102821133B (zh) | Xbrl数据解析的方法及服务器 | |
| EP2521043A1 (en) | Method for establishing a relationship between semantic data and the running of a widget | |
| CN113658591B (zh) | 一种面向智能家居的语音交互适配*** | |
| KR20150032151A (ko) | 사물 웹 환경의 프로세스 기반 사물협업 장치 및 방법 | |
| CN110704148B (zh) | 设备页面元素的获取方法、装置、服务器及存储介质 | |
| FI120286B (fi) | Menetelmä ja laitejärjestely palvelin-asiakaslaite-ympäristön hallitsemiseksi | |
| CN110109664B (zh) | 一种页面集成***及方法 | |
| CN107317788A (zh) | 实时数据推送方法和装置 | |
| CN101562622B (zh) | 一种执行用户请求的方法及其对应的服务器 | |
| CN111309341B (zh) | 基于耗时预测的安卓应用安装流程优化方法 | |
| CN111580986A (zh) | 一种基于采集服务中间件的数据获取方法、***及介质 | |
| CN110825622A (zh) | 软件测试方法、装置、设备和计算机可读介质 | |
| CN113220296B (zh) | 安卓***交互方法及装置 | |
| CN113094429B (zh) | 数据处理方法、数据查询方法、计算机设备和存储介质 | |
| CN115567604A (zh) | 基于微服务***的服务调用方法及服务器 |
Legal Events
| Date | Code | Title | Description |
|---|---|---|---|
| PB01 | Publication | ||
| PB01 | Publication | ||
| SE01 | Entry into force of request for substantive examination | ||
| SE01 | Entry into force of request for substantive examination | ||
| CB02 | Change of applicant information |
Address after: 250101 East Hall, 5th floor, R & D and production building, Shensi science and Technology Park, 699 Shunhua West Road, high tech Zone, Jinan City, Shandong Province Applicant after: Shensi (Shandong) Medical Information Technology Co.,Ltd. Address before: 250101 East Hall, 5th floor, R & D and production building, Shensi science and Technology Park, 699 Shunhua West Road, high tech Zone, Jinan City, Shandong Province Applicant before: SYNTHESIS SUNRISE MEDICAL INFORMATION TECHNOLOGY CO.,LTD. |
|
| CB02 | Change of applicant information | ||
| GR01 | Patent grant | ||
| GR01 | Patent grant |