基于Vue3的页面显示方法、装置、计算机设备及存储介质制造方法及图纸

技术编号:37723001 阅读:12 留言:0更新日期:2023-06-02 00:24
本申请实施例涉及计算机设备领域,公开了一种基于Vue3的页面显示方法、装置、计算机设备及存储介质。所述方法包括:根据账户信息获取用户权限;基于所述用户权限,遍历对应的待显示菜单及URL地址;基于所述URL地址,进行Vue组件映射,生成动态路由;将所述动态路由添加到全局路由中,且基于所述全局路由显示所述待显示菜单对应的页面。本申请实现不同的用户权限,动态分配不同的菜单和URL地址,使得用户只可以看到自己用户权限下的页面,从而保证系统安全。反之,如果用户没有权限,则无法访问。则无法访问。则无法访问。

【技术实现步骤摘要】
基于Vue3的页面显示方法、装置、计算机设备及存储介质


[0001]本申请实施例涉及界面设计
,尤其涉及一种基于Vue3的页面显示方法、装置、计算机设备及存储介质。

技术介绍

[0002]目前,应用系统大多数以WEB形式对外展示,用户通过浏览器访问应用系统。一般情况下,应用系统具有规模大、权限复杂的特点,目前的应用系统一般通过RBAC权限管理模型控制,RBAC(Role

Based Access Control)是基于角色的访问控制,是实施面向企业安全策略的一种有效的访问控制方式。在传统的JAVA或者前端项目中,菜单资源作为权限控制的一种重要资源,其安全管理的重点内容主要为哪些页面对用户可见,哪些页面对用户不可见。
[0003]本申请专利技术人在实现本申请实施例的过程中,发现:在传统的技术体系里,页面路径都是静态路径,静态路径可以被直接引用,即使用户没有权限,但是获取到了该静态路径,仍然可以访问该静态路径对应的页面,因此会存在安全隐患。

技术实现思路

[0004]本申请实施例的目的是提供一种基于Vue3的页面显示方法、计算机设备及存储介质,实现不同的用户权限,动态分配不同的菜单和URL地址,使得用户只可以看到自己用户权限下的页面,从而保证系统安全。反之,如果用户没有权限,则无法访问。
[0005]为解决上述技术问题,本申请实施例采用以下技术方案:
[0006]第一方面,本申请实施例中提供给了一种基于Vue3的页面显示方法,所述方法包括:
[0007]根据账户信息获取用户权限;
[0008]基于所述用户权限,遍历对应的待显示菜单及URL地址;
[0009]基于所述URL地址,进行Vue组件映射,生成动态路由;
[0010]将所述动态路由添加到全局路由中,且基于所述全局路由显示所述待显示菜单对应的页面。
[0011]在一些实施例中,所述方法还包括:
[0012]如果接收到针对第一URL地址的加载指令,则获取所述第一URL地址对应的第一用户权限;
[0013]判断所述第一用户权限是否与预设账户信息对应;
[0014]如果所述第一用户权限与所述预设账户信息不对应,则跳转至预设页面,所述预设页面包括404错误。
[0015]在一些实施例中,在所述判断所述第一用户权限是否与预设账户信息对应之后,所述方法还包括:
[0016]如果所述第一用户权限与所述预设账户信息对应,则加载与所述第一用户权限对
应的第一动态路由;
[0017]基于所述第一动态路由,跳转至第一URL地址对应的显示页面。
[0018]在一些实施例中,在基于所述全局路由显示所述待显示菜单对应的页面之后,所述方法还包括:
[0019]在接收到基于所述待显示菜单被触发的选择操作指令时,跳转至所述URL地址对应的显示页面。
[0020]在一些实施例中,在所述根据账户信息获取用户权限之前,所述方法还包括:
[0021]在接收到加载系统指令时,显示静态路由对应的静态菜单页面,所述静态菜单页面包括登录页面。
[0022]在一些实施例中,所述用户权限通过RBAC权限模型分配。
[0023]第二方面,本申请还提供一种基于Vue3的页面显示装置,所述装置包括:
[0024]第一获取模块,用于根据账户信息获取用户权限;
[0025]遍历模块,用于基于所述用户权限,遍历对应的待显示菜单及URL地址;
[0026]生成模块,用于基于所述URL地址,进行Vue组件映射,生成动态路由;
[0027]第一显示模块,用于将所述动态路由添加到全局路由中,且基于所述全局路由显示所述待显示菜单对应的页面。
[0028]在一些实施例中,所述装置还包括:
[0029]第二获取模块,用于如果接收到针对第一URL地址的加载指令,则获取所述第一URL地址对应的第一用户权限;
[0030]判断模块,用于判断所述第一用户权限是否与预设账户信息对应;
[0031]第一跳转模块,用于如果所述第一用户权限是否与预设账户信息不对应,则跳转至预设页面,所述预设页面包括404错误。
[0032]第三方面,本申请还提供一种计算机设备,所述计算机设备包括:
[0033]至少一个处理器,以及
[0034]存储器,所述存储器与所述处理器通信连接,所述存储器存储有可被所述至少一个处理器执行的指令,所述指令被所述至少一个处理器执行,以实现如上第一方面所述的基于Vue3的页面显示方法的步骤。
[0035]第四方面,本申请还提供一种非易失性计算机可读存储介质,所述计算机可读存储介质存储有计算机可执行指令,当所述计算机可执行指令被计算机设备执行时,以实现如上第一方面所述的基于Vue3的页面显示方法的步骤。
[0036]本申请实施例的有益效果:区别于现有技术的情况,本申请实施例提供的基于Vue3的页面显示方法、装置、计算机设备及存储介质,计算机设备的系统在接收到登录信息时,根据登录信息获取用户权限;然后,基于用户权限,遍历其对应的拥有权限的菜单和URL地址,基于所述URL地址,进行Vue组件映射,生成动态路由,从而实现通过用户权限动态路由加载。将所述动态路由添加到全局路由中,且基于所述全局路由显示所述其权限菜单对应的页面,即用户在登录系统后,才能获取其角色权限资源,在存在权限的情况下才会存在路由,从而显示待显示菜单对应的页面,拥有权限的用户则可以访问该菜单对应的页面。反之,没有权限的用户的系统则不会出现需要用户权限才能访问的路由对应的菜单页面,从而加强系统的安全性。
附图说明
[0037]一个或多个实施例通过与之对应的附图中的图片进行示例性说明,这些示例性说明并不构成对实施例的限定,附图中具有相同参考数字标号的元件表示为类似的元件,除非有特别申明,附图中的图不构成比例限制。
[0038]图1是本申请基于Vue3的页面显示方法的一个实施例的流程示意图;
[0039]图2是本申请基于Vue3的页面显示方法的登录页面示意图;
[0040]图3是本申请基于Vue3的页面显示方法的又一个实施例的流程示意图
[0041]图4是本申请基于Vue3的页面显示装置的一个实施例的结构示意图;
[0042]图5是本申请计算机设备的一个实施例中控制器的硬件结构示意图。
具体实施方式
[0043]下面结合具体实施例对本申请进行详细说明。以下实施例将有助于本领域的技术人员进一步理解本申请,但不以任何形式限制本申请。应当指出的是,对本领域的普通技术人员来说,在不脱离本申请构思的前提下,还可以做出若干变形和改进。这些都属于本申请的保护范围。
[0044]为了使本申请的目的、技术方案及优点更加清楚明白,以下结合附图及实施例,对本申请进行进一步详细说明。应当理解,此处所描述的具体实施例仅用以解释本申请,并不用于限定本申请。
[本文档来自技高网
...

【技术保护点】

【技术特征摘要】
1.一种基于Vue3的页面显示方法,其特征在于,所述方法包括:根据账户信息获取用户权限;基于所述用户权限,遍历对应的待显示菜单及URL地址;基于所述URL地址,进行Vue组件映射,生成动态路由;将所述动态路由添加到全局路由中,且基于所述全局路由显示所述待显示菜单对应的页面。2.根据权利要求1所述的方法,其特征在于,所述方法还包括:如果接收到针对第一URL地址的加载指令,则获取所述第一URL地址对应的第一用户权限;判断所述第一用户权限是否与预设账户信息对应;如果所述第一用户权限与所述预设账户信息不对应,则跳转至预设页面,所述预设页面包括404错误。3.根据权利要求1所述的方法,其特征在于,在所述判断所述第一用户权限是否与预设账户信息对应之后,所述方法还包括:如果所述第一用户权限与所述预设账户信息对应,则加载与所述第一用户权限对应的第一动态路由;基于所述第一动态路由,跳转至第一URL地址对应的显示页面。4.根据权利要求1所述的方法,其特征在于,在基于所述全局路由显示所述待显示菜单对应的页面之后,所述方法还包括:在接收到基于所述待显示菜单被触发的选择操作指令时,跳转至所述URL地址对应的显示页面。5.根据权利要求1所述的方法,其特征在于,在所述根据账户信息获取用户权限之前,所述方法还包括:在接收到加载系统指令时,显示静态路由对应的静态菜单页面,所述静态菜单页面包括登录页面。6.根...

【专利技术属性】
技术研发人员:曹其顺李玉邱韶杰岳杨戴毅丁振强
申请(专利权)人:深圳市讯方技术股份有限公司
类型:发明
国别省市:

网友询问留言 已有0条评论
  • 还没有人留言评论。发表了对其他浏览者有用的留言会获得科技券。

1