前端是怎么做权限控制的？

2024-04-20 13:27:43

前端是怎么做权限控制的？

第一种权限控制

比如现在有一些项目成员，有的项目成员是测试，这个项目成员登录项目的时候就可以看到"提交冒烟用例"按钮，但是其它的项目成员则不能够看到，这个功能是如何实现的呢？

前端会把每一个项目成员的权限存储在一个表里面，如下：

测试人员开发人员产品经理

A按钮权限 A按钮权限 C按钮权限

B按钮权限 F按钮权限 D按钮权限

这样的话，测试人员登录的时候就会显示出A按钮，B按钮；开发人员登录的时候就会显示A按钮，F按钮；产品经理登录的时候就会显示C按钮，D按钮。

前端只需要根据当前登录人去表里面查询对应的权限，就可以显示出当前登录人权限之内的按钮了，这就是前端的权限控制。

我自己在项目中遇到的与权限相关的需求经验

我的这个经验中，前端显示一个项目成员的对应按钮的方法就是：去后端返回的数据中查询一下测试人员，产品经理，项目经理等人，然后给这些查到的人直接分配一些具体的按钮，这是我们这里前端进行权限控制的方法，如下图：

但是这样会出现一个问题，就是当前端同时开启两个上述的页面的时候，在其中一个页面"杨絮把测试人修改成了别人"，按道理来讲第二个页面中杨絮就不能再修改测试人了，因为目前的测试人已经不是杨絮了，如果页面刷新之后样杨絮就会失去“修改”按钮，只是我们页面还没刷新，所以这个时候杨絮在登录的时候，页面上还会显示这个修改按钮。现在的问题是杨絮还可以点击这个修改按钮，进行测试人的修改。
所以我现在要解决这个问题：就是在前端访问后端修改测试人的接口的时候，我在我写的后端接口里面进行一次判断：看看当前登录人是不是测试人，如果当前登录人不是测试人我不让前端调用我的接口，直接给它返回一些提示信息。

前端是怎么做权限控制的？相关推荐

SQL Server使用视图做权限控制
问题引入这天老鸟火急火燎的跑到菜鸟旁边,想必是遇到什么难题了:"现在有这么一个场景,假如有三种角色,并且存在层级关系,他们需要访问同一个数据源表,但是需要做权限控制,使得每种角色只能看到自 ...
Spring Cloud Data Flow整合Cloudfoundry UAA服务做权限控制
我最新最全的文章都在南瓜慢说 www.pkslow.com ,欢迎大家来喝茶! 1 前言关于Spring Cloud Data Flow这里不多介绍,有兴趣可以看下面的文章.本文主要介绍如何整合D ...
使用IHttpHandler做权限控制[ASP.NET | IHttpHandler | AjaxPro | UserHostName]
正文 Web.Config配置如下: <add verb="POST,GET" path="/page/*.aspx,/page/*/*.aspx,/page/*/ ...
新窗口打开vue项目中的静态pdf文件，并做权限控制
问题:公司系统做安全测试,其中一个问题是没有登录的情况下,直接访问 "项目地址/operate.pdf "此地址,会展示pdf文件. 描述:点击系统内的一个按钮会打开新窗口展示系统 ...
dtree做权限控制
一个项目需要一个权限控制的模块,因为是重构的项目,用的是dtree,所有着手研究了一手dtree. 网上也有好的地案例,比如http://www.jq22.com/jquery-info5331这个网 ...
使用auth_request做权限控制
网上很多如标题的文章,为何我还要写呢??? 网上一搜一大堆对我来说完全没用的文章,或者直接nginx官网复制过来,看得我贼无语.我的需求是校验参数是拼接到链接后面,而不是请求头的,网上大部分都是通过请 ...
python描述器做权限控制_Python装饰器14-描述器
描述器这是Python一个重要的概念,英文名:Descriptor descriptor是对象的一个属性,只不过它存在于类的dict中并且有特殊方法get(可能还有set和__delete)而具有一 ...
如何用 Vue 实现前端权限控制
本文来自作者雅X共赏在 GitChat 上分享「如何用 Vue 实现前端权限控制(路由权限 + 视图权限 + 请求权限)」,「阅读原文」查看交流实录. 「文末高能」编辑 | 哈比为什么做前端 ...
基于Vue实现后台系统权限控制
原文地址:http://refined-x.com/2017/08/29/基于Vue实现后台系统权限控制/,转载请注明出处. 用Vue这类双向绑定框架做后台系统再适合不过,后台系统相比普通前端项目除了 ...

最新文章

热门文章