CN113806657B - 基于微前端架构的页面加载方法、系统、设备及存储介质 - Google Patents
基于微前端架构的页面加载方法、系统、设备及存储介质 Download PDFInfo
- Publication number
- CN113806657B CN113806657B CN202111061402.9A CN202111061402A CN113806657B CN 113806657 B CN113806657 B CN 113806657B CN 202111061402 A CN202111061402 A CN 202111061402A CN 113806657 B CN113806657 B CN 113806657B
- Authority
- CN
- China
- Prior art keywords
- menu
- page
- parameters
- sub
- application
- 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
- 238000011068 loading method Methods 0.000 title claims abstract description 57
- 238000000034 method Methods 0.000 claims abstract description 26
- 230000003213 activating effect Effects 0.000 claims abstract description 7
- 238000004590 computer program Methods 0.000 claims description 9
- 230000000007 visual effect Effects 0.000 claims description 7
- 230000004913 activation Effects 0.000 claims description 6
- 230000009191 jumping Effects 0.000 claims description 4
- 230000008569 process Effects 0.000 description 5
- 238000012423 maintenance Methods 0.000 description 4
- 230000009471 action Effects 0.000 description 3
- 230000006978 adaptation Effects 0.000 description 2
- 230000008859 change Effects 0.000 description 2
- 230000008878 coupling Effects 0.000 description 2
- 238000010168 coupling process Methods 0.000 description 2
- 238000005859 coupling reaction Methods 0.000 description 2
- 238000010586 diagram Methods 0.000 description 2
- 230000006870 function Effects 0.000 description 2
- 238000012986 modification Methods 0.000 description 2
- 230000004048 modification Effects 0.000 description 2
- 230000009286 beneficial effect Effects 0.000 description 1
- 238000013461 design Methods 0.000 description 1
- 238000011161 development Methods 0.000 description 1
- 238000005516 engineering process Methods 0.000 description 1
Classifications
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F16/00—Information retrieval; Database structures therefor; File system structures therefor
- G06F16/90—Details of database functions independent of the retrieved data types
- G06F16/95—Retrieval from the web
- G06F16/958—Organisation or management of web site content, e.g. publishing, maintaining pages or automatic linking
Landscapes
- Engineering & Computer Science (AREA)
- Databases & Information Systems (AREA)
- Theoretical Computer Science (AREA)
- Data Mining & Analysis (AREA)
- Physics & Mathematics (AREA)
- General Engineering & Computer Science (AREA)
- General Physics & Mathematics (AREA)
- User Interface Of Digital Computer (AREA)
Abstract
本申请公开了一种基于微前端架构的页面加载方法,系统,设备及存储介质,该方法包括:在微前端架构的各个子应用中为子应用的各个页面建立一一对应的路由路径;在主应用中配置各个菜单各自的菜单参数;菜单参数包括:菜单ID,所属菜单组ID,所属子应用ID,对应页面路由路径;解析出访问链接中携带的菜单参数;通过解析出的菜单参数中的路由路径进行对应页面的加载;并通过解析出的菜单参数中的菜单组ID和子应用ID,进行相应的菜单组和子应用的加载;并通过解析出的菜单参数中菜单的ID,进行对应菜单的状态激活。应用本申请的方案,提升了系统的可维护性,能够支持同一组菜单中包含多个不同子应用的菜单的情况。
Description
技术领域
本发明涉及计算机技术领域,特别是涉及一种基于微前端架构的页面加载方法、系统、设备及存储介质。
背景技术
微前端是一种类似于微服务的架构,它将微服务的理念应用于浏览器端,将Web应用由单体应用转变为由多个小型前端应用聚合而成,各个前端应用可以独立运行、独立开发、独立部署。例如qiankun是目前比较完善的一个微前端解决方案。
主应用是微前端架构的众多应用中的基础工程,其余应用都在该主应用中注册,在此主应用中可以根据链接地址来决定要激活哪个工程。即主应用可以提供总体的控制功能。除了主应用之外的其余应用都称为子应用,子应用可以根据主应用的逻辑来激活或销毁,可以提供具体的业务性功能。
在目前的微前端架构下,主应用中只有简单的子应用入口链接,具体的页面路由需要由各个子应用自行处理,导致方案不够灵活。具体的,各个子应用只会处理自身的相关菜单,因此目前的方案中不会出现同一组菜单中包含了多个不同子应用的菜单的情况,即用户只能选择在同一子应用的各个菜单各自对应的页面之间进行切换,无法直接,方便地切换到其他子应用的菜单所对应的页面。
此外,目前的方案中,路由与菜单深度耦合,这是因为路由路径是按照菜单的嵌套层级进行设计的,例如菜单C的嵌套层级是A/B/C,则为相应页面设置路由路径时,也是按照菜单C的嵌套层级进行设计的。这样使得当菜单需要变化时,路由路径也需要重新设计。特别是在开发过程中,菜单的嵌套层级经常需要调整,使得路由路径也需要不断重新设计,操作复杂,难以维护。
综上所述,如何方便地切换到不同子应用的菜单所对应的页面,以及提高系统的可维护性,是目前本领域技术人员急需解决的技术问题。
发明内容
本发明的目的是提供一种基于微前端架构的页面加载方法、系统、设备及存储介质,以方便地切换到不同子应用的菜单所对应的页面,以及提高系统的可维护性。
为解决上述技术问题,本发明提供如下技术方案:
一种基于微前端架构的页面加载方法,包括:
在微前端架构的各个子应用中为所述子应用的各个页面建立一一对应的路由路径;
在主应用中配置各个菜单各自的菜单参数;其中,所述菜单参数包括:所述菜单的ID,所述菜单所属的菜单组ID,所述菜单所属的子应用ID,以及所述菜单对应页面的路由路径;
在获取到访问链接之后,解析出所述访问链接中携带的菜单参数;
通过解析出的所述菜单参数中的路由路径进行对应页面的加载;并通过解析出的所述菜单参数中的菜单组ID和子应用ID,进行相应的菜单组和子应用的加载;并通过解析出的所述菜单参数中菜单的ID,在加载出的菜单组中进行对应菜单的状态激活。
优选的,配置的所述菜单参数中还包括:所述菜单在所属的菜单组中的组内路径信息;
相应的,在解析出所述访问链接中携带的菜单参数之后,还包括:
通过解析出的所述菜单参数中的组内路径信息,将加载出的菜单组中符合所述组内路径信息的各个菜单项进行标记。
优选的,所述访问链接为用户通过点击菜单或者点击页面链接而生成的访问链接。
优选的,所述菜单参数还包括:所述菜单对应页面的操作权限信息;
相应的,在通过解析出的所述菜单参数中的路由路径进行对应页面的加载之后,还包括:
根据所述操作权限信息,对所述页面的各个操作标志进行显示控制,以使得所述页面中不满足所述操作权限信息的各个操作标志被隐藏。
优选的,各个菜单的菜单参数均存储在预设的数据库中;
相应的,所述在主应用中配置各个菜单各自的菜单参数,包括:
通过可视化操作页面,在主应用中配置各个菜单各自的菜单参数。
优选的,在获取到访问链接之后,还包括:
判断触发所述访问链接的用户是否具备针对所述访问链接的权限;
如果否,则跳转至系统首页并且输出表示无权访问的提示信息;
如果是,则执行所述解析出所述访问链接中携带的菜单参数的操作。
优选的,在加载出的菜单组中进行对应菜单的状态激活之后,还包括:
根据触发所述访问链接的用户的权限信息,确定出预先设定的对应于所述权限信息的隐藏项信息;
根据所述隐藏项信息,将加载出的所述菜单组中的相应的各项菜单进行隐藏。
一种基于微前端架构的页面加载系统,包括:
路由配置模块,用于在微前端架构的各个子应用中为所述子应用的各个页面建立一一对应的路由路径;
菜单配置模块,用于在主应用中配置各个菜单各自的菜单参数;其中,所述菜单参数包括:所述菜单的ID,所述菜单所属的菜单组ID,所述菜单所属的子应用ID,以及所述菜单对应页面的路由路径;
访问链接解析模块,用于在获取到访问链接之后,解析出所述访问链接中携带的菜单参数;
执行模块,用于通过解析出的所述菜单参数中的路由路径进行对应页面的加载;并通过解析出的所述菜单参数中的菜单组ID和子应用ID,进行相应的菜单组和子应用的加载;并通过解析出的所述菜单参数中菜单的ID,在加载出的菜单组中进行对应菜单的状态激活。
一种基于微前端架构的页面加载设备,包括:
存储器,用于存储计算机程序;
处理器,用于执行所述计算机程序以实现上述任一项所述的基于微前端架构的页面加载方法的步骤。
一种计算机可读存储介质,所述计算机可读存储介质上存储有计算机程序,所述计算机程序被处理器执行时实现上述任一项所述的基于微前端架构的页面加载方法的步骤。
应用本发明实施例所提供的技术方案,路由配置由子应用实现,而所有菜单都维护在主应用中,从而避免了传统方案中的路由与菜单深度耦合的情况,极大地提升了系统的可维护性。具体的,在微前端架构的各个子应用中,本申请会为各个子应用的各个页面建立一一对应的路由路径,也就使得在获取到访问链接之后,按照访问链接中携带的菜单参数中的路由路径,便可以进行对应页面的加载。而在主应用中可以配置各个菜单各自的菜单参数,菜单参数包括了该菜单的ID,该菜单所属的菜单组ID,该菜单所属的子应用ID,以及该菜单对应页面的路由路径,因此,在获取到访问链接之后,可以通过解析出的菜单参数中的菜单组ID和子应用ID,进行相应的菜单组和子应用的加载。由于各个菜单参数均是由主应用负责维护的,因此,如果需要进行菜单的嵌套层级的调整,只需要将该菜单参数中菜单所属的菜单组ID进行调整,而不需要调整该菜单对应页面的路由路径,即对应于菜单的页面的路由路径,并不需要随着菜单的嵌套层级的变化而变化,因此极大地提升了系统的可维护性。而如果需要调整某个菜单对应的页面,则只需要在菜单参数中进行菜单对应页面的路由路径的调整即可,并不需要在子应用中进行路由配置的调整,使得系统的可维护性很高。
并且,由于各个菜单参数均是由主应用负责维护的,因此在获取到访问链接时,可以直接进行该菜单所属的菜单组的加载,无论该菜单所属的菜单组中是否涉及到多个子应用的菜单,即本申请的方案能够支持同一组菜单中包含多个不同子应用的菜单的情况,使得用户方便地切换到不同子应用的菜单所对应的页面中。此外,本申请通过解析出的菜单参数中菜单的ID,在加载出的菜单组中进行该菜单的状态激活,使得用户可以明确得知当前的菜单。
附图说明
为了更清楚地说明本发明实施例或现有技术中的技术方案,下面将对实施例或现有技术描述中所需要使用的附图作简单地介绍,显而易见地,下面描述中的附图仅仅是本发明的一些实施例,对于本领域普通技术人员来讲,在不付出创造性劳动的前提下,还可以根据这些附图获得其他的附图。
图1为本发明中一种基于微前端架构的页面加载方法的实施流程图;
图2为本发明中一种基于微前端架构的页面加载系统的结构示意图。
具体实施方式
本发明的核心是提供一种基于微前端架构的页面加载方法,提升了系统的可维护性,能够支持同一组菜单中包含多个不同子应用的菜单的情况。
为了使本技术领域的人员更好地理解本发明方案,下面结合附图和具体实施方式对本发明作进一步的详细说明。显然,所描述的实施例仅仅是本发明一部分实施例,而不是全部的实施例。基于本发明中的实施例,本领域普通技术人员在没有做出创造性劳动前提下所获得的所有其他实施例,都属于本发明保护的范围。
请参考图1,图1为本发明中一种基于微前端架构的页面加载方法的实施流程图,该基于微前端架构的页面加载方法可以包括以下步骤:
步骤S101:在微前端架构的各个子应用中为子应用的各个页面建立一一对应的路由路径。
具体的,在微前端架构中,具有多个子应用,针对任意一个子应用,本申请会在该子应用中进行路由配置,即在该子应用中为该子应用的各个页面建立一一对应的路由路径。各个子应用需要进行路由配置的页面数量可以根据实际需要进行设定和调整。
此外需要说明的是,由于路由是分段的,是按照页面的嵌套逻辑一级一级地拼接而来,因此,本申请描述的路由路径也可以称为全路径路由。
例如每个页面有其自身的一级路由,例如页面01自身的这一级为路由为a,页面02自身的这一级为路由为b,页面03自身的这一级为路由为c。例如用户仅需要展示页面03,此时的全路径路由为c。又如,用户希望出现嵌套情况,具体是页面01(路由为a)中包含了页面02(路由为b),页面02中又包含了页面03(路由为c),则按照该嵌套关系展示出页面01,且页面01中包含页面02,页面02中又包含了页面03,此时的全路径路由为a/b/c。又如,用户希望出现嵌套情况,具体是页面02中包含了页面03,则按照该嵌套关系展示出页面02,页面02中又包含了页面03,此时的全路径路由为b/c。
在上述的3个例子中,展示出的页面03可以作为步骤S101中描述的一个页面,并为其设置相应的全路径路由。展示出的页面01嵌套02嵌套03,可以作为步骤S101中描述的一个页面,并为其设置相应的全路径路由。展示出的页面02嵌套03,可以作为步骤S101中描述的一个页面,并为其设置相应的全路径路由。也就是说,在步骤S101中,是为不同的页面设置相应的全路径路由。当全路径路由不相同时,展示出的页面也会不同。
步骤S102:在主应用中配置各个菜单各自的菜单参数;其中,菜单参数包括:菜单的ID,菜单所属的菜单组ID,菜单所属的子应用ID,以及菜单对应页面的路由路径。
本申请的方案中,将所有菜单均维护在主应用中,具体的,可以在主应用中配置每一个菜单各自的菜单参数。
进一步的,在本发明的一种具体实施方式中,为了方便开发者进行菜单的维护,将各个菜单的菜单参数均存储在预设的数据库中,这样使得进行菜单参数的修改时,无需如传统方案中需要修改代码,从而大幅提升维护效率。并且,步骤S102的操作可以具体包括:通过可视化操作页面,在主应用中配置各个菜单各自的菜单参数。由于可以提供专门的菜单管理页面,即可视化操作页面,使得在需要修改菜单参数时,从可视化操作页面进行操作即可,有利于提高维护效率。
菜单参数中需要包括:菜单的ID,菜单所属的菜单组ID,菜单所属的子应用ID,以及菜单对应页面的路由路径。
菜单的ID可以用来进行菜单的区分,菜单会有其所属的菜单组,菜单组的数量可以根据实际需要进行设定和调整,在本发明的一种具体实施方式中,各个菜单组可以为基于用户业务所确定出的菜单组,即按照实际的业务逻辑划分出所需要的菜单组,进而可以根据需要设定和调整各个菜单组中所需要设置的菜单。该种实施方式中按照实际业务逻辑进行菜单组划分的方式,有利于方便进行业务操作。
每个菜单均有其所属的子应用。每个菜单均有其对应的页面,菜单参数中需要包括该页面的路由路径,即需要包括该页面的全路径路由。
步骤S103:在获取到访问链接之后,解析出访问链接中携带的菜单参数。
本申请可以解析出访问链接中携带的菜单参数,因此可以理解的是,在生成访问链接时,便需要携带上菜单参数。
例如一种具体场合中,在生成访问链接时,需要依次拼接上菜单参数中的菜单的ID,菜单所属的菜单组ID,菜单所属的子应用ID,最后再加上菜单对应页面的路由路径,如果没有按照此格式进行访问链接的拼装,便会跳转失败。
步骤S104:通过解析出的菜单参数中的路由路径进行对应页面的加载;并通过解析出的菜单参数中的菜单组ID和子应用ID,进行相应的菜单组和子应用的加载;并通过解析出的菜单参数中菜单的ID,在加载出的菜单组中进行对应菜单的状态激活。
菜单参数中的路由路径为全路径路由,因此,直接通过解析出的菜单参数中的路由路径,便可以进行对应于该路由路径的页面加载。
同时,按照菜单参数中的菜单组ID,可以由主应用进行该菜单组的加载。按照菜单参数中的子应用ID,可以进行该子应用的加载。
并且本申请会通过解析出的菜单参数中菜单的ID,在加载出的菜单组中进行对应菜单的状态激活,使得用户可以明确得知当前的菜单。
由上文的描述可以看出,本申请在主应用中配置各个菜单各自的菜单参数,菜单参数中包括了该菜单的ID,该菜单所属的菜单组ID,该菜单所属的子应用ID,以及该菜单对应页面的路由路径。因此,如果工作人员需要进行菜单的嵌套层级的调整,例如将一个菜单调整到另一个菜单组中,则只需要将该菜单参数中的菜单组ID进行调整即可,该菜单对应的页面,以及该菜单对应页面的路由路径都不需要进行调整,因此极大地提升了系统的可维护性。
当然,如果对于某个菜单而言,需要调整该菜单对应的页面,则只需要在菜单参数中进行菜单对应页面的路由路径的调整即可,同样不需要在子应用中进行路由配置的调整,使得系统的可维护性很高。
并且,各个菜单由主应用进行管理,使得本申请的方案能够支持同一菜单组中包含多个不同子应用的菜单的情况,也就使得用户方便地切换到不同子应用的菜单所对应的页面中。
在本发明的一种具体实施方式中,配置的菜单参数中还包括:菜单在所属的菜单组中的组内路径信息;
相应的,在解析出访问链接中携带的菜单参数之后,还包括:
通过解析出的菜单参数中的组内路径信息,将加载出的菜单组中符合组内路径信息的各个菜单项进行标记。
该种实施方式中,考虑到菜单组中可能需要设置多层嵌套结构,例如菜单组1中包括了4个副菜单组,各个副菜单组中均具有若干菜单,则这一菜单嵌套信息无法仅通过菜单ID和菜单组ID体现,因此,该种实施方式中菜单参数中还包括了菜单在所属的菜单组中的组内路径信息,例如一种具体例子中的组内路径信息可以表示为:菜单组1的ID—3号副菜单组的编号—菜单ID,用来说明该菜单位于菜单组1的3号副菜单组中。当然,其他场合中组内路径信息可以为其他形式,能够准确地反映出菜单在菜单组中的嵌套结构即可。
相应的,在解析出访问链接中携带的菜单参数之后,可以通过解析出的菜单参数中的组内路径信息,将加载出的菜单组中符合组内路径信息的各个菜单项进行标记,即,使得用户可以方便地得知菜单在菜单组中的嵌套结构。
并且可以理解的是,在该种实施方式中,如果需要进行菜单的嵌套层级的调整,则需要将菜单参数中菜单所属的菜单组ID,以及菜单参数中的组内路径信息进行调整。
在实际应用中,用户可以通过点击菜单进行页面的切换,也可以通过点击页面链接进行页面的切换,即本申请描述的访问链接可以为用户通过点击菜单或者点击页面链接而生成的访问链接,保障了方案的灵活性。
在本发明的一种具体实施方式中,菜单参数还包括:菜单对应页面的操作权限信息;
相应的,在步骤S104中描述的通过解析出的菜单参数中的路由路径进行对应页面的加载之后,还可以包括:
根据操作权限信息,对页面的各个操作标志进行显示控制,以使得页面中不满足操作权限信息的各个操作标志被隐藏。
该种实施方式中,是考虑到部分场合中,工作人员会为一些页面统一设置有操作标志,即用来给用户操作的按钮,但是在部分场合中,对于其中的部分页面,工作人员又希望进行一些操作标志的隐藏,因此,该种实施方式中,通过在菜单参数设置有菜单对应页面的操作权限信息,从而可以方便地进行菜单对应页面的各个操作标志的显示控制,即在进行了页面的加载之后,可以根据菜单参数中的操作权限信息,对页面的各个操作标志进行显示控制,使得该页面中不满足操作权限信息的各个操作标志被隐藏。
在本发明的一种具体实施方式中,在获取到访问链接之后,还包括:
当对访问链接解析失败时,跳转至系统首页并且输出表示跳转失败的提示信息。
如上文的描述,访问链接需要按照设定规则进行生成,如果没有,便会出现解析失败的情况,该种实施方式中,当对访问链接解析失败时,会输出表示跳转失败的提示信息,以提示用户基于该访问链接的本次跳转失败。同时,可以跳转至系统首页,以方便用户进行其他操作。
在本发明的一种具体实施方式中,在获取到访问链接之后,还包括:
判断触发访问链接的用户是否具备针对访问链接的权限;
如果否,则跳转至系统首页并且输出表示无权访问的提示信息;
如果是,则执行解析出访问链接中携带的菜单参数的操作。
该种实施方式中,还会判断触发访问链接的用户是否具备针对访问链接的权限,如果是,说明允许该用户访问这一链接,反之则不允许,该种实施方式有利于提高系统的安全性。
进一步的,在本发明的一种具体实施方式中,在步骤S104中描述的在加载出的菜单组中进行对应菜单的状态激活之后,还可以包括:
根据触发访问链接的用户的权限信息,确定出预先设定的对应于权限信息的隐藏项信息;
根据隐藏项信息,将加载出的菜单组中的相应的各项菜单进行隐藏。
由上文的描述可知,在加载了页面之后,本申请的方案可以在页面中进行菜单组的加载。而该种实施方式中,考虑到对于部分页面而言,由于访问者的权限较低,可能会要求并不要显示整个菜单组,即需要进行菜单组中部分菜单项的隐藏,因此,该种实施方式中,根据触发访问链接的用户的权限信息,确定出预先设定的对应于权限信息的隐藏项信息。可以理解的是,与权限信息对应的隐藏项信息需要预先设定,而根据隐藏项信息,能够将加载出的菜单组中的相应的各项菜单进行隐藏。
应用本发明实施例所提供的技术方案,路由配置由子应用实现,而所有菜单都维护在主应用中,从而避免了传统方案中的路由与菜单深度耦合的情况,极大地提升了系统的可维护性。具体的,在微前端架构的各个子应用中,本申请会为各个子应用的各个页面建立一一对应的路由路径,也就使得在获取到访问链接之后,按照访问链接中携带的菜单参数中的路由路径,便可以进行对应页面的加载。而在主应用中可以配置各个菜单各自的菜单参数,菜单参数包括了该菜单的ID,该菜单所属的菜单组ID,该菜单所属的子应用ID,以及该菜单对应页面的路由路径,因此,在获取到访问链接之后,可以通过解析出的菜单参数中的菜单组ID和子应用ID,进行相应的菜单组和子应用的加载。由于各个菜单参数均是由主应用负责维护的,因此,如果需要进行菜单的嵌套层级的调整,只需要将该菜单参数中菜单所属的菜单组ID进行调整,而不需要调整该菜单对应页面的路由路径,即对应于菜单的页面的路由路径,并不需要随着菜单的嵌套层级的变化而变化,因此极大地提升了系统的可维护性。而如果需要调整某个菜单对应的页面,则只需要在菜单参数中进行菜单对应页面的路由路径的调整即可,并不需要在子应用中进行路由配置的调整,使得系统的可维护性很高。
并且,由于各个菜单参数均是由主应用负责维护的,因此在获取到访问链接时,可以直接进行该菜单所属的菜单组的加载,无论该菜单所属的菜单组中是否涉及到多个子应用的菜单,即本申请的方案能够支持同一组菜单中包含多个不同子应用的菜单的情况,使得用户方便地切换到不同子应用的菜单所对应的页面中。此外,本申请通过解析出的菜单参数中菜单的ID,在加载出的菜单组中进行该菜单的状态激活,使得用户可以明确得知当前的菜单。
相应于上面的方法实施例,本发明实施例还提供了一种基于微前端架构的页面加载系统,可以与上文相互对应参照。
参见图2所示,为本发明中一种基于微前端架构的页面加载系统的结构示意图,包括:
路由配置模块201,用于在微前端架构的各个子应用中为子应用的各个页面建立一一对应的路由路径;
菜单配置模块202,用于在主应用中配置各个菜单各自的菜单参数;其中,菜单参数包括:菜单的ID,菜单所属的菜单组ID,菜单所属的子应用ID,以及菜单对应页面的路由路径;
访问链接解析模块203,用于在获取到访问链接之后,解析出访问链接中携带的菜单参数;
执行模块204,用于通过解析出的菜单参数中的路由路径进行对应页面的加载;并通过解析出的菜单参数中的菜单组ID和子应用ID,进行相应的菜单组和子应用的加载;并通过解析出的菜单参数中菜单的ID,在加载出的菜单组中进行对应菜单的状态激活。
在本发明的一种具体实施方式中,配置的菜单参数中还包括:菜单在所属的菜单组中的组内路径信息;
执行模块204,还用于:
通过解析出的菜单参数中的组内路径信息,将加载出的菜单组中符合组内路径信息的各个菜单项进行标记。
在本发明的一种具体实施方式中,菜单参数还包括:菜单对应页面的操作权限信息;
相应的,执行模块204,还用于:
根据操作权限信息,对页面的各个操作标志进行显示控制,以使得页面中不满足操作权限信息的各个操作标志被隐藏。
在本发明的一种具体实施方式中,访问链接为用户通过点击菜单或者点击页面链接而生成的访问链接。
在本发明的一种具体实施方式中,各个菜单组为基于用户业务所确定出的菜单组。
在本发明的一种具体实施方式中,各个菜单的菜单参数均存储在预设的数据库中;
相应的,菜单配置模块202,具体用于:通过可视化操作页面,在主应用中配置各个菜单各自的菜单参数。
在本发明的一种具体实施方式中,还包括:
权限判断模块,用于在获取到访问链接之后,判断触发访问链接的用户是否具备针对访问链接的权限;
如果否,则执行跳转失败提示模块,用于跳转至系统首页并且输出表示无权访问的提示信息;
如果是,则执行访问链接解析模块203。
在本发明的一种具体实施方式中,权限判断模块,还用于:根据触发访问链接的用户的权限信息,确定出预先设定的对应于权限信息的隐藏项信息;
执行模块204,还用于:根据隐藏项信息,将加载出的菜单组中的相应的各项菜单进行隐藏。
相应于上面的方法和系统实施例,本发明实施例还提供了一种基于微前端架构的页面加载设备以及一种计算机可读存储介质,可以与上文相互对应参照。
该基于微前端架构的页面加载设备可以包括:
存储器,用于存储计算机程序;
处理器,用于执行计算机程序以实现上述任一项的基于微前端架构的页面加载方法的步骤。
该计算机可读存储介质上存储有计算机程序,计算机程序被处理器执行时实现上述任一项的基于微前端架构的页面加载方法的步骤。这里所说的计算机可读存储介质包括随机存储器(RAM)、内存、只读存储器(ROM)、电可编程ROM、电可擦除可编程ROM、寄存器、硬盘、可移动磁盘、CD-ROM、或技术领域内所公知的任意其它形式的存储介质。
还需要说明的是,在本文中,诸如第一和第二等之类的关系术语仅仅用来将一个实体或者操作与另一个实体或操作区分开来,而不一定要求或者暗示这些实体或操作之间存在任何这种实际的关系或者顺序。而且,术语“包括”、“包含”或者其任何其他变体意在涵盖非排他性的包含,从而使得包括一系列要素的过程、方法、物品或者设备不仅包括那些要素,而且还包括没有明确列出的其他要素,或者是还包括为这种过程、方法、物品或者设备所固有的要素。在没有更多限制的情况下,由语句“包括一个……”限定的要素,并不排除在包括所述要素的过程、方法、物品或者设备中还存在另外的相同要素。
专业人员还可以进一步意识到,结合本文中所公开的实施例描述的各示例的单元及算法步骤,能够以电子硬件、计算机软件或者二者的结合来实现,为了清楚地说明硬件和软件的可互换性,在上述说明中已经按照功能一般性地描述了各示例的组成及步骤。这些功能究竟以硬件还是软件方式来执行,取决于技术方案的特定应用和设计约束条件。专业技术人员可以对每个特定的应用来使用不同方法来实现所描述的功能,但是这种实现不应认为超出本发明的范围。本文中应用了具体个例对本发明的原理及实施方式进行了阐述,以上实施例的说明只是用于帮助理解本发明的技术方案及其核心思想。应当指出,对于本技术领域的普通技术人员来说,在不脱离本发明原理的前提下,还可以对本发明进行若干改进和修饰,这些改进和修饰也落入本发明权利要求的保护范围内。
Claims (9)
1.一种基于微前端架构的页面加载方法,其特征在于,包括:
在微前端架构的各个子应用中为所述子应用的各个页面建立一一对应的路由路径;
在主应用中配置各个菜单各自的菜单参数;其中,所述菜单参数包括:所述菜单的ID,所述菜单所属的菜单组ID,所述菜单所属的子应用ID,以及所述菜单对应页面的路由路径;
在获取到访问链接之后,解析出所述访问链接中携带的菜单参数;
通过解析出的所述菜单参数中的路由路径进行对应页面的加载;并通过解析出的所述菜单参数中的菜单组ID和子应用ID,进行相应的菜单组和子应用的加载;并通过解析出的所述菜单参数中菜单的ID,在加载出的菜单组中进行对应菜单的状态激活;
其中,各个菜单由主应用进行管理,同一菜单组中包含多个不同子应用的菜单;
各个菜单的菜单参数均存储在预设的数据库中;
相应的,所述在主应用中配置各个菜单各自的菜单参数,包括:
通过可视化操作页面,在主应用中配置各个菜单各自的菜单参数。
2.根据权利要求1所述的基于微前端架构的页面加载方法,其特征在于,配置的所述菜单参数中还包括:所述菜单在所属的菜单组中的组内路径信息;
相应的,在解析出所述访问链接中携带的菜单参数之后,还包括:
通过解析出的所述菜单参数中的组内路径信息,将加载出的菜单组中符合所述组内路径信息的各个菜单项进行标记。
3.根据权利要求1所述的基于微前端架构的页面加载方法,其特征在于,所述访问链接为用户通过点击菜单或者点击页面链接而生成的访问链接。
4.根据权利要求1所述的基于微前端架构的页面加载方法,其特征在于,所述菜单参数还包括:所述菜单对应页面的操作权限信息;
相应的,在通过解析出的所述菜单参数中的路由路径进行对应页面的加载之后,还包括:
根据所述操作权限信息,对所述页面的各个操作标志进行显示控制,以使得所述页面中不满足所述操作权限信息的各个操作标志被隐藏。
5.根据权利要求1至4任一项所述的基于微前端架构的页面加载方法,其特征在于,在获取到访问链接之后,还包括:
判断触发所述访问链接的用户是否具备针对所述访问链接的权限;
如果否,则跳转至系统首页并且输出表示无权访问的提示信息;
如果是,则执行所述解析出所述访问链接中携带的菜单参数的操作。
6.根据权利要求5所述的基于微前端架构的页面加载方法,其特征在于,在加载出的菜单组中进行对应菜单的状态激活之后,还包括:
根据触发所述访问链接的用户的权限信息,确定出预先设定的对应于所述权限信息的隐藏项信息;
根据所述隐藏项信息,将加载出的所述菜单组中的相应的各项菜单进行隐藏。
7.一种基于微前端架构的页面加载系统,其特征在于,包括:
路由配置模块,用于在微前端架构的各个子应用中为所述子应用的各个页面建立一一对应的路由路径;
菜单配置模块,用于在主应用中配置各个菜单各自的菜单参数;其中,所述菜单参数包括:所述菜单的ID,所述菜单所属的菜单组ID,所述菜单所属的子应用ID,以及所述菜单对应页面的路由路径;
访问链接解析模块,用于在获取到访问链接之后,解析出所述访问链接中携带的菜单参数;
执行模块,用于通过解析出的所述菜单参数中的路由路径进行对应页面的加载;并通过解析出的所述菜单参数中的菜单组ID和子应用ID,进行相应的菜单组和子应用的加载;并通过解析出的所述菜单参数中菜单的ID,在加载出的菜单组中进行对应菜单的状态激活;
其中,各个菜单由主应用进行管理,同一菜单组中包含多个不同子应用的菜单;
各个菜单的菜单参数均存储在预设的数据库中;
相应的,所述菜单配置模块,具体用于:
通过可视化操作页面,在主应用中配置各个菜单各自的菜单参数。
8.一种基于微前端架构的页面加载设备,其特征在于,包括:
存储器,用于存储计算机程序;
处理器,用于执行所述计算机程序以实现如权利要求1至6任一项所述的基于微前端架构的页面加载方法的步骤。
9.一种计算机可读存储介质,其特征在于,所述计算机可读存储介质上存储有计算机程序,所述计算机程序被处理器执行时实现如权利要求1至6任一项所述的基于微前端架构的页面加载方法的步骤。
Priority Applications (1)
Application Number | Priority Date | Filing Date | Title |
---|---|---|---|
CN202111061402.9A CN113806657B (zh) | 2021-09-10 | 2021-09-10 | 基于微前端架构的页面加载方法、系统、设备及存储介质 |
Applications Claiming Priority (1)
Application Number | Priority Date | Filing Date | Title |
---|---|---|---|
CN202111061402.9A CN113806657B (zh) | 2021-09-10 | 2021-09-10 | 基于微前端架构的页面加载方法、系统、设备及存储介质 |
Publications (2)
Publication Number | Publication Date |
---|---|
CN113806657A CN113806657A (zh) | 2021-12-17 |
CN113806657B true CN113806657B (zh) | 2023-12-22 |
Family
ID=78940715
Family Applications (1)
Application Number | Title | Priority Date | Filing Date |
---|---|---|---|
CN202111061402.9A Active CN113806657B (zh) | 2021-09-10 | 2021-09-10 | 基于微前端架构的页面加载方法、系统、设备及存储介质 |
Country Status (1)
Country | Link |
---|---|
CN (1) | CN113806657B (zh) |
Families Citing this family (5)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN114253650B (zh) * | 2021-12-27 | 2024-05-14 | 中国农业银行股份有限公司 | 一种展示组件过渡方法、装置、设备及存储介质 |
CN114661375A (zh) * | 2022-03-24 | 2022-06-24 | 阿里云计算有限公司 | 应用集成方法及装置 |
CN114816564A (zh) * | 2022-04-01 | 2022-07-29 | 维沃移动通信有限公司 | 应用加载方法、装置和电子设备 |
CN114968460A (zh) * | 2022-05-27 | 2022-08-30 | 金蝶软件(中国)有限公司 | 一种页面切换的方法和相关设备 |
CN115473670A (zh) * | 2022-07-27 | 2022-12-13 | 青岛海尔科技有限公司 | 响应信息的发送方法和装置、存储介质及电子装置 |
Citations (2)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN111666585A (zh) * | 2020-04-16 | 2020-09-15 | 北京百度网讯科技有限公司 | 子应用访问的方法、装置、电子设备以及可读存储介质 |
CN112783580A (zh) * | 2021-01-18 | 2021-05-11 | 微民保险代理有限公司 | 基于子应用的路由控制方法、装置和计算机设备 |
Family Cites Families (1)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
US20090275307A1 (en) * | 2008-05-01 | 2009-11-05 | Starscriber Corporation | Mobile Communications Facilitated by Interactive Menus |
-
2021
- 2021-09-10 CN CN202111061402.9A patent/CN113806657B/zh active Active
Patent Citations (2)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN111666585A (zh) * | 2020-04-16 | 2020-09-15 | 北京百度网讯科技有限公司 | 子应用访问的方法、装置、电子设备以及可读存储介质 |
CN112783580A (zh) * | 2021-01-18 | 2021-05-11 | 微民保险代理有限公司 | 基于子应用的路由控制方法、装置和计算机设备 |
Non-Patent Citations (1)
Title |
---|
基于大数据理论指导下的高校食堂点餐微信小程序功能设计;周亚楠;张佳仪;任雨杰;史文娟;;电脑知识与技术(第34期);全文 * |
Also Published As
Publication number | Publication date |
---|---|
CN113806657A (zh) | 2021-12-17 |
Similar Documents
Publication | Publication Date | Title |
---|---|---|
CN113806657B (zh) | 基于微前端架构的页面加载方法、系统、设备及存储介质 | |
CN110221872B (zh) | 页面跳转方法、装置、电子设备和存储介质 | |
US7600234B2 (en) | Method for launching applications | |
US8042150B2 (en) | Automatic generation of policies and roles for role based access control | |
CN110287109A (zh) | 协议接口的测试方法、装置、计算机设备及其存储介质 | |
EP2597566B1 (en) | Software maintenance supporting device and electronic control device verified by the same | |
US20070016829A1 (en) | Test case generator | |
EP2109323A1 (en) | Dynamic fault analysis for a centrally managed network element in a telecommunications system | |
CN101419439A (zh) | 用于过程控制系统的定制功能块 | |
Lago et al. | Managing non-trivial internet-of-things systems with conversational assistants: A prototype and a feasibility experiment | |
CN111475390A (zh) | 日志采集系统部署方法、装置、设备及存储介质 | |
CN109547259A (zh) | 应用配置方法、装置、存储介质和电子设备 | |
CN103649924A (zh) | 嵌入式装置、程序产生装置和程序 | |
CN110175043A (zh) | 协议接口代码版本更新通知的生成方法和装置 | |
US20130262845A1 (en) | Method and system for generating a standardized system build file | |
CN116360887A (zh) | 一种程序参数加载方法、装置、设备及存储介质 | |
JP6660911B2 (ja) | 信頼性判定装置、信頼性判定システムおよびソースコード共有システム | |
CN114527993A (zh) | 应用程序部署方法、装置、设备及介质 | |
US7743386B2 (en) | Context objects for accessing message content | |
CN106897057A (zh) | 插件调用通知栏的方法及装置 | |
CN103297865B (zh) | 智能网业务离线复现的方法及系统 | |
Al Saad et al. | ScatterEditor: An eclipse based tool for programming, testing and managing wireless sensor networks | |
WO2014076951A1 (ja) | プログラム設定装置、及び、プログラム設定方法 | |
JP2008003841A (ja) | ビルド処理方法、ビルド処理装置、及びプログラム | |
CN117270956B (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 | ||
GR01 | Patent grant | ||
GR01 | Patent grant |