当前位置: 首页 > 图文教程 > 网络编程 > ASP.NET > asp.net客户端回调功能的实现机制

ASP.NET
不同映射模式下的直线输出的效果问题
ASP.NET开发下的MVC设计模式的实现
ASP.NET编写应用程序的十大技巧
ASP.NET中使用AJAX的简单方法
ASP.NET MVC实现自己的视图引擎
认识asp.net会话状态
ASP.NET实现页面传值的几种方法
.NET中容易混淆的几组重要概念
详解.NET中的动态编译技术
如何使用ASP.Net加密Cookie
ASP.NET 2.0跨网页提交的三种方法
ASP.NET 2.0创建母版页引来的麻烦
.Net整合其他平台的一些探讨
ASP.NET编程经验技巧10则
最佳实践 ADO.NET实用经验无保留曝光
在.NET上执行多线程操作要考虑的两大因素
.Net开发 细说Visual Basic.Net
ASP.NET网络编程中经常用到的27个函数集
ASP.NET防止用户多次登录的方法
对ASP.NET MVC项目中的视图做单元测试

ASP.NET 中的 asp.net客户端回调功能的实现机制


出处:互联网   整理: 软晨网(RuanChen.com)   发布: 2009-08-14   浏览: 193 ::
收藏到网摘: n/a

实现的过程基本上就是:让要实现客户端回调功能的页面或者空间实现System.Web.UI.ICallbackEventHandler的接口,即2个方法:void RaiseCallbackEvent(string eventArgument),这个是当客户端触发服务器端事件的委托方法,string GetCallbackResult();这个是返回客户端需要的值,只能是string 型的,当然你也可以返回一个Json串。
然后在pageload的时候注册脚本到客户端:在这里注册一个CallServer方法来调用服务器端方法,ReceiveServerData来捕获服务器返回的结果。当然你也可以使用一个方法来捕获服务器端的错误,详见Page.ClientScript.RegisterClientScriptBlock这个方法的MSDN解释。
这样就能实现客户端的回调服务器端事件,并返回值。
生成好页面后,查看源代码:
首先是多了一个js资源文件,多了一行这样的代码:

在body快结束的时候还有一段这样的代码:
WebForm_InitCallback();好,这些应该就是asp.net为了实现客户端回调所作的补充工作了吧,咱们来研究吧。
首先看js资源文件(20多K,汗一个...)。先在资源文件里面找到这个方法,WebForm_InitCallback();
方法如下:

1function WebForm_InitCallback() {
2 var count = theForm.elements.length;
3 var element;
4 for (var i = 0; i < count; i++) {
5 element = theForm.elements[i];
6 var tagName = element.tagName.toLowerCase();
7 if (tagName == "input") {
8 var type = element.type;
9 if ((type == "text"    type == "hidden"    type == "password"   
10 ((type == "checkbox"    type == "radio") & element.checked)) &&
11 (element.id != "__EVENTVALIDATION")) {
12 WebForm_InitCallbackAddField(element.name, element.value);
13 }
14 }
15 else if (tagName == "select") {
16 var selectCount = element.options.length;
17 for (var j = 0; j < selectCount; j++) {
18 var selectChild = element.options[j];
19 if (selectChild.selected == true) {
20 WebForm_InitCallbackAddField(element.name, element.value);
21 }
22 }
23 }
24 else if (tagName == "textarea") {
25 WebForm_InitCallbackAddField(element.name, element.value);
26 }
27 }
28}这个方法就是把表单里面所有的值全部装载到一个键值对里面去。

附WebForm_InitCallbackAddField(element.name, element.value);方法实现:
function WebForm_InitCallbackAddField(name, value) {
var nameValue = new Object();
nameValue.name = name;
nameValue.value = value;
__theFormPostCollection[__theFormPostCollection.length] = nameValue;
__theFormPostData += name + "=" + WebForm_EncodeCallback(value) + "&";
}
function WebForm_EncodeCallback(parameter) {
if (encodeURIComponent) {
return encodeURIComponent(parameter);
}
else {
return escape(parameter);
}
}

那么就是asp.net在初始化客户端回调功能的时候,其实就是将表单里面的所有键值对全部装载到一个全局的键值对里面去了。

然后,咱们来看看unction CallServer(arg, context){ WebForm_DoCallback('__Page',arg,ReceiveServerData,context,null,false);}所作的工作。
在示例中,点击按钮,就触发了CallServer方法,

function LookUpStock()
{
var lb = document.getElementById("ListBox1");
var product = lb.options[lb.selectedIndex].text;
CallServer(product, "");
}

在资源文件中找到WebForm_DoCallback方法,由于方法太长太大,只有分段解析:
unction WebForm_DoCallback(eventTarget, eventArgument, eventCallback, context, errorCallback, useAsync) {
var postData = __theFormPostData +
"__CALLBACKID=" + WebForm_EncodeCallback(eventTarget) +
"&__CALLBACKPARAM=" + WebForm_EncodeCallback(eventArgument);
if (theForm["__EVENTVALIDATION"]) {
postData += "&__EVENTVALIDATION=" + WebForm_EncodeCallback(theForm["__EVENTVALIDATION"].value);
}
var xmlRequest,e;
try {
xmlRequest = new XMLHttpRequest();
}
catch(e) {
try {
xmlRequest = new ActiveXObject("Microsoft.XMLHTTP");
}
catch(e) {
}
}

这段代码是将一些参数附加上去到postData变量上。并创建xmlRequest对象。不过这个创建异步对象方法似乎有点不妥,他是先看是否是非IE的浏览器,然后被cacth住了才创建ActiveX对象,也就是说在IE大行其道的时候不得不多次catch,为什么不把创建ActiveX对象放在前面节省资源呢?不管这么多,接下来看:

var setRequestHeaderMethodExists = true;
try {
setRequestHeaderMethodExists = (xmlRequest && xmlRequest.setRequestHeader);
}
catch(e) {}
var callback = new Object();
callback.eventCallback = eventCallback;
callback.context = context;
callback.errorCallback = errorCallback;
callback.async = useAsync;
var callbackIndex = WebForm_FillFirstAvailableSlot(__pendingCallbacks, callback);
if (!useAsync) {
if (__synchronousCallBackIndex != -1) {
__pendingCallbacks[__synchronousCallBackIndex] = null;
}
__synchronousCallBackIndex = callbackIndex;
}
if (setRequestHeaderMethodExists) {
xmlRequest.onreadystatechange = WebForm_CallbackComplete;
callback.xmlRequest = xmlRequest;
xmlRequest.open("POST", theForm.action, true);
xmlRequest.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
xmlRequest.send(postData);
return;
}

这几段语句最重要的是将异步回调方法赋值为:WebForm_CallbackComplete。

不过俺们还忽略了一些细节,让我们从头再来。上面有一段代码

if (setRequestHeaderMethodExists)
也就是说在setRequestHeaderMethodExists这个变量不为null的时候才能够发送异步对象,那么这个变量是怎么定义的呢??
var setRequestHeaderMethodExists = true;
try {
setRequestHeaderMethodExists = (xmlRequest && xmlRequest.setRequestHeader);
}

也就是说只有当正确的创建了xmlRequest对象后才能够使用ajax,那么如果不能够正确创建ajax对象怎么办呢?接着看代码!

callback.xmlRequest = new Object();
var callbackFrameID = "__CALLBACKFRAME" + callbackIndex;
var xmlRequestFrame = document.frames[callbackFrameID];
if (!xmlRequestFrame) {
xmlRequestFrame = document.createElement("IFRAME");
xmlRequestFrame.width = "1";
xmlRequestFrame.height = "1";
xmlRequestFrame.frameBorder = "0";
xmlRequestFrame.id = callbackFrameID;
xmlRequestFrame.name = callbackFrameID;
xmlRequestFrame.style.position = "absolute";
xmlRequestFrame.style.top = "-100px"
xmlRequestFrame.style.left = "-100px";
try {
if (callBackFrameUrl) {
xmlRequestFrame.src = callBackFrameUrl;
}
}
catch(e) {}
document.body.appendChild(xmlRequestFrame);
}

接下来原来是创建一个iframe!呵呵,原来是保证所有的浏览器都能使用ajax才出的这招。
再下来应该就是给这个iframe里面加载一些变量了,并且提交这个iframe了:

var interval = window.setInterval(function() {
xmlRequestFrame = document.frames[callbackFrameID];
if (xmlRequestFrame && xmlRequestFrame.document) {
window.clearInterval(interval);
xmlRequestFrame.document.write("");
xmlRequestFrame.document.close();
xmlRequestFrame.document.write('

');
xmlRequestFrame.document.close();
xmlRequestFrame.document.forms[0].action = theForm.action;
var count = __theFormPostCollection.length;
var element;
for (var i = 0; i < count; i++) {
element = __theFormPostCollection[i];
if (element) {
var fieldElement = xmlRequestFrame.document.createElement("INPUT");
fieldElement.type = "hidden";
fieldElement.name = element.name;
fieldElement.value = element.value;
xmlRequestFrame.document.forms[0].appendChild(fieldElement);
}
}
var callbackIdFieldElement = xmlRequestFrame.document.createElement("INPUT");
callbackIdFieldElement.type = "hidden";
callbackIdFieldElement.name = "__CALLBACKID";
callbackIdFieldElement.value = eventTarget;
xmlRequestFrame.document.forms[0].appendChild(callbackIdFieldElement);
var callbackParamFieldElement = xmlRequestFrame.document.createElement("INPUT");
callbackParamFieldElement.type = "hidden";
callbackParamFieldElement.name = "__CALLBACKPARAM";
callbackParamFieldElement.value = eventArgument;
xmlRequestFrame.document.forms[0].appendChild(callbackParamFieldElement);
if (theForm["__EVENTVALIDATION"]) {
var callbackValidationFieldElement = xmlRequestFrame.document.createElement("INPUT");
callbackValidationFieldElement.type = "hidden";
callbackValidationFieldElement.name = "__EVENTVALIDATION";
callbackValidationFieldElement.value = theForm["__EVENTVALIDATION"].value;
xmlRequestFrame.document.forms[0].appendChild(callbackValidationFieldElement);
}
var callbackIndexFieldElement = xmlRequestFrame.document.createElement("INPUT");
callbackIndexFieldElement.type = "hidden";
callbackIndexFieldElement.name = "__CALLBACKINDEX";
callbackIndexFieldElement.value = callbackIndex;
xmlRequestFrame.document.forms[0].appendChild(callbackIndexFieldElement);
xmlRequestFrame.document.forms[0].submit();
}
}, 10);
}

原来在最开始初始化客户端回调的方法就是为了在不能够正确创建ajax对象的时候,将表单的值全部初始化到另外的iframe里面去的。
好了,整个asp.net客户端回调的请求发送部分分析完了,看来回调部分要下次了。

如果有分析不对的地方还请大侠指正!