有的时候同一个页面被可能同时产生多个ajax请求,为了用户体验,最好是发送并行请求,这就产生了并发问题,应该如何处理?
并行改串行@H_404_9@
@H_403_10@这种方法是最简单的了,就是在一个请求执行完后在执行另一个请求。代码如下:
1)在回调中执行下一请求
functionasync1(){
//dosth...
async2();
}
functionasync2(){
//dosth...
}
async1();
2)将 ajax 改为同步,按顺序执行
varurl1,url2;
$.ajax({
url:url1,async:false
});
$.ajax({
url:url2,async:false
});
使用计数器@H_404_9@
@H_403_10@就是使用一个标志位标记请求是否已经完成
1)循环非阻塞
@H_403_10@这种方法会影响性能,尽量少用:
varcnt=0;
functionasync1(){
//dosth...
cnt++;
}
functionasync2(){
//dosth...
cnt++;
}
async1();
async2();
varinterval=setInterval(function(){
if(2===cnt){
console.log('已执行完成');
clearInterval(interval)
}
},0);
2) 回调计数
varcnt=0;
functionasync1(){
//dosth...
callback();
}
functionasync2(){
//dosth...
callback();
}
functioncallback(){
cnt++;
if(2==cnt)
console.log('都已执行完毕');
}
async1();
async2();
第三方框架实现@H_404_9@
@H_403_10@若使用第三方框架实现,则要看第三方的相关文档:
1)jquery
vard1=$.Deferred();
vard2=$.Deferred();
functionasync1(){
d1.resolve("Fish");
}
functionasync2(){
d2.resolve("Pizza");
}
async1();
async2();
$.when(d1,d2).done(function(v1,v2){
console.log(v1+v2+'已完成');
});
2)axios
//下面是关于同时发起多个请求时的处理
axios.all([get1(),get2()])
.then(axios.spread(function(res1,res2){
//只有两个请求都完成才会成功,否则会被catch捕获
}));
1)jquery
vard1=$.Deferred(); vard2=$.Deferred(); functionasync1(){ d1.resolve("Fish"); } functionasync2(){ d2.resolve("Pizza"); } async1(); async2(); $.when(d1,d2).done(function(v1,v2){ console.log(v1+v2+'已完成'); });
2)axios
//下面是关于同时发起多个请求时的处理 axios.all([get1(),get2()]) .then(axios.spread(function(res1,res2){ //只有两个请求都完成才会成功,否则会被catch捕获 }));
还有很多框架都可以,比如Angular的$wacth等等