Vue element template 的mock详解

1.将cooike方法变成session和localstorage

// 游览器储存token
const TokenKey = 'vue_admin_template_token'
const myStorage = window.localStorage
export function getToken() {
  if (myStorage) {
    return localStorage.getItem(TokenKey)
  } else {
    return sessionStorage.getItem(TokenKey)
  }
}

export function setToken(token) {
  if (myStorage) {
    return localStorage.setItem(TokenKey, token)
  } else {
    return sessionStorage.setItem(TokenKey, token)
  }
}

export function removeToken() {
  if (myStorage) {
    return localStorage.removeItem(TokenKey)
  } else {
    return sessionStorage.removeItem(TokenKey)
  }
}

2.mock的数据

他已经配置好了

我们按着走

1.在webapck devserver配置

2. 关于如何发送token的问题

1.express 就是

config.headers['Authorization'] = `Bearer ${getToken()}`

2.mock就是

config.headers['X-Token'] = getToken()

3.token的原理

类似于http握手,不过规则是你自己定的

1.当第一次客户端像服务端发送请求的时候,服务端生成token,然后将这个客户端返回,vuex 设置好token,以及做好相关的 增删查改.在每个会话阶段,发送token进行验证,退出的时候,对token进行删除.