vue axios对个别接口不需要全局拦截怎么处理_从0到1使用VUE-CLI3开发实战(四): Axios封装...
时间: 2024-03-22 19:37:42 浏览: 236
vue 中关于 axios 网络请求的封装:包括请求拦截等内容,附有详细的代码说明!!!
如果你在Vue项目中使用Axios进行接口请求,并且需要对个别接口进行特殊处理,可以在封装Axios的时候进行处理。
一种常见的做法是,在封装Axios的时候,给每个请求都添加一个标识符(比如在请求参数中添加一个特殊的字段),然后在请求拦截器中判断是否需要进行特殊处理,如果需要,就不进行全局拦截。
以下是一个简单的示例:
```javascript
// 封装Axios
import axios from 'axios'
const instance = axios.create({
baseURL: 'http://api.example.com',
timeout: 5000
})
// 在请求拦截器中判断是否需要全局拦截
instance.interceptors.request.use(config => {
// 如果需要全局拦截,就添加token等信息
if (config.headers.needToken) {
const token = localStorage.getItem('token')
if (token) {
config.headers.Authorization = 'Bearer ' + token
}
}
return config
}, error => {
return Promise.reject(error)
})
export default instance
```
在上面的代码中,我们给每个请求添加了一个特殊的请求头字段 `needToken`,如果需要进行全局拦截,就在请求拦截器中添加token等信息。
如果某个接口不需要进行全局拦截,就不需要添加 `needToken` 字段,这样就不会被全局拦截器拦截。
```javascript
// 发送请求
import axios from './axios'
// 不需要全局拦截的接口
axios.get('/user', {
params: {
id: 123
}
}).then(res => {
console.log(res)
})
// 需要全局拦截的接口
axios.get('/user', {
params: {
id: 123
},
headers: {
needToken: true
}
}).then(res => {
console.log(res)
})
```
在上面的代码中,第一个请求不需要进行全局拦截,因此不需要添加 `needToken` 字段;第二个请求需要进行全局拦截,因此添加了 `needToken` 字段。这样就可以对个别接口进行特殊处理了。
阅读全文