一种页面渲染方法、装置、电子设备及存储介质与流程

1.本发明涉及数据处理技术领域，尤其涉及一种页面渲染方法、装置、电子设备及存储介质。


背景技术：

2.目前，不同系统软件之间会存在相互关联，可能存在相同业务的页面。如果对相同业务的页面都写一份同样的代码，当页面出现bug或需要更新的情况下，就得逐个更新页面代码，增加开发工作量和维护工作量。
3.通常采用iframe(一种html标签，用于创建包含另外一个文档的内联框架)在当前的页面内加载其他服务地址的网站，加载的时候指定待调用的页面。在当前的页面上新加载一个窗口，在该窗口中渲染指定的页面，从而，避免为相同业务的每个页面编写一份相同的代码。
4.然而，由于iframe加载的是整个网站，而需要展示的是其中的某一个页面，所以该方式会占用许多不必要的资源，并且，iframe是在原始网页上新加载一个窗口，以展示相同业务的页面，该新页面与原有的页面两者的交互性很差，无法实现全面性的融合。


技术实现要素：

5.本发明实施例提供了一种页面渲染方法、装置、电子设备及存储介质，可以解决相关技术中的页面渲染方案存在的资源占用以及交互性方面的问题。
6.根据本发明的一方面，提供了一种页面渲染方法，包括：
7.获取待调用的共享页面的服务标识和路由信息；
8.根据所述服务标识获取所述共享页面对应的系统访问地址，根据所述系统访问地址获取至少一个备选共享页面的页面信息；
9.根据所述备选共享页面的页面信息更新页面的路由表，根据所述路由表和路由信息渲染所述待调用的共享页面。
10.可选地，在获取待调用的共享页面的服务标识和路由信息之后，还包括：
11.根据所述路由信息匹配页面的路由表；
12.在所述路由表中包含所述路由信息的情况下，执行根据所述路由表和路由信息渲染所述待调用的共享页面。
13.通过待调用的共享页面的路由信息匹配路由表，实现查询是否已缓存该待调用的共享页面的页面信息，并在路由表中包含该路由信息的情况下，直接根据路由表和路由信息渲染待调用的共享页面，避免重复加载相同业务的页面，在保证页面性能的同时，减少了资源浪费。
14.可选地，所述获取待调用的共享页面的服务标识和路由信息，包括：
15.根据页面的跳转事件确定待调用的共享页面，获取所述共享页面的服务名称和路由地址。
16.通过获取共享页面的服务名称，便于基于服务名称获取系统访问地址，此外，基于路由地址查询路由表可以避免重复加载。
17.可选地，所述根据所述服务标识获取所述共享页面对应的系统访问地址，根据所述系统访问地址获取至少一个备选共享页面的页面信息，包括：
18.根据服务标识与系统访问地址之间的关联关系，获取与所述共享页面对应的系统访问地址；
19.根据所述系统访问地址访问对应的目标系统，从所述目标系统获取与所述服务标识对应的至少一个备选共享页面的页面文件；
20.获取所述页面文件中各备选共享页面的页面信息。
21.通过服务标识可以获取与共享页面对应的系统访问地址，从该系统访问地址获取服务标识对应的至少一个备选共享页面的页面文件，便于远程加载备选共享页面的页面文件到需要调用共享页面的系统。
22.可选地，所述至少一个备选共享页面的页面文件的确定方式包括：
23.根据预设的共享函数生成目标脚本文件；
24.根据各备选共享页面的页面访问路径和页面代码，生成所述共享函数的对象内容，根据所述对象内容更新所述目标脚本文件；
25.根据更新后的目标脚本文件生成至少一个备选共享页面的页面文件。
26.通过生成包含共享函数的目标脚本文件，并传入共享函数的对象内容，再将目标脚本文件以及相关页面打包成脚本文件，实现通过脚本文件将各备选共享页面的页面代码共享给其它系统。
27.可选地，所述获取所述页面文件中各备选共享页面的页面信息，包括：
28.加载所述页面文件，触发所述页面文件中的目标脚本文件中的共享函数；
29.根据所述共享函数获取各备选共享页面对应的页面代码和页面访问路径。
30.在加载页面文件时，通过共享函数中的订阅函数和发布函数实现快速获取各备选共享页面的页面代码和页面访问路径，提高了页面信息获取效率。
31.可选地，所述根据所述备选共享页面的页面信息更新页面的路由表，根据所述路由表和路由信息渲染所述待调用的共享页面，包括：
32.将所述备选共享页面的页面访问路径和页面代码添加至所述路由表；
33.根据所述路由信息匹配所述路由表得到目标页面代码，根据所述路由信息和目标页面代码渲染所述待调用的共享页面。
34.通过将备选共享页面的页面访问路径和页面代码添加至路由表，实现将备选共享页面远程加载到需要调用共享页面的系统，实现了页面共享。
35.根据本发明的另一方面，提供了一种页面渲染装置，该装置包括：
36.信息获取模块，用于获取待调用的共享页面的服务标识和路由信息；
37.地址获取模块，用于根据所述服务标识获取所述共享页面对应的系统访问地址，根据所述系统访问地址获取至少一个备选共享页面的页面信息；
38.页面渲染模块，用于根据所述备选共享页面的页面信息更新页面的路由表，根据所述路由表和路由信息渲染所述待调用的共享页面。
39.可选地，还包括：
40.路由匹配模块，用于在获取待调用的共享页面的服务标识和路由信息之后，根据所述路由信息匹配页面的路由表；
41.路由跳转模块，用于在所述路由表中包含所述路由信息的情况下，执行根据所述路由表和路由信息渲染所述待调用的共享页面。
42.可选地，信息获取模块具体用于：
43.根据页面的跳转事件确定待调用的共享页面，获取所述共享页面的服务名称和路由地址。
44.可选地，所述地址获取模块具体用于：
45.根据服务标识与系统访问地址之间的关联关系，获取与所述共享页面对应的系统访问地址；
46.根据所述系统访问地址访问对应的目标系统，从所述目标系统获取与所述服务标识对应的至少一个备选共享页面的页面文件；
47.获取所述页面文件中各备选共享页面的页面信息。
48.可选地，还包括：
49.页面文件确定模块，用于根据预设的共享函数生成目标脚本文件；根据各备选共享页面的页面访问路径和页面代码，生成所述共享函数的对象内容，根据所述对象内容更新所述目标脚本文件；根据更新后的目标脚本文件生成至少一个备选共享页面的页面文件。
50.可选地，所述地址获取模块具体还用于：
51.加载所述页面文件，触发所述页面文件中的目标脚本文件中的共享函数；
52.根据所述共享函数获取各备选共享页面对应的页面代码和页面访问路径。
53.可选地，所述页面渲染模块具体用于：
54.将所述备选共享页面的页面访问路径和页面代码添加至所述路由表；
55.根据所述路由信息匹配所述路由表得到目标页面代码，根据所述路由信息和目标页面代码渲染所述待调用的共享页面。
56.根据本发明的另一方面，提供了一种电子设备，所述电子设备包括：
57.至少一个处理器；以及
58.与所述至少一个处理器通信连接的存储器；其中，
59.所述存储器存储有可被所述至少一个处理器执行的计算机程序，所述计算机程序被所述至少一个处理器执行，以使所述至少一个处理器能够执行本发明任一实施例所述的页面渲染方法。
60.根据本发明的另一方面，提供了一种计算机可读存储介质，所述计算机可读存储介质存储有计算机指令，所述计算机指令用于使处理器执行时实现本发明任一实施例所述的页面渲染方法。
61.本发明实施例的技术方案，通过待调用的共享页面的服务标识获取系统访问地址，根据系统访问地址从该地址对应的目标系统获取至少一个备选共享页面的页面信息，并根据页面信息更新页面的路由表，根据待调用的共享页面的路由信息和路由表渲染待调用的共享页面，解决了相关技术中的页面渲染方案存在的资源占用以及交互性方面的问题，实现对相同业务的页面共享同一份页面代码，且无需新建窗口显示该共享页面，可以无
障碍的执行页面交互。
62.应当理解，本部分所描述的内容并非旨在标识本发明的实施例的关键或重要特征，也不用于限制本发明的范围。本发明的其它特征将通过以下的说明书而变得容易理解。
附图说明
63.为了更清楚地说明本发明实施例中的技术方案，下面将对实施例描述中所需要使用的附图作简单地介绍，显而易见地，下面描述中的附图仅仅是本发明的一些实施例，对于本领域普通技术人员来讲，在不付出创造性劳动的前提下，还可以根据这些附图获得其他的附图。
64.图1为本发明实施例提供的一种页面渲染方法的流程图；
65.图2为本发明实施例提供的一种共享函数的构成示意图；
66.图3为本发明实施例提供的另一种页面渲染方法的流程图；
67.图4为本发明实施例提供的又一种页面渲染方法的流程图
68.图5为本发明实施例提供的一种共享页面的执行流程示意图；
69.图6为本发明实施例提供的一种页面渲染装置的结构示意图；
70.图7为本发明实施例提供的一种电子设备的结构示意图。
具体实施方式
71.为了使本技术领域的人员更好地理解本发明方案，下面将结合本发明实施例中的附图，对本发明实施例中的技术方案进行清楚、完整地描述，显然，所描述的实施例仅仅是本发明一部分的实施例，而不是全部的实施例。基于本发明中的实施例，本领域普通技术人员在没有做出创造性劳动前提下所获得的所有其他实施例，都应当属于本发明保护的范围。
72.需要说明的是，本发明的说明书和权利要求书及上述附图中的术语“第一”、“第二”等是用于区别类似的对象，而不必用于描述特定的顺序或先后次序。应该理解这样使用的数据在适当情况下可以互换，以便这里描述的本发明的实施例能够以除了在这里图示或描述的那些以外的顺序实施。此外，术语“包括”和“具有”以及他们的任何变形，意图在于覆盖不排他的包含，例如，包含了一系列步骤或单元的过程、方法、系统、产品或设备不必限于清楚地列出的那些步骤或单元，而是可包括没有清楚地列出的或对于这些过程、方法、产品或设备固有的其它步骤或单元。
73.图1为本发明实施例提供的一种页面渲染方法的流程图，本实施例可适用于对不同系统之间的相同业务的页面代码进行共享，实现一份代码在多个系统运行的情况，该方法可以由页面渲染装置来执行，该页面渲染装置可以采用硬件和/或软件的形式实现，该页面渲染装置可配置于电子设备中。如图1所示，该方法包括：
74.s110、获取待调用的共享页面的服务标识和路由信息。
75.其中，待调用的共享页面为当前系统待调用的由平台中其它系统共享的页面，该当前系统为获取共享页面的系统。例如，对于一个企业来说，企业管理平台中包含登录系统、考勤系统、业务管理系统等等。假设登录系统中的a服务可能与考勤系统中b服务相关，则登录系统可以将a服务下的页面a1、页面a2、页面a3共享给考勤系统。上述页面a1、页面
a2、页面a3即为登录系统共享的页面，可以称为备选共享页面。如果考勤系统需要调用页面a2，则将页面a2作为待调用的共享页面。
76.本发明实施例可以预先为每个共享页面设置独立的页面访问路径。例如，通过vue-router为每个共享页面设置页面访问路径，实现每个共享页面的独立化。其中，vue-router可以为基于vue的路由插件。vue可以为一种mvvm(model-view-viewmodel，模型-视图-视图模型)形式的前端框架。
77.可选地，还可以预先编写脚本文件，该脚本文件包括共享函数，该共享函数可以具有发布订阅功能且具有加载页面的功能，将该脚本文件部署在内容分发网络(content delivery network，cdn)服务器，以便各个服务进行引用。
78.需要说明的是，分享页面的系统向其它系统提供共享页面的页面访问路径和页面内容。相应的，获取页面的系统即为从分享页面的系统获取共享页面的系统。例如，页面内容可以包括页面代码等。分享页面的系统将可分享的页面代码和不可共享代码进行拆分，并将同一个分享页面的系统的共享页面都引入同一个脚本文件，为每个共享页面设置一个对象，对象内容包括页面访问路径、页面名称和页面内容等等。可以通过数组的形式表示对象内容，并将数组作为参数传入脚本文件中共享函数的发布函数里。可选地，分享页面的系统还通过webpack将脚本文件以及相关的共享页面进行打包，以制作共享页面的页面文件，实现可分享的页面代码和不可共享代码分开打包。其中，webpack为一种前端打包工具。
79.图2为本发明实施例提供的一种共享函数的构成示意图。如图2所示，该共享函数包括发布函数、订阅函数和跳转函数。其中，发布函数用于发布共享页面，分享页面的系统调用。订阅函数用于接收发布函数里的参数，获取页面的系统调用。跳转函数用于获取页面的系统调用。进一步地，跳转函数具体用于创建scrpit标签，通过scrpit标签从分享页面的系统获取页面代码打包生成的页面文件。该script标签可以为html里通过服务加载js脚本的标签。例如，script标签包含脚本语句，也可以通过src属性指向外部脚本文件。可选地，跳转函数还用于将页面访问路径和页面代码等页面信息添加至当前系统的路由表。其中，该路由表可以为路由的集合，一个路由可以为一组映射关系。该映射关系中，以路由地址为键值，以前端请求或页面内容为该键值对应的内容。可选地，跳转函数还用于根据页面代码渲染待调用的共享页面。可选地，跳转函数还用于页面信息缓存。例如，当前系统通过跳转函数对远程加载来的页面信息进行缓存。
80.服务标识可以为共享页面的标识信息，由于一些服务可能通过一个系统实现，而有一些服务可能需要多个存在关联关系的系统配合才能实现，即存在一个服务标识对应至少一个分享页面的系统的情况。例如，该服务标识可以为服务名称，该服务名称可以为中文名称或英文名称等。
81.路由信息可以为共享页面的页面访问路径。由于预先为每个共享页面设置了独立的页面访问路径，对于研发人员，可以得知共享页面的页面访问路径。由于不同的分享页面的系统的访问地址不同，结合系统访问地址和页面访问路径才能获取到该共享页面，需要预先为每个分享页面的系统关联存储服务标识与系统访问地址。例如，可以将服务标识与系统访问地址关联存入数据库。
82.示例性地，获取待调用的共享页面的服务标识和路由信息，包括：根据页面的跳转事件确定待调用的共享页面，获取所述共享页面的服务名称和路由地址。其中，触发跳转事
件的条件包括人工操作页面跳转至共享页面或由其它页面调起共享页面等，将要跳转到的页面作为待调用的页面，如果该待调用的页面为共享页面，则可以执行本发明实施例提供的页面渲染方法。如果该待调用的页面不是共享页面，则执行当前系统中该页面的页面代码，进行页面渲染。
83.由于每个共享页面具有独立的页面访问路径，在确定了待调用的共享页面之后，可以获取共享页面的服务名称和页面访问路径，其中，页面访问路径即为路由地址。
84.本发明实施例中，在检测到页面的跳转事件的情况下，调用跳转函数，该跳转函数的参数包括待调用的共享页面的服务名称和路由地址。
85.s120、根据所述服务标识获取所述共享页面对应的系统访问地址，根据所述系统访问地址获取至少一个备选共享页面的页面信息。
86.其中，共享页面对应的系统访问地址可以为分享该共享页面的系统的访问地址，通过该系统访问地址可以访问该分享页面的系统。由于分享页面的系统预先将各服务对应的共享页面进行单独打包，可以从分享页面的系统获取该服务标识对应的所有共享页面，记为备选共享页面。该备选共享页面包含待调用的共享页面，也包含与该待调用的共享页面具有相同上级服务的其它共享页面。例如，待调用的共享页面和备选共享页面具有相同的父页面等。
87.页面信息为分享页面的系统向其它系统共享的系统调用信息，其它系统可以通过页面信息调用分享页面的系统的页面。例如，页面信息包括页面访问路径、页面名称和页面内容等。可以将页面信息放入数组，以通过数组形式表示页面信息，并将该数组作为共享函数中发布函数的参数。
88.示例性地，根据所述服务标识获取所述共享页面对应的系统访问地址，根据所述系统访问地址获取至少一个备选共享页面的页面信息，包括：根据服务标识与系统访问地址之间的关联关系，获取与所述共享页面对应的系统访问地址。根据所述系统访问地址访问对应的目标系统，从所述目标系统获取与所述服务标识对应的至少一个备选共享页面的页面文件。获取所述页面文件中各备选共享页面的页面信息。
89.由于分享页面的系统已经预先通过webpack将脚本文件以及相关的共享页面进行打包，制作出共享页面的页面文件。当前系统响应于共享页面的跳转事件，根据服务标识以及服务标识与系统访问地址之间的关联关系，获取共享页面对应的系统访问地址。当前系统可以根据该系统访问地址动态创建script标签。通过script标签从该系统访问地址对应的分享页面的系统，拉取打包生成的该服务标识对应的所有备选页面的页面文件。可选地，当前系统还可以通过script标签从该系统访问地址对应的分享页面的系统，拉取打包生成的所有备选页面的页面文件。如果该分享页面的系统对外共享了第一服务、第二服务和第三服务的页面，且待调用的共享页面是第一服务对应的页面，可以只从该分享页面的系统，获取第一服务对应的所有备选页面的页面文件。可选地，也可以从该分享页面的系统，分别获取第一服务、第二服务和第三服务对应的所有备选页面的页面文件。
90.s130、根据所述备选共享页面的页面信息更新页面的路由表，根据所述路由表和路由信息渲染所述待调用的共享页面。
91.其中，页面的路由表可以为页面的路由信息的集合，该路由信息用于指示页面信息渲染到页面前端的地址。
92.示例性地，根据所述备选共享页面的页面信息更新页面的路由表，根据所述路由表和路由信息渲染所述待调用的共享页面，包括：将所述备选共享页面的页面访问路径和页面代码添加至所述路由表。根据所述路由信息匹配所述路由表得到目标页面代码，根据所述路由信息和目标页面代码渲染所述待调用的共享页面。其中，目标页面代码可以为待调用的共享页面对应的页面代码，由于页面访问路径与页面代码相关联，可以基于路由信息匹配路由表，得到与路由信息匹配的页面访问路径对应的页面代码，作为目标页面代码。
93.具体地，当前系统获取到包含至少一个备选共享页面的页面文件之后，加载该页面文件，该页面文件加载的时候，触发页面文件中的目标脚本文件中的共享函数，以运行共享函数中的订阅函数，接收共享函数中的发布函数发布的页面信息，从而，获取备选共享页面的页面代码。将页面信息通过vue-router的addrouter方法动态加载到当前系统的路由中，以实现将页面访问路径和页面代码添加至当前系统的路由表，实现将备选共享页面远程加载到当前系统。
94.由于待调用的页面属于备选共享页面，可以根据待调用页面的路由信息匹配更新后的路由表，得到目标页面访问路径，根据目标页面访问路径与页面代码的对应关系，获取待调用的共享页面的目标页面代码，根据该目标页面代码和路由信息渲染待调用的共享页面。
95.本发明实施例提供了一种页面渲染方法，通过待调用的共享页面的服务标识获取系统访问地址，根据系统访问地址从该地址对应的目标系统获取至少一个备选共享页面的页面信息，并根据页面信息更新页面的路由表，根据待调用的共享页面的路由信息和路由表渲染待调用的共享页面，解决了相关技术中的页面渲染方案存在的资源占用以及交互性方面的问题，实现对相同业务的页面共享同一份页面代码，且无需新建窗口显示该共享页面，可以无障碍的执行页面交互。
96.图3为本发明实施例提供的另一种页面渲染方法的流程图，本实施例在上述实施例的基础上，附加限定了判定待调用的共享页面是否为缓存中的预加载页面，若是，则执行页面跳转，无需重复加载相同页面。如图3所示，该方法包括：
97.s310、获取待调用的共享页面的服务标识和路由信息。
98.示例性地，若当前系统需要调用分享页面的系统中的页面代码，则获取跳转函数的参数，该跳转函数的参数包括待调用的共享页面的服务名称和路由地址等。
99.s320、根据所述路由信息匹配页面的路由表。
100.由于页面的路由表中缓存有远程加载来的备选共享页面的页面访问路径，通过路由信息匹配各个备选共享页面的页面访问路径，可以确定路由表中是否包含该路由信息。
101.例如，将待调用的共享页面的路由地址与路由表中的页面访问路径进行匹配，以确定路由地址是否存在于该路由表。若路由地址存在于该路由表，则说明该待调用的共享页面的页面信息已经预加载至当前系统的路由中，否则，确定该待调用的共享页面的页面信息未预加载。
102.s330、判断所述路由表中是否包含所述路由信息，若是，则执行s360，否则执行s340。
103.示例性地，根据路由信息与路由表的匹配结果，可以确定路由表中是否包含待调用页面的路由信息。若路由表中不包含该路由信息，说明待调用页面的页面信息未被预加
载，则需要根据待调用页面的服务标识查询系统访问地址，以基于该系统访问地址访问分享页面的系统，拉取分享页面的系统共享出的备选共享页面。若路由表中包含该路由信息，则说明待调用页面的页面信息已被预加载到当前系统，可以直接执行页面跳转，防止重复加载相同页面的页面信息。
104.s340、根据所述服务标识获取所述共享页面对应的系统访问地址，根据所述系统访问地址获取至少一个备选共享页面的页面信息。
105.s350、根据所述备选共享页面的页面信息更新页面的路由表。
106.示例性地，由于根据系统访问地址远程访问到共享页面的系统，并从该共享页面的系统获取到至少一个备选共享页面的页面信息，该至少一个备选共享页面包括待调用的共享页面，将各个备选共享页面的页面信息更至页面的路由表。
107.s360、根据所述路由表和路由信息渲染所述待调用的共享页面。
108.本发明实施例提供了另一种页面渲染方法，通过在加载备选共享页面的页面信息之前，根据待调用的共享页面的路由信息匹配路由表，根据匹配结果判定是否已预加载该待调用的共享页面的页面信息，并在确定已预加载该待调用的页面之后，执行根据路由表和路由信息渲染所述待调用的共享页面，实现对同一页面只加载一次页面信息，防止重复加载相同页面的页面信息，在保证页面性能的同时，减少了资源浪费。
109.图4为本发明实施例提供的又一种页面渲染方法的流程图，本实施例在上述实施例的基础上，附加限定了确定备选共享页面的页面文件的方式。如图4所示，该方法包括：
110.s401、根据预设的共享函数生成目标脚本文件。
111.参照图2所示，该共享函数包括发布函数、订阅函数和跳转函数。
112.例如，预先编写一个具有发布订阅功能且可以加载页面的共享函数，将该共享函数放入一个独立的js文件中，将该js文件作为目标脚本文件。其中，js文件是以js为扩展名的文件，其是用javascript脚本语言编写的脚本文件。
113.s402、根据各备选共享页面的页面访问路径和页面代码，生成所述共享函数的对象内容，根据所述对象内容更新所述目标脚本文件。
114.其中，备选共享页面为共享页面的系统向其它系统分享的页面。可以预先利用vue-router实现每个页面的独立化，使每个页面具有独立的页面访问路径。
115.由于分享页面的系统将可分享的页面代码和不可共享代码分别打包，则可以生成包含页面代码的页面文件，因此，获取页面的系统可以从分享页面的系统获取可分享的页面代码。
116.本发明预先将分享页面的系统中的所有备选共享页面都引入同一个js文件，为每个备选共享页面设置一个对象，对象内容包括页面访问路径，页面名称，页面代码，并将对象内容放入一个数组，将该数组作为参数传入共享函数中的发布函数里。
117.需要说明的是，可以将同一分享页面的系统中的全部备选共享页面的页面访问路径、页面名称和页面代码放入同一数组，将该数组作为参数传入共享函数中的发布函数里。分享页面的系统还可以按照要共享的服务的类型，将同一服务对应的备选共享页面的页面访问路径、页面名称和页面代码放入同一数组。如果分享页面的系统对外共享了多个服务，则会向发布函数传入多个数组，每个数组对应一个共享的服务。
118.s403、根据更新后的目标脚本文件生成至少一个备选共享页面的页面文件。
119.在数组传入目标脚本文件的发布函数之后，分享页面的系统从cdn服务器获取目标脚本文件，利用webpack将该目标脚本文件以及相关的页面进行打包，实现打包目标脚本文件和共享页面得到页面文件。
120.图5为本发明实施例提供的一种共享页面的执行流程示意图。如图5所示，分享页面的系统预先将可分享的页面代码和不可共享代码拆分开，制作备选共享页面，然后，从cdn服务器获取目标脚本文件，通过webpack将该目标脚本文件以及备选共享页面进行打包，得到备选共享页面的页面文件。
121.将分享页面的系统与服务名称关联存入数据库，以便于获取页面的系统在需要调用该服务时，查询到该分享页面的系统的访问地址。
122.s404、获取待调用的共享页面的服务标识和路由信息。
123.在获取页面的系统中，若需要调用某个服务的共享页面，则调用跳转函数，获取该跳转函数中的服务名称和路由地址。
124.s405、根据所述路由信息匹配页面的路由表。
125.s406、判断所述路由表中是否包含所述路由信息，若是，则执行s407，否则执行s411。
126.s407、根据服务标识与系统访问地址之间的关联关系，获取与所述共享页面对应的系统访问地址。
127.s408、根据所述系统访问地址访问对应的目标系统，从所述目标系统获取与所述服务标识对应的至少一个备选共享页面的页面文件。
128.其中，目标系统为与服务名称关联的分享页面的系统。可以根据目标系统的系统访问地址访问目标系统，从目标系统获取与服务标识对应的备选共享页面的页面文件。
129.可选地，在访问目标系统之后，还可以从目标系统获取所有共享页面的页面文件，本发明实施例对此不作具体限定。
130.s409、获取所述页面文件中各备选共享页面的页面信息。
131.示例性地，加载所述页面文件，触发所述页面文件中的目标脚本文件中的共享函数。根据所述共享函数获取各备选共享页面对应的页面代码和页面访问路径。
132.具体地，加载页面文件的时候会触发目标脚本文件中的订阅函数运行，从而，获取到目标脚本中发布函数中的参数，该参数为通过数组形式表示的页面访问路径和页面代码等页面信息。
133.s410、将所述备选共享页面的页面访问路径和页面代码添加至所述路由表。
134.参照图5所示，获取页面的系统通过vue-router的addrouter方法将页面信息动态加载到路由表中，以便于后续根据路由信息匹配路由表得到目标页面代码，从而根据路由信息和目标页面代码渲染页面。
135.s411、根据所述路由信息匹配所述路由表得到目标页面代码，根据所述路由信息和目标页面代码渲染所述待调用的共享页面。
136.本发明实施例提供了又一种页面渲染方法，通过生成包含共享函数的目标脚本文件，将各备选共享页面的页面访问路径和页面代码作为共享函数的对象内容传入目标脚本文件，根据目标脚本文件生成至少一个备选共享页面的页面文件，可以向其它系统分享页面代码，实现一份代码在多个系统页面运行。
137.图6为本发明实施例提供的一种页面渲染装置的结构示意图。该装置可以采用硬件和/或软件的形式实现，该页面渲染装置可配置于电子设备中。如图6所示，该装置包括：信息获取模块610、地址获取模块620和页面渲染模块630。
138.信息获取模块610，用于获取待调用的共享页面的服务标识和路由信息；
139.地址获取模块620，用于根据所述服务标识获取所述共享页面对应的系统访问地址，根据所述系统访问地址获取至少一个备选共享页面的页面信息；
140.页面渲染模块630，用于根据所述备选共享页面的页面信息更新页面的路由表，根据所述路由表和路由信息渲染所述待调用的共享页面。
141.可选地，还包括：
142.路由匹配模块，用于在获取待调用的共享页面的服务标识和路由信息之后，根据所述路由信息匹配页面的路由表；
143.路由跳转模块，用于在所述路由表中包含所述路由信息的情况下，执行根据所述路由表和路由信息渲染所述待调用的共享页面。
144.可选地，信息获取模块610具体用于：
145.根据页面的跳转事件确定待调用的共享页面，获取所述共享页面的服务名称和路由地址。
146.可选地，所述地址获取模块620具体用于：
147.根据服务标识与系统访问地址之间的关联关系，获取与所述共享页面对应的系统访问地址；
148.根据所述系统访问地址访问对应的目标系统，从所述目标系统获取与所述服务标识对应的至少一个备选共享页面的页面文件；
149.获取所述页面文件中各备选共享页面的页面信息。
150.可选地，还包括：
151.页面文件确定模块，用于根据预设的共享函数生成目标脚本文件；根据各备选共享页面的页面访问路径和页面代码，生成所述共享函数的对象内容，根据所述对象内容更新所述目标脚本文件；根据更新后的目标脚本文件生成至少一个备选共享页面的页面文件。
152.可选地，所述地址获取模块620具体还用于：
153.加载所述页面文件，触发所述页面文件中的目标脚本文件中的共享函数；
154.根据所述共享函数获取各备选共享页面对应的页面代码和页面访问路径。
155.可选地，所述页面渲染模块630具体用于：
156.将所述备选共享页面的页面访问路径和页面代码添加至所述路由表；
157.根据所述路由信息匹配所述路由表得到目标页面代码，根据所述路由信息和目标页面代码渲染所述待调用的共享页面。
158.本发明实施例所提供的页面渲染装置可执行本发明任意实施例所提供的页面渲染方法，具备执行方法相应的功能模块和有益效果。
159.图7为本发明实施例提供的一种电子设备10的结构示意图。电子设备旨在表示各种形式的数字计算机，诸如，膝上型计算机、台式计算机、工作台、个人数字助理、服务器、刀片式服务器、大型计算机、和其它适合的计算机。电子设备还可以表示各种形式的移动装
置，诸如，个人数字处理、蜂窝电话、智能电话、可穿戴设备(如头盔、眼镜、手表等)和其它类似的计算装置。本文所示的部件、它们的连接和关系、以及它们的功能仅仅作为示例，并且不意在限制本文中描述的和/或者要求的本发明的实现。
160.如图7所示，电子设备10包括至少一个处理器11，以及与至少一个处理器11通信连接的存储器，如只读存储器(rom)12、随机访问存储器(ram)13等，其中，存储器存储有可被至少一个处理器执行的计算机程序，处理器11可以根据存储在只读存储器(rom)12中的计算机程序或者从存储单元18加载到随机访问存储器(ram)13中的计算机程序，来执行各种适当的动作和处理。在ram 13中，还可存储电子设备10操作所需的各种程序和数据。处理器11、rom 12以及ram 13通过总线14彼此相连。输入/输出(i/o)接口15也连接至总线14。
161.电子设备10中的多个部件连接至i/o接口15，包括：输入单元16，例如键盘、鼠标等；输出单元17，例如各种类型的显示器、扬声器等；存储单元18，例如磁盘、光盘等；以及通信单元19，例如网卡、调制解调器、无线通信收发机等。通信单元19允许电子设备10通过诸如因特网的计算机网络和/或各种电信网络与其他设备交换信息/数据。
162.处理器11可以是各种具有处理和计算能力的通用和/或专用处理组件。处理器11的一些示例包括但不限于中央处理单元(cpu)、图形处理单元(gpu)、各种专用的人工智能(ai)计算芯片、各种运行机器学习模型算法的处理器、数字信号处理器(dsp)、以及任何适当的处理器、控制器、微控制器等。处理器11执行上文所描述的各个方法和处理，例如页面渲染方法。
163.在一些实施例中，页面渲染方法可被实现为计算机程序，其被有形地包含于计算机可读存储介质，例如存储单元18。在一些实施例中，计算机程序的部分或者全部可以经由rom 12和/或通信单元19而被载入和/或安装到电子设备10上。当计算机程序加载到ram 13并由处理器11执行时，可以执行上文描述的页面渲染方法的一个或多个步骤。备选地，在其他实施例中，处理器11可以通过其他任何适当的方式(例如，借助于固件)而被配置为执行页面渲染方法。
164.本文中以上描述的系统和技术的各种实施方式可以在数字电子电路系统、集成电路系统、现场可编程门阵列(fpga)、专用集成电路(asic)、专用标准产品(assp)、芯片上系统的系统(soc)、复杂可编程逻辑设备(cpld)、计算机硬件、固件、软件、和/或它们的组合中实现。这些各种实施方式可以包括：实施在一个或者多个计算机程序中，该一个或者多个计算机程序可在包括至少一个可编程处理器的可编程系统上执行和/或解释，该可编程处理器可以是专用或者通用可编程处理器，可以从存储系统、至少一个输入装置、和至少一个输出装置接收数据和指令，并且将数据和指令传输至该存储系统、该至少一个输入装置、和该至少一个输出装置。
165.用于实施本发明的方法的计算机程序可以采用一个或多个编程语言的任何组合来编写。这些计算机程序可以提供给通用计算机、专用计算机或其他可编程数据处理装置的处理器，使得计算机程序当由处理器执行时使流程图和/或框图中所规定的功能/操作被实施。计算机程序可以完全在机器上执行、部分地在机器上执行，作为独立软件包部分地在机器上执行且部分地在远程机器上执行或完全在远程机器或服务器上执行。
166.在本发明的上下文中，计算机可读存储介质可以是有形的介质，其可以包含或存储以供指令执行系统、装置或设备使用或与指令执行系统、装置或设备结合地使用的计算
机程序。计算机可读存储介质可以包括但不限于电子的、磁性的、光学的、电磁的、红外的、或半导体系统、装置或设备，或者上述内容的任何合适组合。备选地，计算机可读存储介质可以是机器可读信号介质。机器可读存储介质的更具体示例会包括基于一个或多个线的电气连接、便携式计算机盘、硬盘、随机存取存储器(ram)、只读存储器(rom)、可擦除可编程只读存储器(eprom或快闪存储器)、光纤、便捷式紧凑盘只读存储器(cd-rom)、光学储存设备、磁储存设备、或上述内容的任何合适组合。
167.为了提供与用户的交互，可以在电子设备上实施此处描述的系统和技术，该电子设备具有：用于向用户显示信息的显示装置(例如，crt(阴极射线管)或者lcd(液晶显示器)监视器)；以及键盘和指向装置(例如，鼠标或者轨迹球)，用户可以通过该键盘和该指向装置来将输入提供给电子设备。其它种类的装置还可以用于提供与用户的交互；例如，提供给用户的反馈可以是任何形式的传感反馈(例如，视觉反馈、听觉反馈、或者触觉反馈)；并且可以用任何形式(包括声输入、语音输入或者、触觉输入)来接收来自用户的输入。
168.可以将此处描述的系统和技术实施在包括后台部件的计算系统(例如，作为数据服务器)、或者包括中间件部件的计算系统(例如，应用服务器)、或者包括前端部件的计算系统(例如，具有图形用户界面或者网络浏览器的用户计算机，用户可以通过该图形用户界面或者该网络浏览器来与此处描述的系统和技术的实施方式交互)、或者包括这种后台部件、中间件部件、或者前端部件的任何组合的计算系统中。可以通过任何形式或者介质的数字数据通信(例如，通信网络)来将系统的部件相互连接。通信网络的示例包括：局域网(lan)、广域网(wan)、区块链网络和互联网。
169.计算系统可以包括客户端和服务器。客户端和服务器一般远离彼此并且通常通过通信网络进行交互。通过在相应的计算机上运行并且彼此具有客户端-服务器关系的计算机程序来产生客户端和服务器的关系。服务器可以是云服务器，又称为云计算服务器或云主机，是云计算服务体系中的一项主机产品，以解决了传统物理主机与vps服务中，存在的管理难度大，业务扩展性弱的缺陷。
170.应该理解，可以使用上面所示的各种形式的流程，重新排序、增加或删除步骤。例如，本发明中记载的各步骤可以并行地执行也可以顺序地执行也可以不同的次序执行，只要能够实现本发明的技术方案所期望的结果，本文在此不进行限制。
171.上述具体实施方式，并不构成对本发明保护范围的限制。本领域技术人员应该明白的是，根据设计要求和其他因素，可以进行各种修改、组合、子组合和替代。任何在本发明的精神和原则之内所作的修改、等同替换和改进等，均应包含在本发明保护范围之内。

技术特征：
1.一种页面渲染方法，其特征在于，包括：获取待调用的共享页面的服务标识和路由信息；根据所述服务标识获取所述共享页面对应的系统访问地址，根据所述系统访问地址获取至少一个备选共享页面的页面信息；根据所述备选共享页面的页面信息更新页面的路由表，根据所述路由表和路由信息渲染所述待调用的共享页面。2.根据权利要求1所述的方法，其特征在于，在获取待调用的共享页面的服务标识和路由信息之后，还包括：根据所述路由信息匹配页面的路由表；在所述路由表中包含所述路由信息的情况下，执行根据所述路由表和路由信息渲染所述待调用的共享页面。3.根据权利要求1所述的方法，其特征在于，所述获取待调用的共享页面的服务标识和路由信息，包括：根据页面的跳转事件确定待调用的共享页面，获取所述共享页面的服务名称和路由地址。4.根据权利要求1所述的方法，其特征在于，所述根据所述服务标识获取所述共享页面对应的系统访问地址，根据所述系统访问地址获取至少一个备选共享页面的页面信息，包括：根据服务标识与系统访问地址之间的关联关系，获取与所述共享页面对应的系统访问地址；根据所述系统访问地址访问对应的目标系统，从所述目标系统获取与所述服务标识对应的至少一个备选共享页面的页面文件；获取所述页面文件中各备选共享页面的页面信息。5.根据权利要求4所述的方法，其特征在于，所述至少一个备选共享页面的页面文件的确定方式包括：根据预设的共享函数生成目标脚本文件；根据各备选共享页面的页面访问路径和页面代码，生成所述共享函数的对象内容，根据所述对象内容更新所述目标脚本文件；根据更新后的目标脚本文件生成至少一个备选共享页面的页面文件。6.根据权利要求5所述的方法，其特征在于，所述获取所述页面文件中各备选共享页面的页面信息，包括：加载所述页面文件，触发所述页面文件中的目标脚本文件中的共享函数；根据所述共享函数获取各备选共享页面对应的页面代码和页面访问路径。7.根据权利要求1-6中任一项所述的方法，其特征在于，所述根据所述备选共享页面的页面信息更新页面的路由表，根据所述路由表和路由信息渲染所述待调用的共享页面，包括：将所述备选共享页面的页面访问路径和页面代码添加至所述路由表；根据所述路由信息匹配所述路由表得到目标页面代码，根据所述路由信息和目标页面代码渲染所述待调用的共享页面。
8.一种页面渲染装置，其特征在于，包括：信息获取模块，用于获取待调用的共享页面的服务标识和路由信息；地址获取模块，用于根据所述服务标识获取所述共享页面对应的系统访问地址，根据所述系统访问地址获取至少一个备选共享页面的页面信息；页面渲染模块，用于根据所述备选共享页面的页面信息更新页面的路由表，根据所述路由表和路由信息渲染所述待调用的共享页面。9.一种电子设备，其特征在于，所述电子设备包括：至少一个处理器；以及与所述至少一个处理器通信连接的存储器；其中，所述存储器存储有可被所述至少一个处理器执行的计算机程序，所述计算机程序被所述至少一个处理器执行，以使所述至少一个处理器能够执行权利要求1-7中任一项所述的页面渲染方法。10.一种计算机可读存储介质，其特征在于，所述计算机可读存储介质存储有计算机指令，所述计算机指令用于使处理器执行时实现权利要求1-7中任一项所述的页面渲染方法。

技术总结
本发明实施例公开了一种页面渲染方法、装置、电子设备及存储介质。该方法包括获取待调用的共享页面的服务标识和路由信息；根据所述服务标识获取所述共享页面对应的系统访问地址，根据所述系统访问地址获取至少一个备选共享页面的页面信息；根据所述备选共享页面的页面信息更新页面的路由表，根据所述路由表和路由信息渲染所述待调用的共享页面。本发明实施例的技术方案，解决了相关技术中的页面渲染方案存在的资源占用以及交互性方面的问题，实现对相同业务的页面共享同一份页面代码，且无需新建窗口显示该共享页面，可以无障碍的执行页面交互。面交互。面交互。


技术研发人员：李伍尧 孙会首 李明达
受保护的技术使用者：曙光云计算集团有限公司
技术研发日：2023.06.08
技术公布日：2023/8/13