Vue项目实战中token和axios的二次封装使用，一起来写出优雅的项目结构

前言

token通常在管理系统中用来进行身份和权限验证，大家应该都不陌生，这篇文章教大家对token和axios进行封装，保持项目结构良好的可读性，对token比较陌生的同学，那就赶紧学起来吧~

什么是token

token是对用户进行登录验证的一串密钥，它由后端生成，一般前端进行登录验证通过后就会得到后端返回过来的token，后期的一些操作请求也需要携带token来保证接口安全

token身份验证的过程

1. 前端发送登录请求
2. 请求成功，拿到token，存入本地localstorage中
3. 发送请求携带token，后端验证token返回结果
4. 退出登录，销毁token

token 的封装

上面叙述了token的验证过程，那么对于token我们需要先把他存储到本地，然后每次请求携带token，最后退出登录需要销毁token。所以需要三个方法分别是：存储，拿到，销毁
对于这三种方法，为了方便使用，我们对其进行封装
一般建立utils文件夹存放一些工具方法，在里面新建token.js文件

export function setToken(tokenKey, token) {
    // 将token存入localStorage
    return localStorage.setItem(tokenKey, token)
}

export function getToken(tokenKey) {
   	//拿到localStorage中的token