使用JQuery实现同步请求

使用JQuery实现同步请求

背景

现在工作的时候,绝大部分场景使用的是异步请求,可以使用ajax fetch axios等技术实现;

其中最常用的是jquery的ajax方法;

$.ajax({
    url: "XXX",//请求路径
    data: { param1: jsonObj1, params2: str2... },
    type: "POST",//GET
    //dataType: "JSON",//需要返回JSON对象(如果Ajax返回的是手动拼接的JSON字符串,需要Key,Value都有引号)
    success: function(resp) {
        //处理 resp.responseText;
    },
    error: function(a, b, c) {
        //a,b,c三个参数,具体请参考JQuery API
    }
})

但是在某些场景下,我们需要同步请求,比如我在构建Grid控件的时候,动态列的情况;

一旦Grid对象创建完成,渲染到浏览器的时候,如果没有配置列,或者列配置选项错误,那么这个页面会提示错误,即Grid没有成功渲染;

因此这里我们需要在new Grid之前.首先获取动态列数据,进行列模型的构建;

 

我们这样子做:给出一个简单例子

var cmObjStr = eval("(" + $.ajax({
			url: "XXX",
			async: false,//关键是这个参数 是否异步请求=>false:使用同步请求
			type: "POST",
			data: {
				params1: value1
			}
		}).responseText + ")");

这里返回的是列模型所需要的列信息,还需要手动创建列模型对象;

总结一下:所有支持异步请求的方法,需要看相关的文档API,看是否存在async这个参数;设置async为false为同步请求,只有请求返回了,浏览器线程才会执行下一行的JS;