实例化
上一篇说了基本用法,实际使用中并不会直接调用,而是实例化一个对象
并配置好基本参数,然后所有请求走实例化对象1
2
3
4
5
6
7
8
9
10
11
12
13
14const service = axios.create({
baseURL: '/api1.0/'
timeout: 5000 // request timeout
})
function list(query) {
return service({
url: 'getList',
method: 'post',
data: query
})
}
// 调用示例
list(query).then()
配置参数较多,参照 Axios官网
拦截器
axios支持拦截器,可以在请求和返回时进行拦截处理1
2axios.interceptors.request.use(config => config, error => error);
axios.interceptors.response.use(response => response, error => error);
拦截器同样是符合Promise标准
一般用的较多的是在请求时加入 token
,返回数据时进行数据过滤和权限判断
1 | service.interceptors.request.use(config => { |
错误处理
Axios默认把 200 <= status < 300
归为 resolve,其它则为 reject
可以修改参数中 validateStatus
来进行修改1
2
3validateStatus: function (status) {
return status >= 200 && status < 300; // default
},
reject 时返回error对象,可以从 error.response 获取http对象
如果是本地发生的异常,还没到请求阶段,则没有 response 对象
取消请求
调用定时器 setTimeout()
会返回一个整形token,然后用 clearTimeout()
传入返回的token即可清除定时器
axios 的取消也是一样道理,只是不是在请求时返回token,而是把token附加到请求参数1
2const source = axios.CancelToken.source()
console.log('cancelToken', source)
初始化一个 CancelToken
对象
里面有个 cancel()
方法和名为 token
的 Promise对象
1 | // 请求时传入 cancelToken |
此时 catch
会打印 some request is cancel