axios 全局设置 token 信息 一时失言乱红尘 2022-04-24 01:46 421阅读 0赞 在[上篇][Link 1]中我们学习了什么是 token，本篇介绍前端如何全局设置每次请求都带上从后端获取来的 `token` 当然不全局设置也可以，那只能在每次请求都去 `cookie`、`localStorage` 取一次 `token`，使得代码非常冗余 #### 方法1 #### `token` 通常都是在**注册、登录**后，从后端接口取到的，所以我们只需要在前端**调用注册、登录请求时**修改一下就行了，下面以登录接口为例 export const login = (user) => ( axios .post('/user/login', user) .then(res => request.defaults.headers.common['Authorization'] = res ) ) 之后的每次请求头都会加上 `Authorization` 字段 此方法有两点不好： 1. 同样的代码在注册处也要加一次产生冗余 2. 用户注销后，第二次登录(注册)同样会带上 token，故最好在注销处再将请求头修改回去 #### 方法2 #### 借用 axios 的拦截器，直接贴代码 axios.interceptors.request.use((config) => { if (['/user/login', '/user/register'].indexOf(config.url) === -1) { const token = localStorage.getItem('token') if (token) { config.headers.Authorization = token } } return config }) 这里只用写一次代码完成全局的配置，而且方便进一步添加类似**不需要 token 的请求白名单**之类的功能 [Link 1]: https://blog.csdn.net/zwkkkk1/article/details/89212515
还没有评论，来说两句吧...