[CommunityServer]AJAX客户端说明，XMLHttpRequest对象

在CommunityServer中运用了自己的AJAX机制，没有借助其他的辅助控件。其中客户的XMLHttpRequest对象的封装，就足以让人大饱眼福，在一般的浏览器其都能够运行AJAX。下面我们来学习学习这个咚咚，希望能给更多的人带来帮助。

首先当然是要了解一下浏览器中的XMLHttp对象了：

XMLHTTP方法：
          备注：客户机可以使用XMLHTTP对象发送任意的HTTP请求,接受HTTP应答,还可以对应答的XML文档进行解析。

          Open方法：初始化一个Msxml2.XMLHTTP请求，指定HTTP请求方式、URL以及鉴定信息。

         语法：
          Open（ bstrMethod, bstrUrl, varAsync, bstrUser, bstrPassword ）

         参数介绍：

         bstrMethod：数据传送方式，即GET或POST。
          bstrUrl：服务网页的URL。
          varAsync：是否同步执行。缺省为True，即同步执行，但只能在DOM中实施同步执行。用中一般将其置为False，即异步执行。
          bstrUser：用户名，可省略。
          bstrPassword：用户口令，可省略。

         Send方法：发送HTTP请求到服务器，返回应答。

         语法：
         oXMLHttpRequest.send(varBody)

        说明：此方法是否同步取决于Open方法的varAsync参数。如果设为True则为同步，调用立刻返回，如果设为False调用直到整个应答被接收了才返回。

         setRequestHeader（ bstrHeader, bstrvalue ）

         bstrHeader：HTTP 头(header)
         bstrvalue： HTTP 头(header)的值

        如果Open方法定义为POST，可以定义表单方式上传：
        xmlhttp.setRequestHeader（ "Content-Type", "application/x-www-form-urlencoded"）

XMLHTTP属性：

onreadystatechange：在同步执行方式下获得返回结果的事件句柄。只能在DOM中调用。
responseBody：结果返回为无符号整数数组。
responseStream：结果返回为IStream流。
responseText ：结果返回为字符串。
responseXML：结果返回为XML格式数据。

运用这个原理也可以做网络小偷程序，网络爬虫应该就是应用这个东西来完成的吧，不过我没有做过，可能在不久的将来会制作个来玩玩，这里我们最主要的是看看CS中是如何封装他的：

//Ajax Start
2

///<summary>
3

///创建回调对象，如果存在window.XMLHttpRequest()对象,则返回此对象，如果是IE则搜索Msxml2.XMLHTTP各个版本及Microsoft.XMLHTTP并创建对象返回。
4

///</summary>
5

function Ajax_GetXMLHttpRequest() {
6

if (window.XMLHttpRequest) {
7

return new XMLHttpRequest();
8

} else {
9

if (window.Ajax_XMLHttpRequestProgID) {
10

return new ActiveXObject(window.Ajax_XMLHttpRequestProgID);
11

} else {
12

var progIDs = ["Msxml2.XMLHTTP.5.0", "Msxml2.XMLHTTP.4.0", "MSXML2.XMLHTTP.3.0", "MSXML2.XMLHTTP", "Microsoft.XMLHTTP"];
13

for (var i = 0; i < progIDs.length; ++i) {
14

var progID = progIDs[i];
15

try {
16

var x = new ActiveXObject(progID);
17

window.Ajax_XMLHttpRequestProgID = progID;
18

return x;
19

} catch (e) {
20

}
21

}
22

}
23

}
24

return null;
25

}
26

///<summary>
27

///Ajax回调。
28

///</summary>
29

///<param name="type">调用服务端函数所在的类包括命名空间(如：NExplus.Controls.SiteHeader)。</param>
30

///<param name="id">客户端所对应的标记的ID(如：<div id="ID"></div>)。</param>
31

///<param name="method">服务端(方法)函数名称(被AjaxMethod标记)。</param>
32

///<param name="args">传到服务器的字符串。</param>
33

///<param name="clientCallBack">同步或异步回调。</param>
34

///<param name="debugRequestText">调试/请求字符串。</param>
35

///<param name="debugResponseText">调试/输出字符串。</param>
36

///<param name="debugErrors">调试的错误信息。</param>
37

///<param name="includeControlValuesWithCallBack">是否和控件及其值一起回调。</param>
38

///<param name="url">Url地址。</param>
39

function Ajax_CallBack(type, id, method, args, clientCallBack, debugRequestText, debugResponseText, debugErrors, includeControlValuesWithCallBack, url) {
40

if (!url)
42

{
43

url = window.location.href;
44

url = url.replace(/\#.*$/, '');//去除URL中标签部分，即"#"之后的字符串。
45

//加入参数Ajax_CallBack并设为true,说明是AJAX回调。
46

if (url.indexOf('?') > -1)
47

url += "&Ajax_CallBack=true";
48

else
49

{
50

if (url.substr(url.length - 1, 1) == "/")
51

url += "default.aspx";
52

url += "?Ajax_CallBack=true";
54

}
55

}
56

var x = Ajax_GetXMLHttpRequest();//取得XMLHttpRequest对象。
58

var result = null;
59

if (!x) {
60

result = { "value":null, "error": "NOXMLHTTP"};
61

if (debugErrors) {
62

alert("error: " + result.error);
63

}
64

if (clientCallBack) {
65

clientCallBack(result);
66

}
67

return result;
68

}
69

x.open("POST", url, clientCallBack ? true : false);//以Post方式打开对象，这样在服务端就可以用Request.Form获取参数。
71

x.setRequestHeader("Content-Type", "application/x-www-form-urlencoded; charset=utf-8");
72

if (clientCallBack) {
73

//如果同步，判断状态，输出错误消息。
74

x.onreadystatechange = function() {
75

var result = null;
76

if (x.readyState != 4) {
78

return;
79

}
80

if (debugResponseText) {
82

alert(x.responseText);
83

}
84

try
86

{
87

var result = eval("(" + x.responseText + ")");
88

if (debugErrors && result.error) {
89

alert("error: " + result.error);
90

}
91

}
92

catch (err)
93

{
94

if (window.confirm('The following error occured while processing an AJAX request: ' + err.message + '\n\nWould you like to see the response?'))
95

{
96

var w = window.open();
97

w.document.open('text/plain');
98

w.document.write(x.responseText);
99

w.document.close();
100

}
101

102

result = new Object();
103

result.error = 'An AJAX error occured. The response is invalid.';
104

}
105

106

clientCallBack(result);
107

}
108

}
109

var encodedData = "Ajax_CallBackType=" + type;
110

if (id) {
111

encodedData += "&Ajax_CallBackID=" + id.split("$").join(":");
112

}
113

encodedData += "&Ajax_CallBackMethod=" + method;
114

if (args) {
115

for (var i in args) {
116

encodedData += "&Ajax_CallBackArgument" + i + "=" + encodeURIComponent(args[i]);
117

}
118

}
119

//如果加入控件，则加入控件数据。
120

if (includeControlValuesWithCallBack && document.forms.length > 0) {
121

var form = document.forms[0];
122

for (var i = 0; i < form.length; ++i) {
123

var element = form.elements[i];
124

if (element.name) {
125

var elementValue = null;
126

if (element.nodeName == "INPUT") {
127

var inputType = element.getAttribute("TYPE").toUpperCase();
128

if (inputType == "TEXT" || inputType == "PASSWORD" || inputType == "HIDDEN") {
129

elementValue = element.value;
130

} else if (inputType == "CHECKBOX" || inputType == "RADIO") {
131

if (element.checked) {
132

elementValue = element.value;
133

}
134

}
135

} else if (element.nodeName == "SELECT") {
136

elementValue = element.value;
137

} else if (element.nodeName == "TEXTAREA") {
138

elementValue = element.value;
139

}
140

if (elementValue) {
141

encodedData += "&" + element.name + "=" + encodeURIComponent(elementValue);
142

}
143

}
144

}
145

}
146

//如果是调试，则弹出发送的数据。
147

if (debugRequestText) {
148

alert(encodedData);
149

}
150

x.send(encodedData);//向服务器发送数据。
151

if (!clientCallBack) {
152

if (debugResponseText) {
153

alert(x.responseText);
154

}
155

result = eval("(" + x.responseText + ")");
156

if (debugErrors && result.error) {
157

alert("error: " + result.error);
158

}
159

}
160

delete x;
161

return result;
162

}
163

164

//Ajax End

其他的不用多说明了，看注释应该就差不多了，如果有不对的地方请批评指教，谢谢！