超时重试ajax

Posted 2020-11-07 lay2017

我们使用jquery的ajax，超时重试可以采用两种方式，一种是配置ajax的timeout的参数，另一种就是以setTimeout定时器的方式实现：

1）timeout参数配置方式

var xhr = $.ajax({
            type:‘get‘,
            url: ‘http://localhost:8080/user‘,
            data:{
                id: 1
            },
            timeout: 5000,          // 设置超时时间5秒
            dataType: "json",
            success: function(res) {
                if(res.success) {
                    // 业务处理
                }
            },
            error: function(err) {
                if(err.statusText == ‘timeout‘) {
                    xhr.abort();    // 超时中断请求
                    // 这里可以重新执行请求
                }
            }
        }) 

 

2）setTimeout定时器方式

function retryCallback(){
    var xhr;

    // 设置5秒超时定时器
    var timer = setTimeout(function(){
        // 中断上一个请求
        xhr.abort();
        // 超时重试
        retryCallback();
    }, 5000)

    xhr = $.ajax({
        type:‘get‘,
        url: ‘http://localhost:8080/user‘,
        data:{
            id: 1
        },
        dataType: "json",
        success: function(res) {
            // 未超时则清除定时器
            clearTimeout(timer)
        }
    }) 
}

retryCallback()