（C_高级编程第6版doc）：第39章ASP.NETAJAX.doc

第39章ASP.NET AJAXWeb应用程序编程是一个不断变化和改进的主题。前面两章介绍了如何使用ASP.NET创建功能全面的Web应用程序，读者可能以为，前面已经探讨了创建自己的Web应用程序所需要的所有工具。但是，如果花点时间查看当前的网站，就会注意到，最近的网站在使用方面比老网站好得多。许多目前最好的网站都提供了丰富的用户界面，其响应能力与Windows应用程序差不多。它们是使用客户端处理技术实现的，主要是JavaScript代码和一种新技术Ajax。出现这个变化，是因为客户用于浏览网站的浏览器和客户用于运行浏览器的计算机更强大了。Web浏览器的当前版本，例如Internet Explorer 7和Firefox，也支持各种标准。这些标准，包括JavaScript，使Web应用程序提供的功能比使用普通的HTML提供的功能强大得多。前面的章节介绍了一些这方面的功能，例如使用层叠样式表(CSS)设置Web应用程序的样式。本章介绍的Ajax并不是一个新技术，它只是一个标准的合并，以识别当前Web浏览器的丰富的潜在功能。在支持Ajax的Web应用程序中，最重要的特性是Web浏览器能在操作的外部与Web服务器通信。这称为异步回送或部分页面的回送。实际上，这意味着用户可以与服务器端的功能和数据交互，而无需更新整个页面。例如，单击一个链接，移动到表的第二页数据上时，Ajax可以只刷新表的内容，而不刷新整个Web页面。也就是说，需要的Internet通信量较少，从而使Web应用程序的响应比较快。本章的后面将介绍这个例子，还会举许多例子来说明Ajax在Web应用程序中的巨大作用。本章将在代码中使用Ajax的Microsoft实现方式，它称为ASP.NET AJAX。这个实现方式采用了Ajax模型，将它应用于ASP.NET架构。ASP.NET AJAX提供了许多服务器控件和客户端技术，它们专用于ASP.NET开发人员，可以毫不费力地在Web应用程序中添加Ajax功能。本章的内容如下： 首先学习Ajax和实现Ajax的技术。 学习ASP.NET AJAX及其组成部分，以及ASP.NET AJAX提供的功能。 介绍如何通过服务器端和客户端代码在Web应用程序中使用ASP.NET AJAX。这是本章最大的一部分。39.1 Ajax的概念Ajax允许通过异步回送和动态的客户端Web页面处理，改进Web应用程序的用户界面。术语Ajax由Jesse James Garrett提出，是Asynchronous JavaScript and XML的缩写。提示：Ajax不是一个缩写词，因此不能写作AJAX。但是，在产品名称ASP.NET AJAX中它是大写，这是Ajax的Microsoft实现方式，如下一节所述。根据定义，Ajax显然涉及到JavaScript和XML。但是，Ajax编程需要使用其他技术，如表39-1所述。表 39-1技 术说 明HTML/XHTMLHTML(超文本标记语言，Hypertext Markup Language)是显示和布局语言，由Web浏览器用于在图形化用户界面上显示信息。在前面两章中，学习了HTML如何实现这个功能，ASP.NET如何生成HTML代码。可扩展的HTML(XHTML)是使用XML结构的一个较严谨的HTML版本CSSCSS(层叠样式表)是HTML元素根据一个样式表中定义的规则设置样式的方式。它允许将样式同时应用于多个HTML元素，能在不修改HTML的情况下改变Web页面的外观。CSS包含布局和样式信息，所以也可以使用CSS在页面上定位HTML元素。前面的章节还在例子中介绍了具体的操作DOMDOM(文档对象模型)是在层次结构中表示和处理(X)HTML代码的一种方式。它允许访问页面上的“表x中第三行的第二列”，且无需使用比较基本的文本处理方式定位这个元素JavaScriptJavaScript是一个客户端脚本编辑技术，允许在Web浏览器上执行代码。JavaScript的语法类似于其他基于C的语言，包括C#，提供了变量、函数、分支代码、循环语句、事件处理程序和其他编程元素。但是与C#不同，JavaScript不是强类型化的，JavaScript代码的调试比较困难。对于Ajax编程，JavaScript是一种关键技术，因为它允许利用DOM处理功能，动态修改Web页面XMLXML是标记数据的一种独立于平台的方式，对Ajax非常关键，它既是处理数据的方式，也是客户机和服务器之间的通信语言XmlHttpRequest自Internet Explorer 5以来，浏览器就把XmlHttpRequest API作为一种在客户机和服务器之间进行异步通信的方式。Microsoft最初把它引入为一种技术，以访问通过Internet存储在Exchange服务器中的电子邮件，它使用的产品叫做Outlook Web Access。后来它变成在Web应用程序中进行异步通信的标准方式，是支持Ajax的Web应用程序的一个核心技术。这个API的Microsoft实现方式称为XMLHTTP，它利用所谓的XMLHTTP协议来通信Ajax还需要用服务器端代码处理部分页面的回送和完整页面的回送，这包括服务器控件的事件处理程序和Web服务(Web服务详见第37章)。图39-1显示了这些技术如何在Ajax Web浏览器模型中联合使用，并与传统的Web浏览器模型进行比较。在AJAX推出之前，表39-1中的前四个技术(HTML、CSS、DOM和JavaScript)用于创建所谓的动态HTML(DHTML) Web应用程序。这些应用程序比较著名有两个原因：它们提供的用户界面要好得多；它们一般只能用于一种类型的Web浏览器。自DHTML推出以来，标准已有了改进，Web浏览器的相关标准级别也提高了。但是，它们仍有区别，Ajax解决方案必须考虑这些区别。也就是说，大多数开发人员实现Ajax解决方案还相当慢。只有开发出更抽象的Ajax架构(例如ASP.NET AJAX)，创建支持Ajax的网站才是企业级开发的一个可行选项。图 39-139.2 ASP.NET AJAX ASP.NET AJAX是Ajax架构的Microsoft实现方式，专用于ASP.NET开发人员。在ASP.NET的最新版本中，ASP.NET AJAX是ASP.NET核心功能的一部分。网站上可以用于以前的ASP.NET版本，包含相关的文档说明、论坛和示例代码，可以用于我们使用的ASP.NET版本。ASP.NET AJAX提供了如下功能： 服务器端架构允许ASP.NET Web页面响应部分页面的回送操作。 ASP.NET服务器控件便于实现Ajax功能。 HTTP处理程序允许ASP.NET Web服务在部分页面的回送操作中，使用JavaScript Object Notation(JSON)串行化功能与客户端代码通信。 Web服务支持客户端代码访问ASP.NET应用程序服务，包括身份验证和个性化服务。 网站模板可用于创建支持ASP.NET AJAX的Web应用程序。 客户端的JavaScript库对JavaScript语法进行了许多改进，还提供了许多代码，来简化Ajax功能的实现。这些服务器控件和服务器端的架构统称为ASP.NET Extensions。ASP.NET AJAX的客户端部分称为AJAX库。还可以从网站上下载另外两个软件包： ASP.NET AJAX Control Toolkit：这个下载软件包包含了由开发团体创建的其他服务器控件。这些控件是共享的，可以查看和修改它们。 Microsoft AJAX Library 3.5：这个下载软件包包含JavaScript客户端架构，它们由ASP.NET AJAX用于执行Ajax功能。如果开发的是ASP.NET AJAX应用程序，就不需要这个软件包。这个下载软件包适用于其他语言，例如PHP，使用与ASP.NET AJAX相同的代码基执行Ajax功能。它超出了本章的范围。提示：还有一个下载软件包称为Futures，过去用于给ASP.NET AJAX应用程序添加额外的、预先发布的功能或原始功能。但在编写本书时，不清楚这个下载软件包是否在VS 2008中得到支持，所以本章不介绍它。这两个下载软件包提供了功能丰富的架构，可以用于在自己的ASP.NET Web应用程序中添加Ajax功能。下面几节将介绍ASP.NET AJAX的各个组成部分。39.2.1 核心功能ASP.NET AJAX的核心功能分为两个部分：AJAX扩展和AJAX库。1. AJAX扩展在安装ASP.NET AJAX时，会在GAC中安装两个程序集： System.Web. Extensions.dll：这个程序集包含ASP.NET AJAX功能，包括AJAX扩展和AJAX库JavaScript文件，它们可以通过ScriptManager组件(稍后介绍)来获得。 System.Web. Extensions.Design.dll：这个程序集包含用于AJAX扩展服务器控件的ASP.NET Designer组件，这些服务器控件由ASP.NET Designer在Visual Studio或Visual Web开发程序中使用。ASP.NET AJAX中的许多AJAX扩展组件都涉及支持部分页面的回送和用于Web服务的JSON串行化。这包括各种HTTP处理程序组件和对已有ASP.NET架构的扩展。这些功能都可以通过网站的Web.config文件来配置。还有用于其他配置的类和属性。但大多数配置都是透明的，用户很少需要改变支持ASP.NET AJAX的网站模板提供的默认设置。与AJAX扩展的主要交互操作是使用服务器控件将Ajax功能添加到Web应用程序中。有几个服务器控件可以用各种方式增强Web应用程序。表39-2列出了一些服务器端组件。本章的后面将介绍它们。表 39-2控 件说 明ScriptManager这个控件是ASP.NET AJAX功能的核心，使用部分页面回送功能的每个页面都需要它。它的主要作用是管理对AJAX库JavaScript文件的客户端引用，AJAX库JavaScript文件位于ASP.NET AJAX程序集中。AJAX库主要由AJAX扩展服务器控件使用，这些控件会生成自己的客户端代码。这个控件还负责配置要在客户端代码中访问的Web服务。给ScriptManager控件提供Web服务的信息，就可以生成客户端类和服务器端类，来透明地管理与Web服务的异步通信。还可以使用ScriptManager控件维护对自己的JavaScript文件的引用，和Futures CTP中包含的其他JavaScript文件的引用UpdatePanelUpdatePanel控件非常有用，也许是最常用的ASP.NET控件。这个控件与标准的ASP.NET占位符类似，可以包含其他控件。更重要的是，在部分页面的回送过程中，它还把页面的一个部分标记为可以独立于其他页面部分来更新的区域。UpdatePanel控件包含的、产生回送操作的任意控件(如按钮控件)，都不会产生整个页面的回送操作，它们只执行部分页面的回送，只更新UpdatePanel的内容。在许多情况下，只需要这个控件实现AJAX功能。例如，可以把一个GridView控件放在UpdatePanel控件中，该控件的分页、排序和其他回送功能都在部分页面的回送过程中发挥作用UpdateProgress在部分页面的回送过程中，这个控件可以为用户提供反馈。在更新UpdatePanel时，可以为要显示的UpdateProgress控件提供一个模板。例如，可以使用浮点数的控件显示消息“Updating”，告诉用户应用程序正在忙。注意部分页面的回送不会干扰Web页面的其他区域，其他区域仍可以响应TimerASP.NET AJAX的Timer控件是使UpdatePanel定期更新的一种有效方式。可以把这个控件配置为定期触发回送操作。如果这个控件包含在UpdatePanel控件中，则每次触发Timer控件时，都会更新该UpdatePanel控件。Timer控件也有关联的事件，所以可以执行定期的服务器端处理AsyncPostBackTrigger这个控件可以在未包含在UpdatePanel中的控件里触发UpdatePanel的更新操作。例如，可以在Web页面的其他地方放置一个下拉列表，来更新包含GridView控件的UpdatePanelAJAX扩展还包含ExtenderControl抽象基类，来扩展已有的ASP.NET服务器控件。它由ASP.NET 2.0 AJAX Futures CTP中的各种类使用，如后面所述。2. AJAX库在支持ASP.NET AJAX的Web应用程序中，AJAX库包含的JavaScript文件由客户端代码使用。在这些JavaScript文件中包含许多功能，其中一些是改进JavaScript语言的通用代码，一些则专用于Ajax功能。AJAX库包含的功能彼此互为基础，如表39-3所示。表 39-3功 能 层说 明浏览器兼容性AJAX库的最底层代码根据客户机的Web浏览器来映射各种JavaScript功能，这是必需的，因为JavaScript在不同浏览器中的实现方式是有区别的。提供这个功能层，其他层上的JavaScript代码就不必考虑浏览器的兼容性了，我们也可以编写独立于浏览器、在所有客户机环境中工作的代码核心服务这一层包含对JavaScript语言的增强，尤其是OOP功能。使用这一层的代码，可以使用JavaScript脚本文件定义命名空间、类、派生类和接口。C#开发人员对此特别感兴趣，因为它使JavaScript代码的编写非常类似于用C#编写.NET代码，且鼓励代码的重用基类库客户基类库(BCL)包含许多JavaScript类，它们为AJAX库层次结构中下层的类提供了底层功能。这些类中的大多数都不能直接使用联网联网层上的类允许客户端代码异步调用服务器端代码。这一层包含的基本架构可以调用URL，响应回调函数的结果。在大多数情况下，这些功能都不能直接使用，而应使用封装了该功能的类。这一层还包含用于JSON串行化和并行化的类，大多数联网类都在客户端的System.Net命名空间中用户界面这一层包含的类抽象了用户界面元素，如HTML元素和DOM事件。可以使用这一层的方法和属性编写独立于语言的JavaScript代码，来处理客户机上的Web页面。用户界面类包含在System.UI命名空间中控件AJAX库的最后一层包含最高级代码，它们提供了Ajax操作和服务器控件功能。这包括动态生成代码，用于在客户端的JavaScript代码中调用Web服务AJAX库可以用于扩展和定制支持ASP.NET AJAX的Web应用程序的操作，但注意，不一定要这么做。要想在应用程序中不使用任何附加的JavaScript，还有很长的路要走，只有需要更高级的功能，才需要这么做。如果要编写附带的客户端代码，使用AJAX库提供的功能会比较容易完成任务。39.2.2 ASP.NET AJAX Control ToolkitAJAX Control Toolkit是附加服务器控件的一个集合，包括由ASP.NET AJAX团体编写的扩展控件。扩展控件可以在已有的ASP.NET服务器控件中添加功能，一般是给它附带一个客户端操作。例如，AJAX Control Toolkit中的一个扩展器能在文本框中放置watermark文本，以扩展文本框控件，当用户还没有在文本框中添加任何内容时，就会显示该文本。这个扩展控件在服务器控件TextBoxWatermark中实现。使用AJAX Control Toolkit可以给站点添加许多功能，它们超出了核心下载包的范围。这些控件可以使浏览操作更有趣，也许能为增强Web应用程序提供许多新思路。但是，AJAX Control Toolkit独立于核心下载包，所以这些控件并没有获得与核心下载包中的控件相同的支持。39.3 使用ASP.NET AJAX前面介绍了ASP.NET AJAX的组件部分，下面就开始探讨如何使用它们增强网站。本节将讨论支持ASP.NET AJAX的Web应用程序如何工作，如何使用该软件包中的各种功能。首先仔细研究一个简单的应用程序，然后在后续的章节中添加其他功能。39.3.1 ASP.NET AJAX网站示例ASP.NET AJAX模板包含了ASP.NET AJAX的所有核心功能。也可以使用AJAX Control Toolkit Web Site模板，以包含AJAX Control Toolkit中的控件。本示例要在C:ProCSharpChapter39目录中创建一个使用默认ASP.NET Web Site模板的新网站PCSAjaxWebApp1。修改Default.aspx中的代码：Pro C# ASP.NET AJAX SamplePro C# ASP.NET AJAX SampleThis sample obtains a list of primes up to a maximum value.Maximum:Result:Panel render time: Updating.Page render time: 切换到设计视图(注意ASP.NET AJAX控件，如UpdatePanel和UpdateProgress，有可视化的设计组件)，双击Calculate按钮，添加一个事件处理程序。修改代码，如下所示：protected void GoButton_Click(object sender, EventArgs e)int maxValue = 0;System.Text.StringBuilder resultText = new System.Text.StringBuilder();if (int.TryParse(MaxValue.Text, out maxValue)for (int trial = 2; trial = maxValue; trial+)bool isPrime = true;for (int divisor = 2; divisor = Math.Sqrt(trial); divisor+)if (trial % divisor = 0)isPrime = false;break;if (isPrime)resultText.AppendFormat(0 , trial);elseresultText.Append(Unable to parse maximum value.);ResultLabel.Text = resultText.ToString();保存修改的内容，按下F5，运行项目。如果有提示，就在Web.config中启动调试功能。在显示如图39-2所示的Web页面时，注意两个显示时间是相同的。（点击查看大图）图 39-2单击Calculate按钮，显示小于等于2500的素数。除非在较慢的机器上运行，否则应立即得到结果。注意显示时间现在已经不同了，只有UpdatePanel中的显示时间改变了，如图39-3所示。（点击查看大图）图 39-3最后，在最大值中添加一些0，引入一个处理延迟(在较快的PC上添加三个0就足够了)，再次单击Calculate按钮。这次在显示结果之前，注意UpdateProgress控件显示一个部分透明的反馈消息，如图39-4所示。（点击查看大图）图 39-4 更新应用程序时，页面仍是可以响应的。例如，可以滚动页面。提示：更新完成时，浏览器的滚动位置设置为单击Calculate按钮之前的地方。在大多数情况下，部分页面的更新会很快执行完，这非常有利于可用性。关闭浏览器，返回Visual Studio。39.3.2 支持ASP.NET AJAX的网站配置学习了一个简单的支持ASP.NET AJAX的Web应用程序之后，就可以研究它的工作原理了。首先看看应用程序的Web.config文件，尤其是的配置段中的如下两个代码块：.中配置段的代码确保，ASP.NET AJAX程序集System.Web. Extensions.dll从GAC中加载。中配置元素的代码引用这个程序集，将它包含的控件（在System.Web.UI和System.Web.UI.WebControls命名空间中）关联到标记前缀asp上。这两个配置段对于所有支持ASP.NET AJAX的Web应用程序都是必需的。下面的两段和也是ASP.NET AJAX功能所需要的。段定义了三项内容：第一，Web服务.asmx的处理程序用System.Web. Extensions命名空间中的一个新类替代。这个新类可以通过AJAX库处理来自客户端调用的请求，包括JSON串行化和并行化。第二，添加一个处理程序，以使用ASP.NET应用程序服务。第三，给ScriptResource.axd资源添加一个新的处理程序。这个资源用于ASP.NET AJAX程序集中的AJAX库JavaScript文件，这样这些文件就不需要直接包含在应用程序中了。.段添加了一个新的HTTP模块，它在Web应用程序中添加了HTTP请求的其他处理代码。这将支持部分页面的回送。. 其他的配置设置是通过设置来确定的，设置是的第一个子元素。这一段这里没有列出，它必须包含进来，以便使用和段。提示：段没有包含在默认的ASP.NET Web Site配置文件中，详见下一节。下一个配置段包含的设置与IIS 7 Web服务器相关，如果使用IIS的早期版本，就不需要这一段。这里没有列出这一段。最后是一个段：包含这段是为了确保与ASP.NET AJAX的旧版本兼容，除非安装了ASP.NET AJAX 1.0版本，否则它不会有影响。如果安装了1.0版本，这段就会启动第三方控件，绑定到ASP.NET AJAX的最新版本上。1. 其他配置选项段包含的设置为ASP.NET AJAX提供了其他配置，这些配置都是可选的。在默认的ASP.NET Web应用程序模板中不包含它们，可以用这个配置段添加的大多数配置都与Web服务相关，包含在元素中，该元素放在元素中。首先，可以添加一段，通过Web服务访问ASP.NET身份验证访问(也可以选择强制SSL)：接下来，通过profile Web服务，启用和配置对ASP.NET个性化功能的访问。最后一个与Web服务相关的设置是通过角色Web服务启用和配置对ASP.NET角色功能的访问。最后，段包含一个元素，允许配置异步通信的压缩和缓存：2. AJAX Control Toolkit的其他配置要使用AJAX Control Toolkit中的控件，可以在web.config中添加如下配置：.这将工具集中的控件映射到ajaxToolkit标记前缀上。这些控件包含在AjaxControl- Toolkit.dll程序集中，该程序集在Web应用程序的/bin目录下。还可以使用指令在Web页面上注册控件。39.3.3 添加ASP.NET AJAX功能一旦通过网站模板将网站配置为使用ASP.NET AJAX，或手工配置新ASP.NET网站或已有的ASP.NET网站，在网站上添加AJAX功能的第一步是在Web页面上添加一个ScriptManager控件，之后，添加UpdatePanel等服务器控件，以启用部分页面的显示功能，再添加Futur