多个ajax按顺序请求

有时候在业务中数据的请求是有先后顺序的,但是默认的ajax都是异步执行的,实现同步请求的话只需要设置 async: false,

方法一:

示例如下:


为了验证顺序,我们需要在后端做延迟响应处理。如下:

	public function test1(){
        sleep(10);
        return $this->jsonSucess([1]);
    }

    public function test2(){
        sleep(2);
        return $this->jsonSucess([2]);
    }

    public function test3(){
        sleep(5);
        return $this->jsonSucess([3]);
    }

打印的结果为:

多个ajax按顺序请求_第1张图片

可见是严格按照顺序来的。

方法二:
使用jquery 的 $.when()方法
要求:jQuery > 1.5.0

// ajax 其他参数
var options = {type: 'GET', data: {name: 'rao'}};

$.when(
    $.ajax(url1, options),
    $.ajax(url2, options),
    $.ajax(url3, options),
).done(function(return1, return2, return3){
    console.log(return1);// url1 的返回
    console.log(return2);// url2 的返回
    console.log(return3);// url3 的返回
}).fail(function(obj, statusString, errorMsg){
	console.log(obj);// obj
    console.log(statusString);// error
    console.log(errorMsg);// Not Found
});

后端代码,依然是上面的
返回结果也是按照顺序的。

成功则返回:
在这里插入图片描述
多个ajax按顺序请求_第2张图片
失败则返回:
把 test2() 方法注释掉,使其无法被访问到。
这样就是,第一个请求通过,第二个请求失败,第三个请求通过;是的,第三个请求还是会被发出去。
在这里插入图片描述
打印的信息
在这里插入图片描述
既然所有的请求都会被发出去,那么如果有多个请求失败,fail 回调的信息就是最后一个失败的信息了。

你可能感兴趣的:(WEB前端)