若依前端框架通常使用axios库来发送HTTP请求,可以通过在axios的拦截器中设置请求头来将返回的token放到前端请求的header中。
具体步骤如下:
1. 在axios的拦截器中设置请求头
```javascript
import axios from 'axios';
// 设置请求拦截器,在每个请求发送前添加请求头
axios.interceptors.request.use(
config => {
// 获取本地存储的token
const token = localStorage.getItem('token');
if (token) {
// 添加Authorization请求头
config.headers.Authorization = `Bearer ${token}`;
}
return config;
},
error => {
return Promise.reject(error);
}
);
export default axios;
```
2. 在登录成功后将返回的token保存到本地存储中
```javascript
import axios from '@/utils/request';
export function login(data) {
return axios.post('/login', data).then(res => {
// 将返回的token保存到本地存储中
localStorage.setItem('token', res.data.token);
return res.data;
});
}
```
这样,在每次发送请求时,axios会自动从本地存储中获取token,并将其添加到请求头中。