@dpdfe/axios
v1.0.3
Published
- 支持配置策略同一个请求,最多发送一次,如果发送多次,自动取消上次请求 - 支持配置策略同一个请求,最多发送一次,触发多次,不发送本次请求 - 提供取消页面所有请求的方法
Downloads
1
Keywords
Readme
Features
- 支持配置策略同一个请求,最多发送一次,如果发送多次,自动取消上次请求
- 支持配置策略同一个请求,最多发送一次,触发多次,不发送本次请求
- 提供取消页面所有请求的方法
安装
- 使用 npm:
npm i --save @dpdfe/axios
- 引入
import axios from '@dpdfe/axios'
使用方法
基于 axios 进行封装,可以像使用 axios 一样使用@dpdfe/axios
- 支持配置策略同一个请求,最多发送一次,如果发送多次,自动取消上次请求
- 配置全局 axios 策略
const instance = axios.create({
baseURL: 'http://localhost:3000/',
timeout: 1000000,
strategy: AjaxStrategy.CANCEL_LAST_AT_MOST_ONCE, // 多个重复请求发送,自动取消先发送的请求
});
- 针对单个请求配置 axios 策略
instance.get('/', {strategy: AjaxStrategy.CANCEL_LAST_AT_MOST_ONCE})
- 支持配置策略同一个请求,最多发送一次,触发多次,不发送本次请求
- 配置全局 axios 策略
const instance = axios.create({
baseURL: 'http://localhost:3000/',
timeout: 1000000,
strategy: AjaxStrategy.CANCEL_CURRENT_AT_MOST_ONCE, // 多个重复请求发送,仅发送第一个请求,后面重复的被拦截不发送
});
- 针对单个请求配置 axios 策略
instance.get('/', {strategy: AjaxStrategy.CANCEL_CURRENT_AT_MOST_ONCE})
- 路由变化时,可以取消上一个页面的请求,react 中使用方法
<Route
path={route.path}
render={(props) => {
instance.cancelReqs('get');
return <route.component {...props} routes={route.routes} />;
}}
/>
注意事项
由于重复请求或调用 cancelReqs 方法而取消的请求,会抛出异常,可以根据实际场景进行处理,axios.isCancel 方法来判断是由手动取消引发的异常。如:
instance?.interceptors.response.use(
function (response) {
return response;
},
function (error) {
if (axios.isCancel(error)) {
// 手动取消引发的异常,进行处理
return new AjaxCancelError('手动取消了请求');
}
return Promise.reject(error);
},
);