Vue2.0-token权限处理

 

token一种身份的验证，在大多数网站中，登录的时候都会携带token，去访问其他页面，token就想当于一种令牌。可以判断用户是否登录状态。本次页面是通过Element-ui搭建的登录界面

当用户登录的时候，向后端发起请求的时候，后端会返回给我一个token，前端可以进行校验，进行处理token

当前端拿到后端返回的token，可以通过localStorage存储到本地，然后通过jwt-decode对token进行解析，jwt-decode是一种对token的解析包，通过npm install jwt-decode

设置好存储方式后，当用户再次登录的时候，在浏览器段可以看点用户存储的token。

当页面很多地方需要用到token的时候，用户必须携带token才能访问其他页面，可以通过请求拦截和响应拦截设置，并且在响应拦截的时候处理token是否过时，过期时间是通过后端设置的，前端需要判断token的状态码是否过时就行

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56

import  axios from  'axios' import  { Loading ,Message} from  'element-ui'   //引入了element-ui框架库 import  router from  './router/index.js' let  loading;   function  startLoading() {      loading =Loading.service({          lock:  true ,          text:  '加载中...' ,          background:  'rgba(0, 0, 0, 0.7)'      }); }   function  endLoading() {      loading.close() }   // 请求拦截   axios.interceptors.request.use(config => {        startLoading()      //设置请求头      if