5.4 了解AJAX应用程序与ASP.NET AJAX

本节将叙述在开发AJAX时，程序开发人员所将面临之议题，并针对AJAX开发实际上会涉及哪些技术，最后针对这些议题与技术集成，说明微软提供的ASP.NET AJAX解决方案其架构组成，看看ASP.NET AJAX能够为开发人员带来何种帮助与效益。

5.4.1 AJAX所针对的开发议题

用户与开发人员皆能体验到传统网页应用程序Request-Response模式所造成的局限性，因为网页是无状态的，故每当网页数据或用户接口需要变更时，必须将整个网页Post Back到服务器更新，意即页面必须进行Client端与Server端之间的往返，尤其是当Client与Server之间若有极大量的数据过度频繁地往返时，用户将会感受到非常漫长的等待。

另一个议题是网页浏览器中的HTML控件相较于桌面应用程序的Rich UI显得能力有限。很多浏览器都包含增强的HTML控件，但是这些增强的HTML控件都针对特定浏览器而实现，因此想要获得这些增强HTML控件的Rich UI，网页应用程序开发人员必须针对特定浏览器创建应用程序，这将会非常复杂，故很多开发人员避免在他们网页之中建立以特定Client端特征的功能，因此用户发现网页应用程序的吸引力相较于其他类型的应用程序要小得多。AJAX开发方法是针对以上两个开发议题提供解决方案的。

5.4.2 AJAX技术概念

AJAX建立的一个核心概念：使用异步调用，并结合XML方式传输数据与大量使用Client Script。”

在AJAX技术中，程序开发人员能够以Client端Script方式通过XMLHTTP来进行异步的Web服务调用，而XMLHTTP通信协议常用于将信息封装成XML数据类型在网络间传送，大多数的浏览器都实现XMLHTTP类，而此类用于建立一个进行远程调用与数据收发的proxy对象。通过异步方式进行调用，网页中的数据与用户接口不需要进行Client端与Server端之间的往返，结果是具有较少的数据传送与较佳的应用程序性能，异步调用能够使得网页应用程序能够有更加良好的反应性，因为用户能够在调用工作仍在Server端执行的同时，而在Client端浏览器继续进行工作。

另一方面AJAX大量使用Client端Script，特别是JavaScript。JavaScript是用于进行远程调用、执行Client端应用程序的处理与建立增强的用户接口功能。

AJAX的解决方案使用JavaScript并搭配其他数种Client端类型技术，包括了以下内容。

l 浏览器的Document Object Model（DOM）：DOM将这些元素呈现在HTML网页中成为标准的对象组（如Document、Windows，等等），并且能够通过代码方式来操作它们。

l 动态HTML（DHTML）：当用户在页面中输入时，DHTML通过Client端的Script方式延伸了HTML互动的反应能力，并且使其变得更容易，还不需要往返的行为。

l 行为（Behaviors）：这是一种程序化包装在用户接口中的操作（如拖曳（drag and drop）行为），并且能够与网页元素产生连接。

l 组件（Component）：是一种能够提供扩充Client端用户接口功能特点的定制JavaScript对象。

JavaScript结合这些Client端技术后，使得程序开发人员足以建立能够媲美桌面型应用程序的用户接口功能特点，在此有两个例子可提供给大家参考。

（1）微软Virtual Earth网站：一个提供电子地图的网站。

（2）微软Outlook Web Access：一种通过Web浏览器收发E-mail的Client端使用接口。

以上两个例子皆展示出以AJAX技术所建立丰富的用户接口与高性能应用程序典范。

然而使用这些技术来构建AJAX应用程序是复杂的，直到现在程序开发人员仍必须手动建立事件处理、消息传递和建立丰富用户接口所需要的细节。而且因为JavaScript不是面向对象语言（OOP），故它没有强类型、命名空间、异常事件处理与其他OOP特点。功能特点，程序开发人员还经常必须以其他的语言来撰写内建于其中的专属基础架构程序代码。

5.4.3 ASP.NET AJAX架构提供一个AJAX新途径

ASP.NET如何能够利用AJAX应用程序的威力？微软的答案是：“ASP.NET AJAX”。ASP.NET AJAX提供所有AJAX的能力，但是却进一步扩充其概念，并且大幅降低AJAX应用程序开发的复杂性。ASP.NET AJAX同时提供了Client端与Server端两方面的能力，如图5-4所示。

图5-4 ASP.NET AJAX架构图

ASP.NET AJAX架构说明如下：

8Client端方面

ASP.NET AJAX在Client端的AJAX解决方案正式名称为“Microsoft AJAX Library”。Microsoft AJAX Library实际上是由一堆JavaScript（.js）所组成的Script Library函数库，详细的JavaScript文件名称如下：

l MicrosoftAjax.debug.js

l MicrosoftAjax.js

l MicrosoftAjaxTimer.debug.js

l MicrosoftAjaxTimer.js

l MicrosoftAjaxWebForms.debug.js

l MicrosoftAjaxWebForms.js

然而上面6个程序实际上只能算是3个而已，因为以 .debug.js结尾的程序名称是为了除错方便而用的，例如MicrosoftAjax.debug.js与MicrosoftAjax.js二者程序功用是相同的，前者为Debug版本，后者为Release版本。

Microsoft AJAX Library本身并非单纯的JavaScript，而是在JavaScript中加入了面向对象特性，如类型系统、数据类型、命名空间、事件，等等。这些特性给予程序开发人员一个熟悉的程序撰写模式，使得您能够开发出更高品质、具有维护性与可重复使用性的程序代码，实际功能特征说明如下：

l 浏览器兼容层（Browser compatibility layer）

浏览器兼容层是负责处理ASP.NET AJAX的JavaScript在各种浏览器上执行的兼容层，以确保JavaScript在常见的浏览器（如IE、Firefox、Safari）上能够正常执行。

l ASP.NET AJAX核心服务（Core Serivces）

ASP.NET AJAX核心服务是指针对JavaScript所做的扩充，例如类、命名空间、事件处理、继承、数据类型与对象序列化。

l ASP.NET AJAX基础类库

类库包括了Component Class、StringBuilder Class及扩充的事件处理。

l 网络层（Networking layer）

网络层负责处理以Web为基础的服务与应用程序之间的沟通，以及管理异步远程调用方法。

l JavaScript Library对Release与Debug模式的支持

对于JavaScript Library的支持包括两种形式：一是嵌入在assembly组件中，另一种是独立的JavaScript文件（.js）。但JavaScript Library嵌入在assembly组件中的优点是部署容易，并且可以避免版本问题。

l Client端对验证及用户设置文件的访问

支持Client Script对服务器端的验证（Authentication）及用户设置文件（Profile）的访问，甚至对于不是用ASP.NET建置的Web应用程序也一样支持，只要它们是通过Microsoft AJAX Library来访问服务器端的验证及用户设定。

8Server端方面

ASP.NET AJAX在Server端方面亦包括了丰富的服务器组件功能特点，以补充ASP.NET AJAX在Client Script Libraries函数库上的不足，包括了：

l ASP.NET AJAX服务器控件

这些ASP.NET AJAX服务器控件能够发出Client端的Script，以便您使用ASP.NET AJAX功能特点，如果您已经非常熟悉服务器端程序开发，这些服务器控件对您将会非常有用，或者您不必手动创建ASP.NET AJAX的Client端Scripts。

l Web服务

有一些Web服务能够为ASP.NET AJAX应用程序加入非常有用的服务器端功能特点，如ASP.NET 2.0的Profiles。

8ASP.NET AJAX Control Toolkit

然而，在Client端的Microsoft AJAX Library与Server端的ASP.NET AJAX Extensions之外，还有另外一个套件叫“ASP.NET AJAX Control Toolkit”，它是由一堆针对各种不同用途事先创建好的AJAX控件，并且可免费使用，目的是要让程序员简化AJAX程序开发。直接使用这些预先创建好的AJAX控件，省却了从零开始手工打造AJAX相关功能的麻烦，算是一些贴心的AJAX控件小工具的集合。

ASP.NET AJAX Control Toolkit目前提供了34个相关的控件，并且它仍在持续扩充中，预计未来能扩充到50～100个控件，以下举几个控件来做功能说明。

表5-1 ASP.NET AJAX Control Toolkit功能说明

控件	说明
Accordion	可展开与收合折叠的数个长方形区块，里面可以放不同的Item项目，类似Outlook接口的功能
AlwaysVisibleControl	可将控件固定在Page页面中，不会被任何的HTML背景或内容所覆盖，永远保持在最上层
Animation	可以针对特定控件制造出动画效果，例如：Move、Resize、Fade与Color等变化效果
AutoComplete	TextBox自动完成功能（需搭配Web Services）
Calendar	附加一个突显的Client端日历控件功能到TextBox上，点击TextBox就会出现日历控件，供你选择日期
CascadingDropDown	联动式的AJAX DropDownList
CollapsiblePanel	使Panel扩展具备收合与折叠显示的功能