WO2020135583A1

WO2020135583A1 - 处理前端页面的权限控制方法及装置

Info

Publication number: WO2020135583A1
Application number: PCT/CN2019/128695
Authority: WO
Inventors: 陈建国; 袁宏永; 张志彪; 陈涛; 苏国锋; 孙占辉; 黄全义; 杨秀中
Original assignee: Tsinghua University; Beijing Global Safety Technology Co Ltd
Current assignee: Tsinghua University; Beijing Global Safety Technology Co Ltd
Priority date: 2018-12-29
Filing date: 2019-12-26
Publication date: 2020-07-02
Anticipated expiration: 2021-06-29
Also published as: CN109753283A; CN109753283B

Abstract

一种处理前端页面的权限控制方法及装置，其中，方法包括：对原始HTML文档进行解析，并根据预设控制逻辑进行自定义标签的解析，以对原始HTML页面进行页面渲染，并判断是否需要调用JavaScript逻辑代码（S101）；如果需要调用JavaScript逻辑代码，则拦截JavaScript逻辑代码的调用方法（S102）；根据调用方法对注解进行解析，以根据解析注释判断当前用户是否拥有控制权限，并在拥有控制权限时，允许调用（S103）。该方法根据权限与角色的关键字就可轻松实现页面元素和逻辑代码的权限控制，页面元素权限控制还能满足直观性的要求，并实现前端权限控制代码零编写的目标，有效提高控制的直观性、通用性和兼容性，简单易实现。

Description

处理前端页面的权限控制方法及装置

相关申请的交叉引用

本申请要求北京辰安科技股份有限公司与清华大学于2018年12月29日提交的、发明名称为“处理前端页面的权限控制方法及装置”的、中国专利申请号“201811645607.X”的优先权。

技术领域

本发明涉及权限控制技术领域，特别涉及一种处理前端页面的权限控制方法及装置。

背景技术

相关技术，页面权限控制的技术分为两类，具体包括：

(1)基于后端渲染页面技术，比如类似JSP技术，其页面元素的权限控制可以通过JSTL自定义标签进行控制。但是，基于JavaScript的业务逻辑的权限控制就需要通过编写判断性的逻辑代码来实现，从而导致权限控制的维护性较差，而且容易出现页面元素和业务逻辑权限控制不一致的问题。

(2)纯前端页面逻辑的控制，这种权限控制是通过AJAX技术，每次请求时将限控制数据获取后，通过代码进行业务逻辑的权限控制，并同时对页面元素进行控制，此种实现方案虽然确保了权限控制逻辑的一致性，但通过代码对页面元素进行控制，导致了大量的重复代码的不可维护性。

综上，相关技术的两类的页面的权限控制技术，主要存在以下缺点：

1、权限控制逻辑的重复，容易导致逻辑的不一致，同时也不利于后期维护；

2、页面元素控制靠代码进行逻辑判断，不够清晰直观，且因代码量大量导致不易于维护的问题。

发明内容

本申请是基于发明人对以下问题的认识和发现做出的：

通常权限控制一般在服务端进行控制，权限控制常用的方案就是RBAC基于角色的访问控制，其基本思路就是，对涉及的各种权限不是直接授予具体的用户，而是在用户集合与权限集合之间建立一个角色集合。每一种角色对应一组相应的权限。用户被分配了适当的角色后，该用户就拥有此角色的所有操作权限。这样做的好处是，不必在每次创建用户时都进行分配权限的操作，只要分配用户相应的角色即可，而且角色的权限变更比用户的权限变更要少得多，这样将简化用户的权限管理，减少系统的开销。

随着软件业的不断发展，B/S架构的系统逐渐趋向于服务客户端，对于前端的交互体验要求也越来越高，采用前后端分离的技术实现成为一种趋势，因此，为实现前端更好的交互体验，前端的权限控制就非常有必要，而前端又没有成熟的权限控制方案，使用的基于JavaScript编码方式解决前端业务逻辑和视图的统一权限控制，需要大量重复性的代码来实现，导致了系统越来越难易维护，长期将造成软件系统的维护成本不断的增长。

在前后端分离的大背景下，替代方案就是通过编写自己的JavaScript代码对HTML中的元素进行控制，同时在JavaScript代码中，通过大量重复的业务逻辑代码来判断，导致了重复代码的不可维护性，尤其在当下比较重视前端应用的情况下，前端业务本来就是越来越复杂，如果权限控制不能很好的解决，一方面会影响交互，影响应用的效果，如果通过硬编码的方式来解决，就势必导致代码的不可维护性，造成前端维护的工作量越来越大，不利于以前端为主的产品发展。

本发明旨在至少在一定程度上解决相关技术中的技术问题之一。

为此，本发明的一个目的在于提出一种处理前端页面的权限控制方法，该方法有效提高控制的直观性、通用性和兼容性，简单易实现。

本发明的另一个目的在于提出一种处理前端页面的权限控制装置。

为达到上述目的，本发明一方面实施例提出了一种处理前端页面的权限控制方法，包括以下步骤：对原始HTML文档进行解析，并根据预设控制逻辑进行自定义标签的解析，以对原始HTML页面进行页面渲染，并判断是否需要调用JavaScript逻辑代码；如果需要调用所述JavaScript逻辑代码，则拦截所述JavaScript逻辑代码的调用方法；根据所述调用方法对注解进行解析，以根据解析注释判断当前用户是否拥有控制权限，并在拥有所述控制权限时，允许调用。

本发明实施例的处理前端页面的权限控制方法，根据权限与角色的关键字就可轻松实现页面元素和逻辑代码的权限控制，而且页面元素权限控制还能满足直观性的要求，并实现前端权限控制代码零编写的目标，从而有效提高控制的直观性、通用性和兼容性，简单易实现。

另外，根据本发明上述实施例的处理前端页面的权限控制方法还可以具有以下附加的技术特征：

进一步地，在本发明的一个实施例中，在对所述原始HTML页面进行页面渲染之前，还包括：检测是否同步最新的权限数据；如果未同步所述最新的权限数据，则在读取所述最新的权限数据后，解析并存储至缓存装置。

进一步地，在本发明的一个实施例中，还包括：在非页面初始化，且需要调用所述JavaScript逻辑代码时，拦截所述JavaScript逻辑代码的调用方法。

进一步地，在本发明的一个实施例中，在对所述原始HTML页面进行页面渲染之前，还包括：检测访问页面是否需要所述控制权限；如果不需要所述控制权限，则显示渲染页面；如果需要所述控制权限，且所述当前用户登录，则对原始HTML文档进行解析，否则跳转至登录界面。

进一步地，在本发明的一个实施例中，在对所述原始HTML页面进行页面渲染之前，还包括：判断是否同步最新权限数据；如果同步所述最新权限数据，则对原始HTML文档进行解析，否则读取所述新权限数据。

为达到上述目的，本发明另一方面实施例提出了一种处理前端页面的权限控制装置，包括：解析模块，用于对原始HTML文档进行解析，并根据预设控制逻辑进行自定义标签的解析，以对原始HTML页面进行页面渲染，并判断是否需要调用JavaScript逻辑代码；第一拦截模块，用于在需要调用所述JavaScript逻辑代码时，拦截所述JavaScript逻辑代码的调用方法；控制模块，用于根据所述调用方法对注解进行解析，以根据解析注释判断当前用户是否拥有控制权限，并在拥有所述控制权限时，允许调用。

本发明实施例的处理前端页面的权限控制装置，根据权限与角色的关键字就可轻松实现页面元素和逻辑代码的权限控制，而且页面元素权限控制还能满足直观性的要求，并实现前端权限控制代码零编写的目标，从而有效提高控制的直观性、通用性和兼容性，简单易实现。

另外，根据本发明上述实施例的处理前端页面的权限控制装置还可以具有以下附加的技术特征：

进一步地，在本发明的一个实施例中，还包括：检测模块，用于检测是否同步最新的权限数据，并在未同步所述最新的权限数据，且在读取所述最新的权限数据后，解析并存储至缓存装置。

进一步地，在本发明的一个实施例中，还包括：第二拦截模块，用于在非页面初始化，且需要调用所述JavaScript逻辑代码时，拦截所述JavaScript逻辑代码的调用方法。

进一步地，在本发明的一个实施例中，还包括：第二检测模块，用于检测访问页面是否需要所述控制权限，在不需要所述控制权限时，则显示渲染页面，并在需要所述控制权限，且所述当前用户登录，则对原始HTML文档进行解析，否则跳转至登录界面。

进一步地，在本发明的一个实施例中，还包括：判断模块，用于判断是否同步最新权限数据，在同步所述最新权限数据时，对原始HTML文档进行解析，否则读取所述新权限数据。

本发明附加的方面和优点将在下面的描述中部分给出，部分将从下面的描述中变得明显，或通过本发明的实践了解到。

附图说明

本发明上述的和/或附加的方面和优点从下面结合附图对实施例的描述中将变得明显和容易理解，其中：

图1为根据本发明一个实施例的处理前端页面的权限控制方法的流程图；

图2为根据本发明一个具体实施例的处理前端页面的权限控制方法的流程图；

图3为根据本发明一个实施例的处理前端页面的权限控制装置的结构示意图。

具体实施方式

下面详细描述本发明的实施例，所述实施例的示例在附图中示出，其中自始至终相同或类似的标号表示相同或类似的元件或具有相同或类似功能的元件。下面通过参考附图描述的实施例是示例性的，旨在用于解释本发明，而不能理解为对本发明的限制。

下面参照附图描述根据本发明实施例提出的处理前端页面的权限控制方法及装置，首先将参照附图描述根据本发明实施例提出的处理前端页面的权限控制方法。

图1是本发明一个实施例的处理前端页面的权限控制方法的流程图。

如图1所示，该处理前端页面的权限控制方法包括以下步骤：

在步骤S101中，对原始HTML文档进行解析，并根据预设控制逻辑进行自定义标签的解析，以对原始HTML页面进行页面渲染，并判断是否需要调用JavaScript逻辑代码。

可以理解的是，如图2所示，当权限已获取或同步更新到前端缓存装置中后，就开始通过自定义标签解析器对原始HTML文档进行解析，并根据权限装置中的控制逻辑，进行自定义标签的解析，如原始HTML代码：

<buttontype＝"button"onclick＝"delete()"hasRole＝"administrator">删除</button>。

假设当前登录用户是普通身份用户，没有"administrator"角色，那么经过自定义标签解析器解析之后的HTML代码，会将该<button>标签从原始Dom结构中进行删除，这样渲染出来的页面将没有【删除】按钮，达到实现前端的权限控制的目的。

具体而言，HTML自定义标签实现对HTML元素的权限控制，HTML自定义标签是以约定的标识作为标签名称，name的值为权限数据中角色或权限的名称，要使用自定义HTML标签，首先需要在<HTML>标签中进行这样的申明：<HTML xmlns:gsauth>，其中gsauth便是自定义HTML标签，xmlns即xml name space的缩写，是HTML标记的命名空间属性，一般其声明在元素开始标记的地方。只要在这里申明了要使用的gsauth这一自定义标签，语法分析器就会认识这个标签，并赋予定义的属性了，如下例：

HTML代码：

<gsauth:hasRole name＝"administrator">

<buttontype＝"button"onclick＝"delete()">删除</button>

</gsauth:hasRole>

上述示例代码中“<gsauth:hasRole name＝"administrator"></gsauth:hasRole>”部分就是完整的自定义标签，其中“gsauth”为HTML自定义标签名称，hasRole为自定标签的授权含义标识，代表是否拥有指定的角色。该自定义标签最终代表的含义就是拥有administrator角色的用户，才有【删除】按钮的操作权限。在页面初始化时，通过权限控制装置处理后，只有拥有角色为“administrator”用户，才能看得到【删除】按钮。

如果仅是控制页面的单一元素，还可以采用一种简约写法，将原自定义标签的中的授权含义标识，作为该标签的属性。如将上述按简约写法如下：

HTML代码：

<buttontype＝"button"onclick＝"delete()"hasRole＝"administrator">删除</button>

基于上述定义，本发明实施例中提供多种授权含义标识供灵活使用，具体参见表1。

表1

上述为本发明实施例通过自定义标签解析器处理HTML文件，在此之前，本发明实施例获取服务器端权限数据并解析后进行前端缓存，下面将结合实施例进行详细阐述。

进一步地，在本发明的一个实施例中，在对原始HTML页面进行页面渲染之前，还包括：检测访问页面是否需要控制权限；如果不需要控制权限，则显示渲染页面；如果需要控制权限，且当前用户登录，则对原始HTML文档进行解析，否则跳转至登录界面。

可以理解的是，如图2所示，当在访问页面时，首先判断当前页面是否需要权限控制，如果不需要进行页面权限控制，则直接渲染页面进行显示，如果需要进行页面权限控制，则需要判断用户是否已登录，若用户未登录，则直接调转到登录界面。

进一步地，在本发明的一个实施例中，在对原始HTML页面进行页面渲染之前，还包括：检测是否同步最新的权限数据；如果未同步最新的权限数据，则在读取最新的权限数据后，解析并存储至缓存装置。

其中，在本发明的一个实施例中，在对原始HTML页面进行页面渲染之前，还包括：判断是否同步最新权限数据；如果同步最新权限数据，则对原始HTML文档进行解析，否则读取新权限数据。

可以理解的是，如图2所示，若已登录，则进入权限控制装置，并根据用户信息首先判断是否同步到了最新的权限数据，如果已是最新权限数据，则直接通过自定义标签解析器处理HTML文件，如果未获取到权限数据或者权限数据不是最新的，需要先读取服务器端权限数据，并进行解析之后，统一存入前端权限数据缓存装置中。

在步骤S102中，如果需要调用JavaScript逻辑代码，则拦截JavaScript逻辑代码的调用方法。

可以理解的是，如图2所示，本发明实施例通过权限控制拦截器对调用方法的拦截，当原始HTML页面已经过自定义标签解析器处理之后，进行页面渲染时，如果页面初始化过程中，需要调用JavaScript逻辑代码时，权限控制拦截器对调用方法进行拦截。

进一步地，在本发明的一个实施例中，还包括：在非页面初始化，且需要调用JavaScript逻辑代码时，拦截JavaScript逻辑代码的调用方法。

可以理解的是，非页面初始化时，当调用JavaScript的方法时，也同样会通过权限控制拦截器对调用的方法进行拦截。

在步骤S103中，根据调用方法对注解进行解析，以根据解析注释判断当前用户是否拥有控制权限，并在拥有控制权限时，允许调用。

可以理解的是，如图2所示，本发明实施例通过注解解析器对进行调用方法的权限控制，当权限控制拦截器对调用的方法进行拦截之后，针对该方法基于AOP实现注解的解析，通过解析注释来判断当前用户是否拥有相应的权限，来决定是否允许调用该方法，最终实现调用方法时的权限控制目标。

具体而言，本发明实施例通过注解和编码方式实现对JavaScript逻辑进行权限控制，具体包括：

当要控制JavaScrip代码的权限时，需通过注解或编码方式来实现，其中注解是一种以@开头的特殊标识，此种标识只能用于方法上，不能用于方法内，如果需要在方法中间控制权限，需通过编码方式调用由权限控制装置提供权限控制方法来实现。

基于注释控制方法的示例如下：

JavaScript代码：

class Person{

@hasRole("administrator")

delete(this.children.id)；}

上述示例代码中“@hasRole("administrator")”部分就是一个完整的权限控制注解，其中“hasRole”为授权含义标识(授权含义标识参见上表)，代表是否拥有指定的角色。该注解最终代表的含义就是拥有administrator角色的用户，才有执行删除操作权限。当业务逻辑代码在调用此方法前，先由权限控制装置中的拦截器进行拦截，并判断此方法是否进行了注解标注，如果标注了，则在调用该方法前，先要通过权限控制装置进行判断，只有拥有角色为“administrator”用户，才能调用此注解标识的方法。

基于编码方式实现的权限控制就很容易理解了，就是直接通过调用权限控制装置中已提供判断的权限方法即可，示例如下：

if(hasRole(“administrator”)){

//有删除权限的代码

}else{//无删除权限的代码}

上述示例代码中“hasRole(“administrator”)”部分就是权限控制装置中已内置的方法，其中“hasRole”为方法名称，此装置中提供的所有授权方法名称同上述中所列授权含义标识。

根据本发明实施例提出的处理前端页面的权限控制方法，通过权限控制装置实现统一的权限控制逻辑的处理，并通过HTML自定义标签实现对页面元素直观的权限控制，且全面兼容主流的技术框架，不需额外开，而且发开发阶段不需编写权限控制逻辑，只需维护权限和角色名称，不需维护代码，从而具有一致性、直观性、通用性、简单易用、可维护性等优点。

其次参照附图描述根据本发明实施例提出的处理前端页面的权限控制装置。

图3是本发明一个实施例的处理前端页面的权限控制装置的结构示意图。

如图3所示，该处理前端页面的权限控制装置10包括：解析模块100、第一拦截模块200和控制模块300。

其中，解析模块100用于对原始HTML文档进行解析，并根据预设控制逻辑进行自定义标签的解析，以对原始HTML页面进行页面渲染，并判断是否需要调用JavaScript逻辑代码。第一拦截模块200用于在需要调用JavaScript逻辑代码时，拦截JavaScript逻辑代码的调用方法。控制模块300用于根据调用方法对注解进行解析，以根据解析注释判断当前用户是否拥有控制权限，并在拥有控制权限时，允许调用。本发明实施例的装置10根据权限与角色的关键字就可轻松实现页面元素和逻辑代码的权限控制，而且页面元素权限控制还能满足直观性的要求，并实现前端权限控制代码零编写的目标，从而有效提高控制的直观性、通用性和兼容性，简单易实现。

进一步地，在本发明的一个实施例中，本发明实施例的装置10还包括：检测模块。其中，检测模块用于检测是否同步最新的权限数据，并在未同步最新的权限数据，且在读取最新的权限数据后，解析并存储至缓存装置。

进一步地，在本发明的一个实施例中，本发明实施例的装置10还包括：第二拦截模块。其中，第二拦截模块用于在非页面初始化，且需要调用JavaScript逻辑代码时，拦截JavaScript逻辑代码的调用方法。

进一步地，在本发明的一个实施例中，本发明实施例的装置10还包括：第二检测模块。其中，第二检测模块用于检测访问页面是否需要控制权限，在不需要控制权限时，则显示渲染页面，并在需要控制权限，且当前用户登录，则对原始HTML文档进行解析，否则跳转至登录界面。

进一步地，在本发明的一个实施例中，本发明实施例的装置10还包括：判断模块。其中，判断模块用于判断是否同步最新权限数据，在同步最新权限数据时，对原始HTML文档进行解析，否则读取新权限数据。

需要说明的是，前述对处理前端页面的权限控制方法实施例的解释说明也适用于该实施例的处理前端页面的权限控制装置，此处不再赘述。

根据本发明实施例提出的处理前端页面的权限控制装置，通过权限控制装置实现统一的权限控制逻辑的处理，并通过HTML自定义标签实现对页面元素直观的权限控制，且全面兼容主流的技术框架，不需额外开，而且发开发阶段不需编写权限控制逻辑，只需维护权限和角色名称，不需维护代码，从而具有一致性、直观性、通用性、简单易用、可维护性等优点。

此外，术语“第一”、“第二”仅用于描述目的，而不能理解为指示或暗示相对重要性或者隐含指明所指示的技术特征的数量。由此，限定有“第一”、“第二”的特征可以明示或者隐含地包括至少一个该特征。在本发明的描述中，“多个”的含义是至少两个，例如两个，三个等，除非另有明确具体的限定。

在本说明书的描述中，参考术语“一个实施例”、“一些实施例”、“示例”、“具体示例”、或“一些示例”等的描述意指结合该实施例或示例描述的具体特征、结构、材料或者特点包含于本发明的至少一个实施例或示例中。在本说明书中，对上述术语的示意性表述不必须针对的是相同的实施例或示例。而且，描述的具体特征、结构、材料或者特点可以在任一个或多个实施例或示例中以合适的方式结合。此外，在不相互矛盾的情况下，本领域的技术人员可以将本说明书中描述的不同实施例或示例以及不同实施例或示例的特征进行结合和组合。

尽管上面已经示出和描述了本发明的实施例，可以理解的是，上述实施例是示例性的，不能理解为对本发明的限制，本领域的普通技术人员在本发明的范围内可以对上述实施例进行变化、修改、替换和变型。

Claims

一种处理前端页面的权限控制方法，其特征在于，包括以下步骤：

对原始HTML文档进行解析，并根据预设控制逻辑进行自定义标签的解析，以对原始HTML页面进行页面渲染，并判断是否需要调用JavaScript逻辑代码；

如果需要调用所述JavaScript逻辑代码，则拦截所述JavaScript逻辑代码的调用方法；以及

根据所述调用方法对注解进行解析，以根据解析注释判断当前用户是否拥有控制权限，并在拥有所述控制权限时，允许调用。
根据权利要求1所述的处理前端页面的权限控制方法，其特征在于，在对所述原始HTML页面进行页面渲染之前，还包括：

检测是否同步最新的权限数据；

如果未同步所述最新的权限数据，则在读取所述最新的权限数据后，解析并存储至缓存装置。
根据权利要求1所述的处理前端页面的权限控制方法，其特征在于，还包括：

在非页面初始化，且需要调用所述JavaScript逻辑代码时，拦截所述JavaScript逻辑代码的调用方法。
根据权利要求1所述的处理前端页面的权限控制方法，其特征在于，在对所述原始HTML页面进行页面渲染之前，还包括：

检测访问页面是否需要所述控制权限；

如果不需要所述控制权限，则显示渲染页面；

如果需要所述控制权限，且所述当前用户登录，则对原始HTML文档进行解析，否则跳转至登录界面。
根据权利要求1或4所述的处理前端页面的权限控制方法，其特征在于，在对所述原始HTML页面进行页面渲染之前，还包括：

判断是否同步最新权限数据；

如果同步所述最新权限数据，则对原始HTML文档进行解析，否则读取所述新权限数据。
一种处理前端页面的权限控制装置，其特征在于，包括：

解析模块，用于对原始HTML文档进行解析，并根据预设控制逻辑进行自定义标签的解析，以对原始HTML页面进行页面渲染，并判断是否需要调用JavaScript逻辑代码；

第一拦截模块，用于在需要调用所述JavaScript逻辑代码时，拦截所述JavaScript逻辑代码的调用方法；以及

控制模块，用于根据所述调用方法对注解进行解析，以根据解析注释判断当前用户是否拥有控制权限，并在拥有所述控制权限时，允许调用。
根据权利要求6所述的处理前端页面的权限控制装置，其特征在于，还包括：

检测模块，用于检测是否同步最新的权限数据，并在未同步所述最新的权限数据，且在读取所述最新的权限数据后，解析并存储至缓存装置。
根据权利要求6所述的处理前端页面的权限控制装置，其特征在于，还包括：

第二拦截模块，用于在非页面初始化，且需要调用所述JavaScript逻辑代码时，拦截所述JavaScript逻辑代码的调用方法。
根据权利要求6所述的处理前端页面的权限控制装置，其特征在于，还包括：

第二检测模块，用于检测访问页面是否需要所述控制权限，在不需要所述控制权限时，则显示渲染页面，并在需要所述控制权限，且所述当前用户登录，则对原始HTML文档进行解析，否则跳转至登录界面。
根据权利要求6或9所述的处理前端页面的权限控制装置，其特征在于，还包括：

判断模块，用于判断是否同步最新权限数据，在同步所述最新权限数据时，对原始HTML文档进行解析，否则读取所述新权限数据。