zoukankan      html  css  js  c++  java
  • 前端面试:权限控制

    0.前言
    记得当年面试的时候,面试官问我,前端怎么做权限控制,咱也不太会这个,只能尴尬回答道:“都是老大搭的架子,我只负责写业务模块代码”。
    如今自己也做了很多项目了,觉得有必有对前端权限控制做一个总结。

    前端权限控制一直是前端必须掌握的一个知识点,一般来说稍微正规一点的后台系统肯定有权限控制。当然还是那句老话,前端本来就是不安全的,真正的安全还是需要后端兄弟去把关,所以后端也必须按做权限控制!我们前端的权限校验主要的目的是过滤不该有的请求和操作,减少服务端压力。

    我个人认为前端权限控制应该分为四个方面,接口权限、按钮权限,页面权限,路由权限,下面就分四个部分探讨下权限控制怎么做

    1.接口权限
    原则
    接口权限最简单,目前一般采用jwt的形式来验证,没有通过的话一般返回401 Authentication Required

    登录完拿到Token,将token存起来(cookie或者ssessionStorage),每次登录的时候头部携带token就行了(axios请求拦截器实现)。

    伪码实现
    const {token} = login()
    cookie.set('token',token)
    axios.interceptors.request.use(config => {
    config.headers['token'] = cookie.get('token')
    return config
    })

    2.按钮权限
    原则
    一个页面会有新增,删除,编辑等等按钮。不同用户应该是有不同操作权限的。
    我们不妨定义权限码 0:不可见 1:不可编辑 2:可编辑
    我们提前和后端约定好按钮的名字,后端会返回一个按钮权限列表。然后我们根据权限列表使用v-if指令或者 绑定disabled属性达到相应权限效果。
    当然更好的最好是自己写一个自定义权限指令,实质就是根据相应权限操作dom

    伪码实现
    比如概览页面的编辑按钮 名字先和后端定义好叫做overview-edit

    // overviwe.vue overview是概览页面的路由名
    ...

  • 相关阅读:
    Java基础(十四)——API(Calendar类、System类、StringBuilder类、包装类)
    异常
    Java基础(十三)——权限修饰符和内部类
    知识点总结
    Java基础(十二)— —多态
    Java基础(十一)— —继承、抽象类和接口
    java基础(十)——继承
    小程序外部向组件内部传递externalClasses -- 传入样式wxss
    小程序组件交互 -- 传入js
    promise封装小程序的请求类(request,清爽易懂)
  • 原文地址:https://www.cnblogs.com/wwyydd/p/14356207.html
Copyright © 2011-2022 走看看