AJAX中怎么实现请求队列

AJAX中怎么实现请求队列,相信很多没有经验的人对此束手无策,为此本文总结了问题出现的原因和解决方法,通过这篇文章希望你能解决这个问题。

成都创新互联是一家集网站建设,大东企业网站建设,大东品牌网站建设,网站定制,大东网站建设报价,网络营销,网络优化,大东网站推广为一体的创新建站企业,帮助传统企业提升企业形象加强企业竞争力。可充分满足这一群体相比中小企业更为丰富、高端、多元的互联网需求。同时我们时刻保持专业、时尚、前沿,时刻以成就客户成长自我,坚持不断学习、思考、沉淀、净化自己,让我们为更多的企业打造出实用型网站。

AJAX队列很简单,创建一个数组存储请求队列,数组中每一项又是一个请求参数数组,当用户执行请求时,不是直接执行AJAX,首先将参数作为一个数组作为项再存入队列,检查队列中是否存在多个请求,如果没有,直接执行当前队列中这唯一的一项,如果有则不执行(因为有其他项,说明队列还在执行中,不必着急,其他项执行完了会轮到这一项的),AJAX执行完成后就删除当前执行的队列项,然后再检查数组还有没有请求,有就继续执行到所有请求都完成为止,以下是我构建的一个队列,AJAX部分是之前封装的。

//Ajax Function
var reqObj; //Creat Null Instence
var RequestArray = new Array();
//var whichRequest;
//加入请求队列
function AddRequestArray(url,isAsy,method,parStr,callBackFun)
{
    var ArgItem = new Array();
    ArgItem[0]=url;
    ArgItem[1]=isAsy;
    ArgItem[2]=method;
    ArgItem[3]=parStr;
    ArgItem[4]=callBackFun;
    RequestArray.push(ArgItem);   //将当前请求添加到队列末尾
    if(RequestArray.length==1) //如果请求队列里只有当前请求立即要求执行队列,如果有其他请求,那么就不要求执行队列
    {
      ExeRequestArray();
    }
}

//执行队列里的顺序第一个的请求
function ExeRequestArray()
{
  if( RequestArray.length>0) //如果队列里有请求执行 AJAX请求
  {
    var ArgItem = RequestArray[0];  DoRequest(ArgItem[0],ArgItem[1],ArgItem[2],ArgItem[3],ArgItem[4]);
  }
}
//Run Ajax (string urladdress,bool IsAsy,string method,string parameters,string whichRequest)
function DoRequest(url,isAsy,method,parStr,callBackFun) 
{
  reqObj = false;
  //whichRequest = whichReq;
  if (window.XMLHttpRequest) //compatible Mozilla, Safari,...
  {
    reqObj = new XMLHttpRequest();       //Creat XMLHttpRequest Instance
    if (reqObj.overrideMimeType)        //if Mime Type is false ,then set MimeType 'text/xml'
    {
      reqObj.overrideMimeType('text/xml');
    }
  }
  else if (window.ActiveXObject) //compatible IE
  {
    try
    {
      reqObj = new ActiveXObject("Msxml2.XMLHTTP"); //Creat XMLHttpRequest Instance
    }
    catch (e)
    {
      try
      {
        reqObj = new ActiveXObject("Microsoft.XMLHTTP"); //Creat XMLHttpRequest Instance
      }
      catch (e)
      {}
    }
  }

  //if reqObj is false,then alert warnning
  if (!reqObj)
  {
    alert('Giving up :( Cannot create an XMLHTTP instance');
    return false;

  }
  reqObj.onreadystatechange = function(){GetRequest(callBackFun)}; //set onreadystatechange Function
  reqObj.open(method, url, isAsy);    //set open Function
  reqObj.setRequestHeader('Content-Type','application/x-www-form-urlencoded'); //set RequestHeader
  reqObj.send(parStr);  //do send and send parameters 
}

//get Service Response information Function
function GetRequest(callBackFun)
{
  //judge readystate information
  if (reqObj.readyState == 4)
  {
    //judge status information
    if (reqObj.status == 200)
    {
      eval(callBackFun+"(reqObj)");
    }
    else
    {
      alert('There was a problem with the request.'+reqObj.status+"CallFunction:"+callBackFun); //else alert warnning
    }
    RequestArray.shift(); //移除队列里的顺序第一个的请求,即当前已经执行完成的请求
    ExeRequestArray();   //要求执行队列中的请求
  }
}

看完上述内容,你们掌握AJAX中怎么实现请求队列的方法了吗?如果还想学到更多技能或想了解更多相关内容,欢迎关注创新互联行业资讯频道,感谢各位的阅读!

网站标题:AJAX中怎么实现请求队列
文章路径:https://www.cdcxhl.com/article44/jdsdee.html

成都网站建设公司_创新互联,为您提供App设计品牌网站建设网站维护网站排名网站内链网站营销

广告

声明:本网站发布的内容(图片、视频和文字)以用户投稿、用户转载内容为主,如果涉及侵权请尽快告知,我们将会在第一时间删除。文章观点不代表本网站立场,如需处理请联系客服。电话:028-86922220;邮箱:631063699@qq.com。内容未经允许不得转载,或转载时需注明来源: 创新互联

成都定制网站建设