ajax请求多个url解决办法

以下四种方法是我找的,我也进行实践过。

测试中有四个请求接口,原本需要13S,用了第三种方法缩减到7S,但是仍不能达到2S以内。

所以仅供参考,待我找到能缩减到2S以内的办法。如果有读者有解决办法,可以写下来,我感激不尽!

还有一个方法就是把异步变为同步,速度会提升很快

一、ajax嵌套

ajax嵌套ajax。跟疯狂for循环一样,这种方式只能串行发起ajax请求。弊端也很明显,随着ajax请求次数增加,嵌套层数也逐渐加深,代码很难维护。而且,效率也不高。

function getData(){
$.ajax({url: "/something",type:'GET',dataType:'json',success: function(data1){
$.ajax({url: "/something",type:'GET',dataType:'json',success: function(data2){
$.ajax({url: "/something",type:'GET',dataType:'json',success: function(data3){
console.log(data1);
console.log(data2);
console.log(data3);
}
})
}
})
}
})
}

二、设置一个全局变量

所有ajax接口都可以同时发起请求,而且代码分离,在每个ajax的callback都统一回调一个函数,由这个函数来判断全局变量是否达到条件。

function getData(){
var flag = 0,
_data1,
_data2,
_data3;
$.ajax({url: "/something",type:'GET',dataType:'json',success: function(data1){
flag++;
_data1 = data1;
if(flag == 3){
//do something
}
}
}) $.ajax({url: "/something",type:'GET',dataType:'json',success: function(data2){
flag++;
_data2 = data2; if(flag == 3){
//do something
}
}
}) $.ajax({url: "/something",type:'GET',dataType:'json',success: function(data3){
flag++;
_data3 = data3;
if(flag == 3){
//do something
}
}
})
}

三、使用jquery的$.when()方法,就是promise模式,让异步请求方式变为链式调用,以及能做到并行请求

如果所有请求成功返回,then方法里第一个回调执行,如果任意一个请求失败,则执行第二个回调。

function getData(){
var fun1 = $.ajax({url: "/something",type:'GET',dataType:'json'}),
fun2 = $.ajax({url: "/something",type:'GET',dataType:'json'}),
fun3 = $.ajax({url: "/something",type:'GET',dataType:'json'});
$.when(fun1,fun2,fun3).then(function(data1,data2,data3){
//成功回调,所有请求正确返回时调用
console.log(data1);
console.log(data2);
console.log(data3);
},function(){
//失败回调,任意一个请求失败时返回
console.log('error');
})
}

四、后端改接口,把请求合并成一个

作者:南知唔知
链接:https://www.jianshu.com/p/96785bbe5b90
来源:简书
简书著作权归作者所有,任何形式的转载都请联系作者获得授权并注明出处。

 
 
 

66.ajax--ajax请求多个url解决办法的更多相关文章

  1. Ajax异步请求阻塞情况的解决办法(asp.net MVC Session锁的问题)

    讨论今天这个问题之前,我们先来看下浏览器公布的资源并发数限制个数,如下图 不难看出,目前主流浏览器支持都是最多6个并发 需要注意的是,浏览器的并发请求数目限制是针对同一域名的 意即,同一时间针对同一域 ...

  2. [转载]# Ajax异步请求阻塞情况的解决办法

    最近使用ExtJs4的mvc模式在开发了在线漫画的后台,因为异步请求比较多,有的回应时间长,有点短.我发现在多次并发的情况下,会造成阻塞的情况.也就是说如果回应时间长的请求还在进行中,短的请求却被挂起 ...

  3. Ajax异步请求阻塞情况的解决办法

    最近使用ExtJs4的mvc模式在开发了在线漫画的后台,因为异步请求比较多,有的回应时间长,有点短.我发现在多次并发的情况下,会造成阻塞的情况.也就是说如果回应时间长的请求还在进行中,短的请求却被挂起 ...

  4. Ajax回退刷新页面问题的解决办法

    在脚本之家看到一篇文章,觉得以后可能会用上,但是竟然不能收藏,所以只能将其转到博客园. 以下是原文地址: http://www.jb51.net/article/87856.htm   这篇文章主要介 ...

  5. Windows7 提示“无法访问 xxxx,您没有权限访问,请与网络管理员联系请求访问权限”的解决办法

    Windows7 客户端访问提示"无法访问 xxxx,您没有权限访问,请与网络管理员联系请求访问权限"的解决办法

  6. jquery获取不了ajax动态添加的内容的解决办法

    在HTML页面的一个button <div class="ajaxClick"> <button>内容</button> </div> ...

  7. [AJAX]ajax在兼容模式下失效解决办法

    使用jQuery,用ajax实现局部刷新功能,在火狐,360急速浏览器高速模式下,ie8,9都能正常运行,但切换到兼容模式下无效,解决办法有两种关闭浏览器兼容性视图,二是引入json2.js文件 这里 ...

  8. IE浏览器因缓存问题未能成功向后端发送请求的几个解决办法

    这段时间前后端联调,解决IE.谷歌等浏览器兼容问题,真是让人有点焦头烂额,各种奇葩问题层出不穷,旧问题刚去,新麻烦又来,其中尤其以IE浏览器缓存的问题最多.有若干次都是因为这个缓存,使得前端的请求没有 ...

  9. svn: is already a working copy for a different url 解决办法

    svnX    svn: E155000: '/Users/mac/Desktop/SHiosProject/SVNmangerfiles/wuye'   is already a working c ...

随机推荐

  1. [转]IntelliJ IDEA 使用spring-boot-devtools热部署无效解决办法

    来源:https://www.jianshu.com/p/4d8aa6dfd103 相信大部分使用IntelliJ IDEA的同学都会遇到这个问题,即使项目使用了spring-boot-devtool ...

  2. Python的类及单例实现

    一.使用@property @property 的作用 将一个get方法变成一个属性 class

  3. 这里主要展示在Win7下怎么用IIS发布局域网站

    首先对IIS做一个简要的介绍: IIS(InternetInformationServices)互联网信息服务的简称.本质是一种Web(网页)服务组件,其中包含Web.FTP和SMTP三大服务器,分别 ...

  4. MySql思维导图

  5. You must configure either the server or JDBC driver (via the serverTimezone configuration property

    使用JDBC连接MySql时出现:The server time zone value '�й���׼ʱ��' is unrecognized or represents more than one ...

  6. MongDB 数据结构

    Object  ID :Documents 自生成的 _id String: 字符串,必须是utf-8 Boolean:布尔值,true 或者false (这里有坑哦~在我们大Python中 True ...

  7. day13_DOM

    一,document可以获得HTML页面全部内容, 1.①document.getElementById:获取全部id标签,②document.getElementById("i1" ...

  8. 问题10:获取当前页面宽度JS

    var mleft=document.getElementById("mleft"); var h = document.documentElement.clientHeight; ...

  9. 动态规划-数位DPwindy

    https://vjudge.net/contest/297216?tdsourcetag=s_pctim_aiomsg#problem/L #include<bits/stdc++.h> ...

  10. puppeteer 拦截页面请求

    原文链接 https://www.cnblogs.com/ajanuw/p/10324269.html Request Response page.setRequestInterception(tru ...