前端项目权限管理

421 阅读2分钟

一、什么是权限管理

        权限管理是指一个角色(如vip和非vip)在一个系统中只能使用指定的功能并且只能访问指定的界面,权限管理是一个项目当中必不可少的部分。

二、怎么做到权限管理功能

 1、不需要权限访问的路由,比如登录页面、404页面,有时首页也不需要。
 2、需要权限访问的路由
 

角色权限控制

在讨论角色权限控制之前,我们应该先清楚一个点:在引入了角色概念的系统中,任何该系统中的账号都应该至少拥有一个或几个角色身份,这样该账号就拥有当前这一个角色(或几个角色)的相关权限功能。简而言之,我们不会直接把权限赋予给用户,而是通过角色来赋予给用户。角色权限控制主要是解决给不同角色赋予不同权限从而赋予不同账户权限,接下来先了解一下角色的概念。

登录权限控制解决的问题:

1、路由问题

    router.beforeEach/利用路由守卫,定义一个invisible数组,数组中包含着所有无需登录就可以查看的页面路由      ,也可在路由对象中以添加meta的方式去实现登录页面权限控制,相关代码如下:
    export const routes = [
  {
     path: '/login', //登录页面
     name: 'Login',
     component: Login,
  },
  {
     path:"/list", // 列表页
     name:"List",
     meta:{
        need_login:true //需要登录
     }
  }
]
    

2、菜单栏问题 根据后端的返回进行控制,前端后端都做前端控制,前端路由可以增加字段,和后端配合,进行路由过滤,不同的用户角色展示不同的路由。

3、按钮问题

有些按钮也是需要权限来判断是否显示,这时就可以通过自定义指令来解决。