支持超时的fetch方法

389 阅读1分钟

fetch本身是不能abort,也是不支持超时的。

基础

Promise.race() Promise.race()是将多个 Promise 实例,包装成一个新的 Promise 实例。

只要其中一个promise的状态确认(包括resolve或reject),则promise.race就会执行后续代码。

实现

function _fetch(url, option, timeout) {
    var abort_fn = null;
    
    var abort_promise = new Promise(function(resolve, reject) {
        abort_fn = function() {
            reject('abort promise');
        };
    });
    
    var abortable_promise = Promise.race([
        fetch(url, option),
        abort_promise
    ]);
    
    setTimeout(function() {
        abort_fn();
    }, timeout);

    return abortable_promise;
}

内部定义一个abort_promise,当超时的时候立即reject,_fetch 这个promise就直接跳到reject回调中执行了。