Axios拦截器
Axios提供了拦截器的接口,让我们能够全局处理请求和响应。Axios拦截器会在Promise的then和catch调用前拦截到。
请求拦截示例
axios.interceptors.request.use(function (config) { // 在发起请求请做一些业务处理 return config; }, function (error) { // 对请求失败做处理 return Promise.reject(error); });
响应拦截示例
axios.interceptors.response.use(function (response) { // 对响应数据做处理 return response; }, function (error) { // 对响应错误做处理 return Promise.reject(error); });
Axios实现请求重试
在某些情况(如请求超时),我们可能会希望能够重新发起请求。这时可以在响应拦截器做下处理,对请求发起重试。
请求重试需要考虑三个因素:
- 重试条件
- 重试次数
- 重试时延
配置
axios.defaults.retry = 1; //重试次数 axios.defaults.retryDelay = 1000;//重试延时 axios.defaults.shouldRetry = (error) => true;//重试条件,默认只要是错误都需要重试
响应拦截重试
axios.interceptors.response.use(undefined, (err) => { var config = err.config; // 判断是否配置了重试 if(!config || !config.retry) return Promise.reject(err); if(!config.shouldRetry || typeof config.shouldRetry != ‘function‘) { return Promise.reject(err); } //判断是否满足重试条件 if(!config.shouldRetry(err)) { return Promise.reject(err); } // 设置重置次数,默认为0 config.__retryCount = config.__retryCount || 0; // 判断是否超过了重试次数 if(config.__retryCount >= config.retry) { return Promise.reject(err); } //重试次数自增 config.__retryCount += 1; //延时处理 var backoff = new Promise(function(resolve) { setTimeout(function() { resolve(); }, config.retryDelay || 1); }); //重新发起axios请求 return backoff.then(function() { return axios(config); }); });
参考:https://github.com/axios/axios/issues/164#issuecomment-327837467
原文地址:https://www.cnblogs.com/cina33blogs/p/10942131.html
时间: 2024-10-04 13:56:14