[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中是如何封装他的:
其他的不用多说明了,看注释应该就差不多了,如果有不对的地方请批评指教,谢谢!
首先当然是要了解一下浏览器中的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中是如何封装他的:
1
//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
41
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
53
url += "?Ajax_CallBack=true";
54
}
55
}
56
57
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
70
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
77
if (x.readyState != 4) {
78
return;
79
}
80
81
if (debugResponseText) {
82
alert(x.responseText);
83
}
84
85
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
//Ajax Start2
///<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
41
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
else49
{50
if (url.substr(url.length - 1, 1) == "/")51
url += "default.aspx";52
53
url += "?Ajax_CallBack=true";54
}55
}56

57
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

70
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
77
if (x.readyState != 4) {78
return;79
}80
81
if (debugResponseText) {82
alert(x.responseText);83
}84
85
try86
{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其他的不用多说明了,看注释应该就差不多了,如果有不对的地方请批评指教,谢谢!




浙公网安备 33010602011771号