常常
一系列 的 Ajax 请求之间
要求
有一定的次序要求,依赖关系,以及为了防止突发网络故障需要一定的自动重练功能。
(写过一个增强
Extjs
自动重连的功能
)
例如:
1.b请求必须要在a请求返回后执行。
2.b请求要求必须a操作成功后再执行。
3.a 请求失败了就重练3次,最后仍然失败,则b请求取消
那么传统在每个callback中分别判断写得很死就很那重用了,实现一个队列来集中管理吧。
<script>
function AjaxQueue(){
this.restore();
};
//重用对象,清除队列
AjaxQueue.prototype.restore = function(){
//函数队列
this._queue=[];
//队列当前函数重试次数
this._retry=0;
//是否当前失败
this._stopped=false;
},
//没有停止就添加执行
AjaxQueue.prototype.addToQueue = function(func){
if(this._stopped) return;
this._queue.push(func);
if(this._queue.length==1)
this._start();
};
AjaxQueue.prototype.retry = function(maxRetry){
//失败
if(this._retry<maxRetry){
this._retry++;
this._queue[0]();
}
else {
//超过最大重试次数,清空队列,其他等待处理的ajax 作废(依赖于上一个操作)
this.stop();
}
};
AjaxQueue.prototype.next = function(){
//当前处理函数弹出,处理下一个
this._queue.shift();
this._start();
},
//
AjaxQueue.prototype._start = function(){
if(this._queue.length==0) {
//全部处理完了
return;
}
this._retry=0;
this._queue[0]();
};
AjaxQueue.prototype.stop = function(){
this._queue=[];
this._stopped=true;
};
var mger = new AjaxQueue();
var maxRetry=3;
(function yy(){
var z=prompt("input");
mger.addToQueue(function (){
/*
Ajax.request({
success:function(){
//成功了,通知队列执行下一个
mger.next();
},
err:function(){
//失败了,通知队列重试当前函数
mger.retry(maxRetry);
}
});
*/
alert(z);
//通知队列执行下一个
//mger.next();
//重试,最终导致取消
mger.retry(maxRetry);
});
mger.addToQueue(function (){
alert(z+"_1");
mger.next();
});
})();
</script>
分享到:
相关推荐
AJAX请求队列实现主要讲解了如何管理多个异步AJAX请求,确保它们能够按照一定的顺序执行,以防止请求因执行时机冲突而被取消或丢失。在Web应用中,用户可能会在短时间内发起多个请求,这些请求可能是异步的。如果不...
- 使用`Ext.Ajax.request`方法发起Ajax请求,该方法接受一系列参数,如URL、方法(GET或POST)、数据、回调函数等。 2. **请求配置**: - `url`: 发送请求的目标地址。 - `method`: HTTP方法,通常为GET或POST。...
ajaxProxy is an ajax request sending proxy, which supports chain order request and blocking request ajaxProxy是一个异步请求的代码发送器,提供一种可读性更好的接口来实现异步请求的流程控制,并且提供了...
用户输入消息后,消息会通过Ajax发送到服务器,同时页面会自动更新以显示新的聊天记录。尽管这个例子没有使用数据库,但在实际应用中,通常会需要持久化存储聊天记录,以便用户刷新页面后还能看到之前的聊天内容。
Ajax 发送请求时,get 请求的参数必须是 null 或 xhr.send(),否则可能会自动转换成 post 请求方式。可以通过 request.getMethod() 方法获取请求的方式。 实例代码: function getAjax(){ //获取 xhr 对象 var ...
var ajaxRequest = {}; $.ajaxQueue = function (settings) { // 省略部分代码... }; })(jQuery); ``` 通过队列,你可以确保请求按照添加到队列的顺序依次执行,而不会阻塞浏览器。 3. **取消请求**: 当有...
以上三种方式都实现了基本的AJAX功能,但jQuery和Prototype提供了更多的抽象和便利功能,如错误处理、数据序列化、异步请求队列等。选择哪种方式取决于项目需求和个人喜好。如果你需要更高级的功能或者更好的浏览器...
- `YAHOO.util.Connect.asyncRequest`: 这是发起Ajax请求的主要函数,接受四个参数:请求类型(GET或POST)、请求URL、回调函数对象(包含success、failure和complete回调)和请求配置(如额外的HTTP头、POST数据等...
题目中提到可以控制同时上传文件的个数,这通常通过设置多个 Ajax 请求实例或者使用队列管理来实现。例如,可以设定一个最大并发数,超出数量的文件会被放入队列等待上传。 6. **错误处理**: 为了提供良好的用户...
【Laravel开发-salao-gerencial-ajax】项目是一个基于Laravel框架的管理应用程序,用于管理沙龙业务。帕科特·拉雷维尔可能是这个项目的开发者或贡献者。在这个项目中,他利用了Laravel的强大功能,结合Ajax技术,...
JavaScript 部分会配置 Uploadify 的参数,如上传的 SWF 文件路径、处理文件的脚本地址、取消按钮图片、目标文件夹、队列 ID、是否自动上传以及是否支持多文件上传等。 5. **编写上传处理器代码**:在 `...
var request = $.get("ajax.aspx", {id: 1}, function(data){ if(data.length == 0) return true; // 一些操作 }); request.abort(); // 立即停止请求 ``` 示例三:防止重复发送请求 ```javascript var request; ...
在本文中,我们将深入探讨如何使用AJAX与Laravel框架结合来创建一个完整的CRUD(创建、读取、更新和删除)应用程序。Laravel是一个基于PHP的优雅且强大的Web开发框架,而AJAX则允许我们在不刷新整个页面的情况下实现...
通过学习这些例子,你可以更全面地了解 Puppeteer 在实际项目中的应用,比如登录操作、Ajax 请求处理、动态内容的等待、错误处理等。 总的来说,Puppeteer 结合 headless Chrome 提供了一种高效、灵活的方式来实现...
在服务器端,还可以考虑使用队列处理大量文件上传,以防止服务器负载过高。 总之,ASP.NET(C#)实现一次性上传多张图片主要涉及前端的文件选择、Ajax提交,以及后端的文件接收、处理和存储。理解这些关键步骤,...
3. **初始化Uploadify**:使用JavaScript代码初始化Uploadify,设置上传参数,例如`swf`(Flash对象的路径)、`uploader`(服务器端处理文件的URL)、`queueID`(进度队列容器ID)等。 4. **服务器端处理**:在ASP...
* 熟悉使用事件队列和自动登录机制 * 了解如何进行代码优化和性能优化 七、其他 * 了解如何编写简洁、可读和可维护的代码 * 熟悉使用代码编码风格guide和best practice * 了解如何对项目进行性能优化和问题解决
1. **Ext.Ajax对象**:它是ExtJS中的核心Ajax接口,提供了发送Ajax请求的所有方法,如`request()`,`getJSON()`,`getScript()`等。 2. **配置选项**:在使用Ajax请求时,你可以通过配置对象设置多种参数,如URL、...
在描述中提到的"带自动压缩图片功能",这意味着在上传过程中,图片会被预先压缩以减少上传的数据量和服务器存储空间。这通常通过JavaScript库如`imgAreaSelect`或`canvas` API来实现。在选择图片文件后,前端可以先...
Uploadify通过AJAX请求将文件数据发送到服务器,这样可以在不刷新页面的情况下完成文件上传,提供实时的进度反馈。 在ASP.NET中集成Uploadify,你需要确保以下几个关键步骤: 1. **引入依赖**:首先在项目中添加...