[转]建一个XMLHttpRequest对象池

最新推荐文章于 2021-04-28 14:09:03 发布

weixin_34010949

最新推荐文章于 2021-04-28 14:09:03 发布

阅读量103

点赞数

文章标签： javascript ViewUI

原文链接：http://www.cnblogs.com/xuefuwu/archive/2007/01/01/609460.html

版权

本文介绍了一种通过创建XMLHttpRequest对象池来有效管理AJAX请求的方法，以避免对象重复创建带来的资源浪费，并提供了一个简单示例。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

在ajax应用中，通常一个页面要同时发送多个请求，如果只有一个XMLHttpRequest对象，前面的请求还未完成，后面的就会把前面的覆盖掉，如果每次都创建一个新的XMLHttpRequest对象，也会造成浪费。解决的办法就是创建一个XMLHttpRequset的对象池，如果池里有空闲的对象，则使用此对象，否则将创建一个新的对象。

下面是我最近写的一个简单的类：

  1 /* *
  2 * XMLHttpRequest Object Pool
  3 *
  4 * @author    legend <legendsky@hotmail.com>
  5 * @link      http://www.ugia.cn/?p=85
  6 * @Copyright www.ugia.cn
  7 */
  8
  9 var XMLHttp = {
10     _objPool: [],
11
12     _getInstance: function ()
13     {
14          for ( var i = 0 ; i < this ._objPool.length; i ++ )
15         {
16              if ( this ._objPool[i].readyState == 0 || this ._objPool[i].readyState == 4 )
17             {
18                  return this ._objPool[i];
19             }
20         }
21
22          // IE5中不支持push方法
23          this ._objPool[ this ._objPool.length] = this ._createObj();
24
25          return this ._objPool[ this ._objPool.length - 1 ];
26     },
27
28     _createObj: function ()
29     {
30          if (window.XMLHttpRequest)
31         {
32              var objXMLHttp = new XMLHttpRequest();
33
34         }
35          else
36         {
37              var MSXML = ['MSXML2.XMLHTTP. 5.0 ', 'MSXML2.XMLHTTP. 4.0 ', 'MSXML2.XMLHTTP. 3.0 ', 'MSXML2.XMLHTTP', 'Microsoft.XMLHTTP'];
38              for ( var n = 0 ; n < MSXML.length; n ++ )
39             {
40                  try
41                 {
42                      var objXMLHttp = new ActiveXObject(MSXML[n]);
43                      break ;
44                 }
45                  catch (e)
46                 {
47                 }
48             }
49          }
50
51          // mozilla某些版本没有readyState属性
52          if (objXMLHttp.readyState == null )
53         {
54             objXMLHttp.readyState = 0 ;
55
56             objXMLHttp.addEventListener( " load " , function ()
57                 {
58                     objXMLHttp.readyState = 4 ;
59
60                      if ( typeof objXMLHttp.onreadystatechange == " function " )
61                     {
62                         objXMLHttp.onreadystatechange();
63                     }
64                 },   false );
65         }
66
67          return objXMLHttp;
68     },
69
70      // 发送请求(方法[post,get], 地址, 数据, 回调函数)
71     sendReq: function (method, url, data, callback)
72     {
73          var objXMLHttp = this ._getInstance();
74
75          with (objXMLHttp)
76         {
77              try
78             {
79                  // 加随机数防止缓存
80                  if (url.indexOf( " ? " ) > 0 )
81                 {
82                     url += " &randnum= " + Math.random();
83                 }
84                  else
85                 {
86                     url += " ?randnum= " + Math.random();
87                 }
88
89                 open(method, url, true );
90
91                  // 设定请求编码方式
92                 setRequestHeader('Content - Type', 'application / x - www - form - urlencoded; charset = UTF - 8 ');
93                 send(data);
94                 onreadystatechange = function ()
95                 {
96                      if (objXMLHttp.readyState == 4 && (objXMLHttp.status == 200 || objXMLHttp.status == 304 ))
97                     {
98                         callback(objXMLHttp);
99                     }
100                 }
101             }
102              catch (e)
103             {
104                 alert(e);
105             }
106         }
107     }
108 };
109

示例：

1 < script type = " text/javascript " src = " xmlhttp.js " ></ script >
2 < script type = " text/javascript " >
3 function test(obj)
4 {
5 alert(obj.statusText);
6 }
7
8 XMLHttp.sendReq( ' GET ' , ' http://www.ugia.cn/wp-data/test.htm ' , '' , test);
9 XMLHttp.sendReq( ' GET ' , ' http://www.ugia.cn/wp-data/test.htm ' , '' , test);
10 XMLHttp.sendReq( ' GET ' , ' http://www.ugia.cn/wp-data/test.htm ' , '' , test);
11 XMLHttp.sendReq( ' GET ' , ' http://www.ugia.cn/wp-data/test.htm ' , '' , test);
12
13 alert( ' Pool length: ' + XMLHttp._objPool.length);
14 </ script >
15

转载于:https://www.cnblogs.com/xuefuwu/archive/2007/01/01/609460.html