vue3 后端说是 接口使用 json Web Token +REST 前端接口应该如何配置
时间: 2023-06-25 11:07:50 浏览: 176
前端在使用 JSON Web Token(JWT)+ REST 接口时,需要在发送请求时在请求头中添加 JWT 的 Token。一般来说,可以在请求拦截器中进行配置。以下是一个示例代码:
```javascript
import axios from 'axios'
// 添加请求拦截器
axios.interceptors.request.use(
config => {
// 获取本地存储的 token
const token = localStorage.getItem('token')
// 在请求头中添加 Authorization 字段,并赋值为 token
if (token) {
config.headers.Authorization = `Bearer ${token}`
}
return config
},
error => {
return Promise.reject(error)
}
)
```
在上述代码中,我们通过请求拦截器获取本地存储的 Token,并将其添加到请求头的 Authorization 字段中。需要注意的是,JWT 的 Token 需要以 Bearer 开头,因此我们在添加时需要注意格式。
接下来,在发送请求时,我们只需要按照平常的方式调用 axios 即可,例如:
```javascript
axios.get('/api/user')
```
这样就会在请求头中添加 JWT 的 Token,从而进行身份验证。当然,在登录成功后,需要将服务器返回的 Token 存储到本地,以便在后续的请求中使用。
阅读全文