65.9K
CodeProject 正在变化。 阅读更多。
Home

ASP.NET 2.0 中的客户端回调

Amit Kukreti (A)
starIconstarIconstarIcon
emptyStarIcon
starIcon
emptyStarIcon

3.50/5 (15投票s)

2005年12月9日

CPOL

9分钟阅读

viewsIcon

120590

downloadIcon

1467

关于 ASP.NET 2.0 中客户端回调的文章

目录

  1. 引言
  2. 回调对我意味着什么？
  3. 早期的技术是什么？
  4. ASP.NET 2.0 中有什么新内容，它有何不同？
  5. 界面
  6. 方法的结构
  7. 示例

引言

互联网的出现得益于有前景的客户端服务器技术。客户端浏览器与服务器分离，它会向服务器发出调用，服务器端脚本会响应调用并将结果发送回客户端。最初阶段与静态站点相关，但随着时间的推移，这个静态世界变得如此动态，以至于现在人们希望拥有如此多事物的在线版本。回想一下，过去我们不得不去最近的 ATM 或银行查询账户余额，或者不得不去商店订购教科书，或者商业人士向财务部门提出请求，然后事情才慢慢地进行。

这种强大的客户端服务器技术模型改变了它的面貌，现在它已经成为事件驱动模型；然而，在底层，它仍然是客户端服务器。借助 .NET，我们可以很好地用事件驱动模型来涵盖客户端服务器模型。这一切对开发人员来说都是透明的，幕后的视图状态会处理这一切。

现在，在使其看起来像一个事件驱动模型之后，仍然存在覆盖层中的裂缝，客户端服务器式的计算通过这些裂缝可见。现在，回调已经演变成一种覆盖这些裂缝的新模型。

回调对我意味着什么？

回调用于改善客户体验，因为它们可以帮助避免整个页面刷新。当我们浏览网页时，大多数时候我们会收到相同的页面，但这次它会显示更多详细信息。考虑类别和子类别问题。因此，使用回调，我们可以从服务器获取数据，而最终用户将无法察觉（或者看到无聊的全页刷新）。此外，我们还可以执行服务器端操作，例如将传递的信息保存到数据库，然后将新的字符串发送回客户端，以便客户端可以呈现更新的视图。

早期的技术是什么？

回调就像进化的生物，它们的祖先是 AJAX 式动物。开发人员使用 AJAX 来获得相同的外观和感觉。但是，回调隐藏了 AJAX 对开发人员的细节。开发人员永远不会为 XmlHttp 对象编写任何代码来执行回调操作。

ASP.NET 2.0 中有什么新内容，它有何不同？

ASP.NET 2.0 在开始支持回调时，它以一个新的接口 ICallbackEventHandler 开始。然而，最初，这个接口只有一个方法 RaiseCallbackEvent。随着时间的推移，它的最终版本有两个方法：

  • RaiseCallbackEvent
  • GetCallbackResult

在最初的日子里，RaiseCallbackEvent 负责进行处理，然后引发客户端事件。现在，在最终发布版本中，这个责任已分配给上述两个方法。

现在我们只看新的功能。

因此，RaiseCallbackEvent 的职责是进行处理，而 GetCallbackResult 则调用客户端函数并获取调用。

当客户端通过执行某些操作发起调用时，服务器端 RaiseCallbackEvent 会被触发并进行处理。通常，此处理的结果会提供给一个字符串变量，然后该字符串变量由 GetCallbackResult 事件返回，该事件在 RaiseCallbackEvent 处理完成后触发。

界面

这是该接口的完整定义

namespace System.Web.UI
{    
   public interface ICallbackEventHandler
    {
        // Summary:

        //     Returns the results of a callback event that targets a control.

        //

        // Returns:

        //     The result of the callback.

        string GetCallbackResult();
        //

        // Summary:

        //     Processes a callback event that targets a control.

        //

        // Parameters:

        //   eventArgument:

        //     A string that represents an event

        //     argument to pass to the event handler.

        void RaiseCallbackEvent(string eventArgument);
    }
}

方法的结构

每当我们代码量减少时，我们总会有几个步骤需要执行，以便我们能够利用由于代码量减少而获得的免费基础设施。如果我们想要现成的食物，那么步骤就像是打电话给酒店/食品店，处理订单，然后将其送到我们手中。然而，美妙之处在于理解这些步骤。如果没有吃披萨的心情，我就不能点我的披萨。如果我这样做，我将最终毁掉我的晚餐和心情，两者都毁掉。编写回调也是如此，在我们深入研究它之前。我们需要看看我们到底想做什么，以及它将如何为我们工作？

为了让回调奏效，我们需要有两个组件来进行我们的调用：

  1. 服务器端脚本
  2. 客户端代码

这里，服务器端脚本将是一个 C# 类 [aspx 页面]（因为我们正在谈论 .NET，而且我对 C# 比较熟悉）。

让我们首先看一下服务器端步骤，然后我们再看客户端步骤。

服务器端步骤

  1. 服务器端控件或页面（我们以后称之为服务器端脚本）应实现 ICallbackEventHandler。
  2. 服务器端脚本应知道在服务器端处理完成后要调用哪个客户端函数。
  3. 确定服务器端脚本可能需要的参数，以便做出处理决定。
  4. 服务器端脚本必须为客户端调用（例如 JavaScript 函数）进行配置。

为了完成各种任务，服务器端脚本使用框架提供的新函数。一个函数用于告知客户端服务器已完成工作，这是通过进行客户端函数调用以及传递的参数来完成的。这项工作由页面的 GetCallbackResult 方法完成。

我们将在本文附加的代码示例中看到更多内容。

由于我们是在服务器端执行这些操作，因此页面加载方法是执行所有这些操作的更好选择。

客户端

  1. 必须有一个函数来启动服务器端的调用。
  2. 必须有一个服务器在处理完成后调用的函数。该函数反过来会更新客户端页面（服务器端步骤 2）。

启动调用的客户端函数是在服务器端编写的，然后我们使用页面类方法注册它。我们这样做是因为该函数将为我们提供配置代码。这是由 .NET 生成的，因此我们可以使用它。这是通过 Page.ClientScript.RegisterClientScriptBlock 函数完成的。

我们将在本文附加的代码示例中看到很多内容。

示例

本文附带的示例将尝试从服务器端获取不同的数字，而无需导致整个页面刷新。为了简单起见，我省略了各种验证检查，例如我的客户端传递了我的服务器代码不期望的参数。

作为结果的示例页面将包含一个文本框和三个按钮，单击第一个按钮将从服务器获取文本“1, 2, 3”，单击第二个按钮将获取文本“4, 5, 6”，单击第三个按钮将从服务器获取“7, 8, 9”。

服务器端代码及其含义

callBackInitiater = 
       Page.ClientScript.GetCallbackEventReference(this, 
       "args", "ServerFeeding","context");

这会设置客户端 JavaScript 函数。ServerFeeding 是客户端方法的名称，在服务器完成处理时将被调用。

那么问题来了，服务器端的哪个方法调用客户端方法？该方法实际上是服务器端的 RaiseCallbackEvent(string eventArgument); 事件处理程序。在该服务器端处理完成后，服务器端脚本将处理 GetCallbackResult() 方法，该方法实际上负责将结果发送回客户端。这些结果回传给客户端的管道是由框架配置提供的，所以我们不必担心它。

string Jsblock = "function callBack(args, context){" + callBackInitiater + "}";

第二行只是我们尝试编写 JavaScript 函数。该函数实际上负责启动对服务器端脚本的调用。因此，我们将 callBackInitiater 变量的值放在我们尝试为客户端函数生成的字符串中。嗯，实际上，由于 Page.ClientScript.GetCallbackEventReference 方法的执行，这个字符串将包含管道 JavaScript 代码，因为该方法的返回类型是 string。

还有一点需要注意，您不能在此处更改参数名称：args 和 context，因为 args 和 context 是由于步骤 1 而来的。我们也可以在那里看到 args 和 context。嗯，args 参数包含所有传递的客户端脚本参数，而 context 包含上下文。我们可以在服务器端的 GetCallbackEventReference 事件处理中使用 args 参数值来根据参数值执行不同的操作。

Page.ClientScript.RegisterClientScriptBlock(this.GetType(), 
                                 "callBack", Jsblock,true);

我们正在注册我们在步骤二中生成的客户端脚本。请注意，唯一连接的东西是字符串“callback”。请确保您遵循区分大小写，因为我们在这里编写的代码将被转换为 JavaScript，您可以通过右键单击并选择“查看源”在 IE 中查看它。

客户端代码及其含义

   function ServerFeeding(args,  context)
   {
     var s = document.getElementById('Label1');
     s.value = args
   }

此方法是服务器完成处理后将调用的方法。请注意，该方法的名称是 ServerFeeding，我们在服务器端代码的步骤 1 中指定了它。

    function callServer(args)
    {
      callBack (args,"ClientContext");
      return false
    }

此方法是服务器端调用的发起者。请注意，此方法正在调用我们在服务器端代码的步骤 2 中编写并在步骤 3 中注册的 JavaScript 方法。在这里，我们使用 args 参数将客户端参数传递给服务器，并通过按钮的 OnClientClick 发起了对该函数的调用。

<asp:Button ID="A" runat="server" 
            Text="Button" OnClientClick = "return callServer(1)"/>
<asp:Button ID="B" runat="server" 
            Text="Button" OnClientClick = "return callServer(2)"/>
<asp:Button ID="C" runat="server" 
            Text="Button" OnClientClick = "return callServer(3)"/>

请注意 OnClientClick 事件中的 return 语句。此 return 将导致页面回发，因为 ASP.NET 按钮在 ASP.NET 生成的 HTML 中会呈现为 <input type=submit>，而提交按钮的默认行为是回发。

因此，上述技术只是演示了我们可以使用 ASP.NET 的客户端回调做什么。ASP.NET 中现在有一些控件正在使用客户端回调来提供更好的性能。

注意：附加的示例仅包含 .aspx 和 .cs 文件。您需要创建一个 Whidbey 项目，然后将它们添加到项目中。

© . All rights reserved.