vue中"localstorage 存储 token", 并且设置请求拦截器,每次请求携带此 token
时间: 2023-08-13 12:06:35 浏览: 272
好的,这里是一个在Vue中实现"localstorage 存储 token"和设置请求拦截器的示例代码:
1. 在登录成功后将token存储到localStorage中:
```javascript
// 登录成功后将token存储到localStorage中
localStorage.setItem('token', token);
```
2. 在请求拦截器中获取localStorage中的token,并将其添加到请求头中:
```javascript
import axios from 'axios';
// 请求拦截器
axios.interceptors.request.use(
config => {
// 从localStorage中获取token
const token = localStorage.getItem('token');
// 如果token存在,则将其添加到请求头中
if (token) {
config.headers.Authorization = `Bearer ${token}`;
}
return config;
},
error => {
return Promise.reject(error);
}
);
```
在这个示例中,我们使用axios库来发送HTTP请求,并通过请求拦截器来设置每个请求的请求头,以便携带localStorage中存储的token。需要注意的是,这里的token是作为Bearer token的形式添加到请求头中的,这是一种常见的认证方式。
阅读全文