记录一下在项目中遇到的一个问题和解决方法。
问题场景:频繁连续地通过jsonp跨域获取数据,而且后台设置了固定的回调函数名称时,导致错误Uncaught TypeError: jsonp1 is not a function。
原因分析:频繁触发jsonp请求会导致多个请求并行,返回结果被覆盖。详细原因可见连续发起jsonp请求失败。
解决方案:通过一个flag来记录当前是否有请求正在执行,如果有则将后发起的请求参数存储到数组中,直到当前请求完成后再重新发起,相当于将异步调用变成了同步。BTW,最好的方法就是不要让后台将回调函数名称固定啊啊啊啊啊QAQ
var doing = false; // 记录当前是否有请求尚未结束
var waitingArr = []; // 当有请求尚未结束而有新请求到达的时候,先暂时存在数组里
var doSomething = function(arg1, arg2) {
if(!doing) {
doing = true;
jQuery.ajax({
url: '...',
dataType: "jsonp",
jsonp: "callback",
jsonpCallback: "jsonp1",
success: function(data) {
...
},
complete: function() {
doing = false;
if(waitingArr.length > 0) {
doSomething(waitingArr[0]["arg1"], waitingArr[0]["arg2"]);
waitingArr.shift();
}
}
});
} else {
waitingArr.push({"arg1":arg1, "arg2":arg2});
}
}