专栏首页coding个人笔记对权限管理的一些理解

对权限管理的一些理解

后台系统几乎都会涉及权限管理,实现的方式有蛮多的,只是前端只能做样子货,最终的权限管理还是得后台做。今天说说自己认知的权限管理的几个方式。

先说说一般后台要做的权限,接口级别,后台需要对每个接口都做权限,当这个用户没有对这个接口操作的权限(一般就是增删改查),应该返回一个约定好的code,让前端知道没有权限,然后前端通过这个code去做一些友好的提示。不要觉得后台做这个很麻烦,不说后台必须做,就我做个的几个系统,Java和php还有.net应该都有现成的机制去做,应该说是标配。

接着就是前端显示和操作的权限了。先说刚说的code返回的操作,一般项目都会封装一个全局的请求,axios还是fetch还是ajax(如果没有,当我没说),所以全局拦截约定好的code,没权限的是要弹窗提示还是跳转暂无权限的页面。

按钮权限:

按钮的权限也很简单,就是控制显示隐藏,后台会给按钮权限的字段,可以约定好格式。jq可以移除没有权限的dom,vue原理用的是v-if,也可以自己写个指令,其实原理也是v-if,通过el.remove()方法移除这个没有权限的按钮。react也很简单,本身就是js,直接操作。这只是显示层面的,但是如果有人直接调用接口,还是得后台拦截,前端只是做一层显示层面的权限。

菜单权限:

菜单权限方式就多了,一般后台会返回菜单的列表,你要自己处理组装成你的展示结构,这边以vue为主说几个方式。

1:请求拦截:

显示了后台返回的菜单,不做其他操作,就是只通过接口拦截做权限控制,最简单,效果也挺好,不需要那么多乱七八糟的逻辑,我最喜欢的方式。

2:路由拦截:

在路由前置钩子进行判断,判断即将进入的页面是否在返回的列表里面,可以防止那些记住页面地址,但是没有这个菜单的情况进行拦截。

let havePemission = {

'/': true,

'/about1': true

}

router.beforeEach((to, from, next) => {

if(havePemission[to.path]){

next()

}

})

这边只是简单提一下,权限的可以是后台返回,也可以是自己组装,一般存储在本地或者vuex。

3:动态路由:

vue提供的addRoutes可以实现,只是现在不支持删除和刷新,可以在路由拦截里面做:

let haveAdd = false;

router.beforeEach((to, from, next) => {

if(!haveAdd){

let defaultRouter = [{

path: '/about1',

name: 'About1',

component: () => import(/* webpackChunkName: "about1" */ '../views/About1.vue')

},

{

path: '/about2',

name: 'About2',

component: () => import(/* webpackChunkName: "about2" */ '../views/About2.vue')

}]

haveAdd = true;

router.addRoutes(defaultRouter);

}

next()

})

一定要有个标识,否在会报重复name的错,如果刷新了标识重置也是可以的。这边是把数据写死,一般会存储在本地,也可以存储在vuex,对异步要根据实际情况处理。

其实权限管理用来用去就这几个组合,优缺点都有,但是最终还是后台要做好,前端只是显示做一做权限。比如不是动态路由,那么用户记住一些没有权限进入的地址是一种情况,动态路由,暂时不支持刷新和删除,初始化之后如果要做一些操作就不好操作了,除非手动刷新。然后每次都要在路由守卫里面进行判断,也是缺点。优点就是体验好一些,不需要等请求返回。还是最喜欢请求拦截那个方式。

本文分享自微信公众号 - coding个人笔记(gh_2ce38b49dae1),作者:coding个人笔记

原文出处及转载信息见文内详细说明,如有侵权,请联系 yunjia_community@tencent.com 删除。

原始发表时间:2020-08-27

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

我来说两句

0 条评论
登录 后参与评论

相关文章

  • Webpack第四天

    在开发的时候,我们不仅仅需要改变js的时候去热更新,改变样式和HTML的时候同样要热更新。

    wade
  • JavaScript之调用栈

    很早之前写过栈和堆的结构,非常简单的介绍了一下,主要是为了明白深拷贝和浅拷贝。最近突然发现了调用栈这个概念,理解这个概念对于一些函数的执行能更清晰的理解,比如递...

    wade
  • CSS之BFC

    BFC或许很多人都没听过这个名词,不过我们在写样式的时候一直在使用BFC的概念。BFC的解释是:块格式化上下文(Block Formatting Context...

    wade
  • 【Unity游戏开发】Android6.0以上的动态权限申请问题

      最近公司的游戏在做安全性测试,期间也暴露出了不少安全上的问题。虽然我们今天要说的权限申请和安全性相关不大,但是也会影响到游戏的使用体验等,所以本篇博客中马三...

    马三小伙儿
  • 位运算的运用

    1.linux当中的位 在linux当中我们经常说777、775、755这个代表什么呢?其实很简单! 我们用1表示拥有执行权限,2表示拥有写入权限,4表...

    苦咖啡
  • JeeSite | 访问控制权限

      在各种后台系统中都会涉及到权限的管控,从功能权限的管控,到数据权限的管控,都是为了让系统的在使用的过程中更加的安全。功能权限管控是对针对不同的角色可以进行不...

    码农UP2U
  • 额 明天接着修改

    每个功能都有相应的URL地址。(对功能的控制就是对URL地址访问的控制)

    lpe234
  • Android动态权限

    导语 随机聊需求中出现几个涉及权限的bug,所以对动态权限机制做了一个简单的整理。 概述 Android应用程序通过请求权限来访问设备数据,例如联...

    MelonTeam
  • Linux学习笔记(七)权限管理命令

    umask默认权限是Linux权限的一种,主要用于让Linux中的新建文件和目录拥有默认权限

    LRainner
  • 让你相见恨晚的android权限业务实践

    在上一篇Android权限中,我们介绍了一些权限相关的知识,也简述了新的Android M带来的权限变化,我们如何应对这种变化?是摆着我们面前的紧要问题。 现在...

    腾讯移动品质中心TMQ

扫码关注云+社区

领取腾讯云代金券