加入目前的需求这样的:
左边的菜单链接,点击后通过异步请求返回其HTML代码,然后innerHTML到右面的DIV中,加入切换菜单的速度非常快,最终会导致请求紊乱。
可以加入消息管理机制,下面一个例子,代码没有优化,只提供思路。
?1. [代码][JavaScript]代码
// 在DOMready的时候创建一个消息管理器messageMgr,包含一个队列(Queue),增(Create)、删(Remove)、判断(isAvailable)函数。
//给每个module设置一个Action,此Action必须有init,dispose方法,init方法先Create一个时间戳(Token),压入Queue并返回给Action保持。异步请求的时候携带该Token,在callback函数执行之前判断(isAvailable)此Token是否在Queue中,防止非正常的回调。ppt素材
//只有当该Action被销毁(dispose)的时候删除该Token,然后操作其他的事件卸载(onBind).
var messageMgr = {
__Queue: [],
Create: function(){
var __key = new Date().getMilliseconds();
this.__Queue.push(__key);
return __key;
};
Remove: function (token) {
token && baidu.array.remove(this.__Queue, token);
},
isAvailable:function (token) {
return baidu.array.contains(this.__Queue, token);
}
};
var asyn = function(url, data, opt){
opt = opt || {};
//异步请求对象
var __callBack = function(xhr, responseText){
if(opt.token && !messageMgr.isAvailable(opt.token)) return false;
opt.callback && opt.callback(xhr, responseText);
};http://www.huiyi8.com/ppt/?
baidu.ajax.request(url, {
method: opt.method || "post",
data: data,
onsuccess: __callBack,
timeout: options.timeout || 600000,
onfailure:function () {
alert("网络传输异常。");
}
});
};
var blogCat = function(){
var __token = null;
var __asynRequest = function(){
var __callBack = function(list){
//渲染列表操作
}
var __data = {};
messageMgr.asyn("/remoteHC.php", __data, {
token: __token,
callback : __callBack
});
};
var __init = function(){
//绑定事件其他操作
__token = messageMgr.Create();
};
var __dispose: function(){
//出栈
messageMgr.Remove(__token);
};
return {
init: __init,
dispose: __dispose
}
}();
?
解决多次异步请求紊乱问题 - JavaScript
时间: 2024-10-09 02:55:11
解决多次异步请求紊乱问题 - JavaScript的相关文章
关于异步加载的 javascript 不出现在 chrome 开发者工具的 source 中的解决方法
首先,当你看到这篇文章时,我相信你已经是一个中级甚至是高级的前端开发了. 因为异步加载 javascript 这样的做法,在一些中小型项目几乎是看不到的. 而异步加载 javascript 归根到底,是为了性能优化,防止 JS 加载造成页面阻塞. 会注意到性能,说明你已经不再是一个停留在实现层面的前端开发了,而是一个有着更高追求的人. 在此,向所有有追求的人点赞~~~ 昨天为公司的项目做前端优化,其中一项就是做脚本异步加载. 但是奇怪的是,异步加载的 js 出现在 chrome 开发者工具的 n
解决for循环中异步请求顺序不一致的问题
for循环,再把循环出来的ID再进行二次请求 这就导致一个问题 请求结果返回顺序不一致 原因:异步请求会把回调事件放入微任务事件队列,宏任务执行完毕再执行微任务,具体参考事件队列机制 解决方法: 通过map方法进行循环请求 将异步请求方法封装起来,返回一个promise 这样将会返回一个具有多个promise的数组 通过promise.all()方法把promise包装成一个新的promise实例 1 // 通过Promise把所有的异步请求放进事件队列中 2 3 getInfo(item ,i
[转载]# Ajax异步请求阻塞情况的解决办法
最近使用ExtJs4的mvc模式在开发了在线漫画的后台,因为异步请求比较多,有的回应时间长,有点短.我发现在多次并发的情况下,会造成阻塞的情况.也就是说如果回应时间长的请求还在进行中,短的请求却被挂起. 找了很多资料,最终确定是asp.net session造成的.好像php也存在此类问题. 现象:在一个网站中,当访问一个处理比较耗时的页面(A页面),页面请求还没有返回时,此时再点击访问该网站的其他页面(B页面)会出现B页面很久都没有响应和返回,直到A页面输出返回数据时才开始处理B页面的请求,造
Ajax异步请求阻塞情况的解决办法
最近使用ExtJs4的mvc模式在开发了在线漫画的后台,因为异步请求比较多,有的回应时间长,有点短.我发现在多次并发的情况下,会造成阻塞的情况.也就是说如果回应时间长的请求还在进行中,短的请求却被挂起. 找了很多资料,最终确定是asp.net session造成的.好像php也存在此类问题. 现象:在一个网站中,当访问一个处理比较耗时的页面(A页面),页面请求还没有返回时,此时再点击访问该网站的其他页面(B页面)会出现B页面很久都没有响应和返回,直到A页面输出返回数据时才开始处理B页面的请求,造
javascript 异步请求封装成同步请求
此方法是异步请求封装成同步请求,加上token验证,环境试用微信小程序,可以修改文件中的ajax,进行封装自己的,比如用axios等 成功码采用标准的 200 到 300 和304 ,需要可以自行修改 同步任务接入之后,每个任务会进行token的验证,每个任务之间都是同步请求,包括token /** * 同步流请求 * token验证每个接口 * 柯里化添加同步任务 * resolve返回res,cb * reject 返回res,cb * 通过任务中断测试 * 通过成功失败回调函数测试 * *
Servlet 3.0笔记之异步请求Comet推送iFrame示范
Servlet3规范提出异步请求,绝对是一巨大历史进步.之前各自应用服务器厂商纷纷推出自己的异步请求实现(或者称comet,或者服务器推送支持,或者长连接),诸如Tomcat6中的NIO连接协议支持,Jetty的continuations编程架构,SUN.IBM.BEA等自不用说,商业版的服务器对Comet的支持,自然走在开源应用服务器前面,各自为王,没有一个统一的编程模型,怎一个乱字了得.相关的comet框架也不少,诸如pushlet.DWR.cometd;最近很热HTML5也不甘寂寞,推出W
详解Ajax请求(四)——多个异步请求的执行顺序
首先提出一个问题:点击页面上一个按钮发送两个ajax请求,其中一个请求会不会等待另一个请求执行完毕之后再执行? 答案是:不会,这两个异步请求会同时发送,至于执行的快与慢,要看响应的数据量的大小及后台逻辑的复杂程度. 从异步请求的执行原理来看,我们知道当一个异步请求发送时,浏览器不会处于锁死.等待的状态,从一个异步请求发送到获取响应结果的期间,浏览器还可以进行其它的操作.这就意味着多个异步请求的执行时并行的. 下面我们还是从一个例子来看一下这个问题. 要求:ajax1从后台请求下拉列表的数据,aj
MVC&;WebFomr对照学习:ajax异步请求
写在前面:由于工作需要,本人刚接触asp.net mvc,虽然webform的项目干过几个.但是也不是很精通.抛开asp.net webform和asp.net mvc的各自优劣和诸多差异先不说.我认为虽然mvc和webform有诸多不同,但是也只是为了达到相同的目的而在各自的机制下采取了不同的手段而已.更何况它们都是基于asp.net框架的.因此在解决mvc开发过程中的问题时,我很容易联想到在webform下同样的问题是如何解决的.以此来作为对照.我姑且把这种方法叫做迁移学习法吧.我以"小孩之
Springmvc中 同步/异步请求参数的传递以及数据的返回
注意: 这里的返回就是返回到jsp页面 **** controller接收前台数据的方式,以及将处理后的model 传向前台***** 1.前台传递数据的接受:传的属性名和javabean的属性相同 (1).使用基本类型,或引用类型进行接受: @RequestMapping(value="/select") PublicString select(String name,int age,Model model){ // 这样这里的name,age 就是我们前台传递的参数,也是我们Ja