[转]建一个XmlHttpRequest对象池
引用自:http://www.ugia.cn/?p=85
作者:Legend
在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
110
示例:
111
112
<script type="text/javascript" src="xmlhttp.js"></script>
113
<script type="text/javascript">
114
function test(obj)
115
{
116
alert(obj.statusText);
117
}
118
119
XMLHttp.sendReq('GET', 'http://www.ugia.cn/wp-data/test.htm', '', test);
120
XMLHttp.sendReq('GET', 'http://www.ugia.cn/wp-data/test.htm', '', test);
121
XMLHttp.sendReq('GET', 'http://www.ugia.cn/wp-data/test.htm', '', test);
122
XMLHttp.sendReq('GET', 'http://www.ugia.cn/wp-data/test.htm', '', test);
123
124
alert('Pool length:' + XMLHttp._objPool.length);
125
</script>
126
/**2
* XMLHttpRequest Object Pool3
*4
* @author legend <legendsky@hotmail.com>5
* @link http://www.ugia.cn/?p=856
* @Copyright www.ugia.cn7
*/ 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
else36
{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
try41
{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
try78
{79
// 加随机数防止缓存80
if (url.indexOf("?") > 0)81
{82
url += "&randnum=" + Math.random();83
}84
else85
{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

110
示例: 111

112
<script type="text/javascript" src="xmlhttp.js"></script>113
<script type="text/javascript">114
function test(obj)115
{116
alert(obj.statusText);117
}118

119
XMLHttp.sendReq('GET', 'http://www.ugia.cn/wp-data/test.htm', '', test);120
XMLHttp.sendReq('GET', 'http://www.ugia.cn/wp-data/test.htm', '', test);121
XMLHttp.sendReq('GET', 'http://www.ugia.cn/wp-data/test.htm', '', test);122
XMLHttp.sendReq('GET', 'http://www.ugia.cn/wp-data/test.htm', '', test);123

124
alert('Pool length:' + XMLHttp._objPool.length);125
</script> 126




浙公网安备 33010602011771号