ASP.NET 2.0客户端回调的实现分析

　　开发人员使用JavaScript的一个主要原因就是可以避免回发过程中带来的页面刷新。例如我们可以根据用户的需要使用Treeview控件来展开和折叠相应的数据节点。当你展开一个节点时，该Treeview控件将会利用JavaScript读取服务器上的子节点信息，然后平滑无刷新地插入这些新节点。如果没有使用JavaScript的话，Treeview控件将会因为页面的回发而重新构建。不但用户会发现因页面刷新而带来的延迟，而且页面极有可能回复到原来的状态，即丢失前面所展开的那些子节点信息。对于服务器端来说，因为每次回发的过程中都要处理大量的视图状态（View State）信息，这也会严重影响程序的整体执行性能。

　　以前我们使用的JavaScript示例几乎都是自包含的，即它们通常是为了完成一些特殊的显示效果（例如弹出一个新的页面窗口），而没有和服务器端代码进行信息的交互。如果你也想构建一个类似的无刷新页面的话，你首先必须调用服务器端的一个特定的方法，等待服务器响应后就会将请求的信息传递到客户端，从而避免了回发这个过程。为了实现这个方案，你首先需要对如何将客户端脚本和服务器端代码进行通讯有个大致的了解。尽管有许多中方法可以实现这两者间的交互（例如调用Web服务），但是由于受到特定的浏览器和平台的限制，它们的实现是还是有一定的难度的。而在ASP.NET 2.0中，引入了一个称为"客户端回调"的功能，利用这个内建的解决方案我们可以轻松实现客户端脚本和服务器端代码间的交互，从而避免了页面因回发带来的频繁刷新。

　　版权声明：任何获得天极网授权的网站，转载时请务必保留作者信息和以下链接
　　天极开发ASP.NET专栏：http://dev.yesky.com/msdn/msdnasp/
　　
　　客户端回调本质上就是指通过前端的客户端脚本向服务器端传递相应的数据参数，服务器端再以接受到的参数进行查询和处理，最后将结果回传到客户端进行显示。虽然这样的过程不是一种创举，但是对于许多开发者来说这在某种思维上还是无法理解的，因为JavaScript的内存管理和.NET CLR的内存管理是不同的进程，而且管理的空间上也截然不同，所以彼此间无法直接参照也没有直接进行交互的方式，而客户端回调却是实现客户端和服务器端进行沟通的方法之一，又因为它是在客户端触发的，所以这就应该是"客户端回调"命名的由来吧！

　　创建一个简单的客户端回调

　　为了在ASP.NET中展示一个客户端回调的实例，首先我们将概述客户端回调间的交互过程是如何实现的。下面是基本的步骤：

　　1． 在某时刻激活一个JavaScript事件，从而触发客户端回调。

　　2． 触发客户端回调发生后，服务器端的一个方法将被执行。该方法有一个固定的模式――它接受的是一个字符串参数，并且返回的也是一个字符串参数。

　　3． 一旦页面接受到来自服务器端方法的响应结果后，它就可以利用JavaScript修改一些和用户界面有关的信息（例如显示在页面上显示返回的结果）

　　对于开发人员来说，底层的交互过程是非常复杂的，ASP.NET则将交互的处理过程进行了抽象化，这样使得开发人员可以直接建立表层的客户端回调，而无需考虑底层的操作是如何实现的。

　　下面的实例中，页面中放置了一个文本框，一个提交按钮和一个标签。文本框是用来接受用户的输入信息，在单击提交按钮后将把文本框中输入的信息在标签上进行实时的显示。注意，在输入信息后单击提交按钮时，并没有像以前传统的提交方式那样重新对页面进行构建和刷新。图1-1为该实例的效果图。


　　创建基本的页面

　　按照上图的布局在工具栏的"标准"标签中拖拽出一个TextBox控件，一个Label控件到主窗体上。然后在"HTML"标签中拖拽出一个InputButton的HTML按钮，注意，该按钮不是我们经常使用的服务器端控件，而是一个HTML元素。在按钮中添加一个onclick事件，点击该按钮这将向服务器端发出回调请求，这个onclick事件的具体实现细节将在以后的过程中加以说明。得到的初始页面代码如下：

＜%@ Page Language="C#" AutoEventWireup="true" CodeFile="CallBackExample.aspx.cs" Inherits="CallBackExample" %＞ ＜html xmlns="http://www.w3.org/1999/xhtml"＞ ＜head runat="server"＞ ＜title＞客户端回调＜/title＞ ＜/head＞ ＜body＞ ＜form id="form1" runat="server"＞ ＜div＞ 请输入信息：＜asp:TextBox ID="txtEnter" runat="server"＞＜/asp:TextBox＞ ＜input id="btnSubmit" type="button" value="提交" onclick="CallServer(txtEnter,lblShow)"/＞ ＜br /＞ ＜asp:Label ID="lblShow" runat="server"＞＜/asp:Label＞ ＜/div＞ ＜/form＞ ＜/body＞ ＜/html＞

　　执行回调

　　为了实现客户端回调，你的页面逻辑代码中必须实现一个ICallbackEventHandler接口。代码如下：

public partial class CallBackExample : System.Web.UI.Page, System.Web.UI.ICallbackEventHandler {… …}

　　ICallbackEventHandler接口定义了两个方法，RaiseCallbackEvent()从浏览器接受一个字符串作为事件参数，即该方法接受客户端JavaScript使传递的参数，注意它是首先触发的。接下来触发的就是GetCallbackResult()方法，它将所得到的结果传回给客户端的JavaScript，JavaScript再将结果更新到页面。

　　本例中的RaiseCallbackEvent()中的参数为我们在文本框的输入信息。为了表明它是从服务器返回的，我们加了一些说明性的文字。然后用GetCallbackResult()方法中将结果传回到客户端。完整的页面逻辑代码如下：

using System; using System.Data; using System.Configuration; using System.Collections; using System.Web; using System.Web.Security; using System.Web.UI; using System.Web.UI.WebControls; using System.Web.UI.WebControls.WebParts; using System.Web.UI.HtmlControls; public partial class CallBackExample : System.Web.UI.Page, System.Web.UI.ICallbackEventHandler { 　//定义一个字符串，回调的结果信息将保存在该字符串中 　private string result; 　//引发回调事件处理 　public void RaiseCallbackEvent(string eventArgument) 　{ 　　//"eventArgument"为从客户端的JavaScript传递过来的参数 　　result = "从服务器端返回的内容：" + eventArgument; 　} 　//回传回调结果 　public string GetCallbackResult() 　{ 　　return result; 　} }