【Ts重构Axios】关于处理请求error三种情况

三种错误描述及基本解决方案

1.错误网络异常错误

当网络出现异常（比如网络不通）的时候，发送请求会触发XMLHTTPRequest对象实例的error事件。于是，我们可以在onerror的事件回调函数中捕获此类错误。

我们在xhr.ts中添加如下代码：

    ...
    request.onerror = function handleError() {
        reject(new Error('Network error'))
    }
    ...

 

2. 处理超时错误

我们可以设置某个请求的超时时间timeout，也就是当请求发送后超过某个时间仍然没有收到相应，则请求自动终止，并触发timeout事件。

请求默认的超时时间是0，即永不超时，所以我们首先需要允许程序可以配置超时时间：

export interface AxiosRequestConfig {
    // ...
    timeout?: number
}

接着在xhr函数中添加如下代码：

const { /**...*/ timeout } = config

if (timeout) {
    request.timeout = timeout
}

request.ontimeout = function handleTimeout() {
    reject(new Error('Timeout error'))