vue登录页面怎么获取token
时间: 2023-09-23 12:03:35 浏览: 54
在Vue登录页面中获取token的具体方式取决于你的后端API是如何设计的。一般来说,在用户完成登录验证后,后端API会返回一个包含token的响应。你可以使用Axios等工具发送POST请求,将用户的登录信息发送给后端API进行验证,然后从响应中解析出token并保存到本地存储(如localStorage)中,以便后续的API请求中使用。
以下是一个示例代码片段:
```javascript
import axios from 'axios';
// 发送登录请求
axios.post('/api/login', {
username: '用户名',
password: '密码'
}).then(response => {
// 从响应中解析出token并保存到本地存储
const token = response.data.token;
localStorage.setItem('token', token);
}).catch(error => {
console.error(error);
});
```
在后续的API请求中,你可以通过设置请求头将token发送给后端API进行验证。以下是一个示例代码片段:
```javascript
import axios from 'axios';
// 从本地存储中获取token
const token = localStorage.getItem('token');
// 设置请求头
axios.defaults.headers.common['Authorization'] = `Bearer ${token}`;
// 发送API请求
axios.get('/api/user').then(response => {
console.log(response.data);
}).catch(error => {
console.error(error);
});
```
需要注意的是,以上示例代码仅供参考,具体实现可能因后端API的设计而有所差异。