客户端回调服务器端事件

在 ASP.NET 网页的默认模型中，单击按钮或执行导致回发的一些其他操作。此时将重新创建页及其控件，并在服务器上运行页代码，然后返回给浏览器，并呈现出来。但是，在有些情况下，需要从客户端运行服务器代码，而不执行回发。如果页中的客户端脚本维护一些状态信息（例如，局部变量值），那么发送页和获取页的新副本就会损坏该状态。此外，页回发会导致处理开销，这会降低性能，且会让用户不得不等待处理并重新创建页。

若要避免丢失客户端状态并且不导致服务器往返的处理开销，可以对 ASP.NET 网页编码，使其能执行客户端回调。在客户端回调中，客户端脚本函数会向 ASP.NET 网页发送一个请求。该网页运行其正常生命周期的修改版本 — 初始化页并创建其控件和其他成员，然后调用特别标记的方法。该方法执行代码中编写的处理过程，然后向浏览器返回可由另一客户端脚本函数读取的值。在此过程中，该页一直驻留在浏览器中。

客户端回调组件

创建实现客户端回调的 ASP.NET 页与创建任何 ASP.NET 页类似，但也有如下这些区别。页的服务器代码必须：

• 实现 ICallbackEventHandler 接口。可以向任何 ASP.NET 网页添加此接口声明。

• 提供 RaiseCallbackEvent 方法的实现。此方法将被调用以对服务器执行回调。

• 提供 GetCallbackResult 方法的实现。此方法会将回调结果返回给客户端。

此外，该页还必须包含执行以下操作的三个客户端脚本函数：

• 一个函数调用帮助器方法，该方法执行对服务器的实际请求。在此函数中，可以首先执行自定义逻辑以准备事件参数，然后可以将一个字符串作为参数发送到服务器端回调事件处理程序。

• 另一个函数由处理回调事件的服务器代码的结果调用并接收该结果，同时接受表示该结果的字符串。该函数称为客户端回调函数。

• 第三个函数是执行对服务器的实际请求的 Helper 函数，当在服务器代码中使用 GetCallbackEventReference 方法生成对此函数的引用时，由 ASP.NET 自动生成该函数。

GetCallBackEventReferenceTest.aspx.cs：

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;
using  System.Text;

public   partial   class  MiniSample_GetCallbackEventReferenceTest :

System.Web.UI.Page,ICallbackEventHandler
{
     public double cbCount = 0;

    protected void Page_Load(object sender, EventArgs e)
    {
        ClientScriptManager cs = Page.ClientScript;

 //获取一个对客户端函数的引用；调用该函数时，将启动一个对服务器端事件的客户端回调。通过调用页的 GetCallbackEventReference 方法可以获取对库函数的引用，该方法可通过页 ClientScript 属性进行访问。然后动态生成一个客户端函数，该函数包含对来自 GetCallbackEventReference 方法的返回值的调用。
 //ClientScriptManager.GetCallbackEventReference 方法的使用请查看。http://msdn2.microsoft.com/zh-cn/library/system.web.ui.clientscriptmanager.getcallbackeventreference(VS.80).aspx
 //arg+'|'+context是传递给服务端的函数，由于要传入多参数，故用|连接起来，

ReceiveServerData是一个客户端方法接受服务端返回的值，GetBoxValueAndSum是在调用服务端方法之前所调用的客户端方法，ProcessCallBackError当服务端函数出错时，执行这客服端方法。
        String cbReference = cs.GetCallbackEventReference(this, "arg+'|'+context","ReceiveServerData","GetBoxValueAndSum", "ProcessCallBackError", false);
 
 //CallTheServer此客户端函数作用是用来调用服务器端方法
        String callbackScript = "function CallTheServer(arg, context) {" +cbReference + "; }";

        // 注册脚本块，以客户端方法调用服务器端方法
        cs.RegisterClientScriptBlock(this.GetType(), "CallTheServer",callbackScript,true);
    }

    // 回调服务器端处理函数
    public void RaiseCallbackEvent(String eventArgument)
    {
        string[] data = eventArgument.Split('|');//“|”分割
 //判断运算符
        switch (data[2])
        {
            case "+":
                cbCount = Convert.ToDouble(data[0]) + Convert.ToDouble(data[1]);
                break;
            case "-":
                cbCount = Convert.ToDouble(data[0]) - Convert.ToDouble(data[1]);
                break;
            default:
                break;
        }
    }

    // 回调结果，返回给客户端
    public string GetCallbackResult()
    {
        return cbCount.ToString();
    }
}

 

GetCallbackEventReferenceTest.aspx：

<% @ Page Language="C#" AutoEventWireup="true"

CodeFile="GetCallbackEventReferenceTest.aspx.cs"

Inherits="MiniSample_GetCallbackEventReferenceTest"  %>

DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"

"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd" >

< html  xmlns ="http://www.w3.org/1999/xhtml"   >
< head  runat ="server" >
     < title > 无标题页 title >
     < script  type ="text/javascript" >
    function ProcessCallBackError(arg, context)
    {
        Message2.innerText = '错误:'+arg;//服务器端出错时，显示错误信息
    }
    //调用服务器端方法之前处理一些请求
    function GetBoxValueAndSum(mth)
    {
        GetMethod(mth);
        var value1 = document.getElementById("Num1").value;
        var value2 = document.getElementById("Num2").value;
        var value = value1+"|"+value2;
        CallTheServer2(value,mth);//客户端调用服务端方法
    }
    function ReceiveServerData2(arg, context)
    {
        Message1.innerText = arg;//接受回调函数返回的值
    }

    function GetMethod(mt)
    {
        document.getElementById("Method").innerText=mt;
    }
     script >

head >
< body >
     < form  id ="form1"  runat ="server" >
     < div  id ="txtNum" >
         < input  id ="Num1"  type ="text"   />< span  id ="Method" > span >
         < input  id ="Num2"  type ="text"   /> = < span  id ="Message1" > 0 span >
       < br  />
       < input  type ="button"  
             value ="客户端回调1（加法）"  
             onclick ="GetBoxValueAndSum('+')" />
             
       < input  type ="button"  
             value ="客户端回调2（减法）"  
             onclick ="GetBoxValueAndSum('-')" />
       < br  />
       < asp:Label  id ="MyLabel"  
                 runat ="server" > asp:Label >< br  />
                  < span  id ="Message2" > span >
     div >
     form >
body >
html >