asp.net Ajax的应用

AJAX并不是一项新技术，它的本质是结合JavaScript语言、css样式以及异步传输等编程技术来创建动态网站。AJAX与其说是一种技术，倒不如说是一种Web开发理念，它的出现，使无刷新技术得到广泛应用和推广。目前使用AJAX理念制作的网站中，比较有代表性的主要有Google主页、Google Suggest、Google Maps、Gmail等，它们从视觉和可用性上大大满足了用户的需要。本章将结合ASP.NET 3.5技术与AJAX理念来学习AJAX在ASP.NET平台中的使用。

　 1、AJAX基本思想

　　AJAX改变了传统的Web中客户端和服务器的“请求→等待→请求→等待”模式。在AJAX理念中，它将页面划分为多个部分，当用户对其中的一部分进行数据操作时，Web页面的这一部分会立即向服务器发送请求，而用户可以对Web页面中的其他数据进行操作，无需等待服务器发送回的处理结果，从而减少了用户的等待时间和服务器与客户端之间的“请求→回发”时间。

　　2、应用场景

　　AJAX最主要的特点是异步通信、按需求读取数据和动态更新Web页面，其功能十分强大，但是AJAX并不适用于所有情况，它所适用的环境，常常是客户端与服务器端频繁的交互数据、需要动态更新Web页面等情况。对于客户端与服务器端之间极少进行数据交互或客户端Web页面并非动态实时更新的情况，应该尽量避免使用AJAX。这是为什么呢？因为使用AJAX时，在提供了良好的用户体验的同时，也增加了服务器端的压力，服务器端需要花费大量的资源来进行数据处理，因此AJAX只有在适当的地方使用，才能发挥出它的优势。

　　（1）表单数据的交互。

　　在传统的Web开发中，数据通过表单提交。在文本框输入内容后单击提交按钮，客户端页面中的数据会发送到服务器端。等服务器端处理完数据之后，再将处理的结果发送到客户端，这个时候页面会刷新，用户需要花费大量的时间来等待处理的结果。使用AJAX之后，单击提交按钮，立刻进行异步处理，并在页面上快速显示了更新后的结果，这时AJAX只会控制做数据提交的那部分刷新，而整个Web页面不会刷新，在服务器处理数据时，用户可以浏览Web页面中的其他信息，而不再需要面对一个空白页面等待。

　　（2）快速的用户与用户之间的交流响应。

　　许多人通过Web进行交流时，经常需要不停的刷新页面，从而将用户最新发表的看法呈现出来。特别是在使用Web聊天室时，如果使用传统的开发技术来实现，用户需要不停地刷新页面。使用AJAX之后，用户就可以省去这些操作，AJAX会将最新的发言动态地刷新出来，使网络中的用户可以及时看到。用户可以专心地来进行指定话题的思考与讨论。

　　（3）对数据进行过滤和操纵相关数据的场景。

对数据使用过滤器，按照时间排序，或者按照时间和名称排序，开关过滤器等。任何要求具备很高交互性数据操纵的场合都应该用JavaScript，而不是用一系列的服务器请求来完成。在每次数据更新后，再对其进行查找和处理需要耗费较多的时间，而AJAX可以加速这个过程。

　　（4）数据验证。

　　数据验证是Web开发中经常会遇到的问题。数据验证通常有两种方式：一种是直接填写，然后提交表单，这种方式需要将整个页面提交到服务器端进行验证，整个过程不仅时间长而且造成了服务器不必要的负担；第二种方式是改进了的验证过程，用户可以通过单击相应的验证按钮，打开新窗口查看验证结果，但是这样需要新开一个浏览器窗口，还需要专门编写验证的页面，比较耗费系统资源。使用AJAX技术，可以由XML HttpRequest对象发出验证请求，根据返回的HTTP响应判断验证是否成功，整个过程不需要弹出新窗口，也不需要将整个页面提交到服务器，快速而又不会加重服务器的负担。

　　3、开发模式

　　通过ASP.NET使用AJAX时，通常会有以下几种开发模式。

　　（1）XMLHttp+WebForm模式

XMLHttp + WebForm模式是ASP.NET下最原始的开发模式。这种模式直接利用JavaScript操作XMLHttp对象，发送异步请求到服务器端的Web窗体。服务器端页面接到请求，进行数据处理，并将处理结果返回给XMLHttp对象，最后用JavaScript言语代码将返回的结果显示出来。

　　（2）XMLHttp + HttpHandler模式

XMLHttp + HttpHandler模式是对XMLHttp + WebForm模式的改进，其客户端代码没有任何变化，而在服务器端使用HttpHandler来接收和处理异步请求信息，对于数据的处理使用HttpHandler的ProcessRequest方法来处理。

　　（3）ASP.NET回调模式

　　回调模式使用ICallbackEventHandler接口，通过实现GetCallbackResult()方法来实现回调，最后通过调用ClientScript.GetCallbackEventReference()方法实现AJAX效果，这样可以避免开发者直接操纵XMLHTTP对象，在一定程度上简化了AJAX的开发。

　　（4）AJAX框架模式

　　AJAX框架模式使用ASP.NET内容提供的框架集合来开发。这种框架比较多，如客户端框架Prototype，服务器端框架ASP.NET AJAX、Rad AJAX、AJAX.NET、ANTHEM.NET、 MAGIC AJAX.NET等。采用AJAX框架开发的效率比较高，代码稳定性好，但同时也容易受到框架的束缚。在这些框架中最常用的当属ASP.NET AJAX，其中包括客户端Microsoft AJAX library，服务器端的ASP.NET 2.0 AJAX Extensions，以及ASP.NET
AJAX Control Toolkit等，是一套完整的AJAX解决方案。

　　4、ASP.NET中的AJAX控件

　　（1）脚本管理控件（ScriptManger）

　　脚本管理控件主要用来管理页面中的脚本语言，在ASP.NET AJAX中具有非常重要的作用。ScriptManger控件只能在页面中使用一次，也就是说每个页面中只能放置一个ScriptManger控件。ScriptManger控件用来对页面进行全局管理，处理页面上的局部更新，同时生成相关的代理脚本语言代码，从而实现页面的异步通信，通过JavaScript语言对Web Service进行访问。

　　（2）更新区域控件（UpdatePanel）

　　更新区域控件主要用来控制页面中局部刷新的区域，页面中所有需要频繁与服务器端交互的操作都可以放在此控件内部。

使用UpdatePanel控件来限定页面刷新区域的好处是，凡是在UpdatePanel控件内部的操作，不会引起页面的整体刷新，它只会刷新UpdatePanel控件内部的内容。

　　

　　（3）脚本管理控件（ScriptMangerProxy）

　　在使用ASP.NET开发应用程序时，会经常使用母版页来对网站的风格进行统一布局，但是ScriptManger控件只能在页面中使用一次，当在母版页中使用了ScriptManger控件之后，在其他内容页面中就无法使用ScriptManger控件了，这样就妨碍了在内容页中使用无刷新技术。

　　（4）时间控件（Timer）

　　时间控件是用来设置页面定时刷新的控件，其用处比较广泛，但是在使用Timer控件来刷新页面时，总是会引起整个页面的刷新。在ASP.NET 3.5 AJAX中结合AJAX无刷新技术，解决了这个问题，开发人员可以在页面中随意使用Timer控件，而不用担心页面会整体刷新。

　　（5）更新进度控件（UpdateProgress）

　　更新进度控件的主要功能是在前台页面等待服务器回传数据的过程中呈现一个动画。有些时候，由于网络的问题，页面反应比较慢，从而使服务器回传的数据呈现在用户面前也比较慢，这个时候，用户需要花费比较长的时间来面对枯燥的页面，而UpdateProgress控件的出现使用户的等待不再枯燥，而且还能及时地了解到数据回传的进度。

　　5、异步调用Web Service和页面中的类方法

　　（1）异步调用Web Service

　　在ASP.NET AJAX中Web Service具有重要的作用，是ASP.NET AJAX服务中最受推崇的实现方式。Web Service的诞生是纯粹为了业务逻辑而设计的。在Web Service服务中，用户界面比较简单，没有像ASP.NET服务器控件那样提供过多的样式特征，它把精力都放在了程序逻辑实现上了，这与ASP.NET AJAX客户端编程模型所倡导的“将表现层和业务逻辑层彻底分开”的理念不谋而合。在Web Service服务中，客户端的ASP.NET AJAX框架用来处理程序所有的界面、与用户交互功能，服务器端则仅仅提供纯粹的数据，不涉及任何表现样式。

　　（2）调用页面中的类方法

　　对于Web Service服务对程序开发带来的方便显而易见，但是在使用ASP.NET来开发程序时，由于ASP.NET提供了服务器端开发模型，开发人员习惯了将处理事件直接写在页面的cs代码中，方便省事。ASP.NET AJAX在设计时充分考虑到了这种情况，允许ASP.NET AJAX调用页面中的类方法，来实现异步调用。

　　使用ASP.NET AJAX在客户端JavaScript中异步调用定义在ASP.NET页面中的方法，需要注意以下几点。

　　　　a、将该方法声明为公有（public）。

　　　　b、将该方法声明为类方法（C#中的static，VB.NET中的Shared），而不是实例方法。

　　　　c、为该方法添加[WebMethod]属性。

　　　　d、将页面中ScriptManager控件的EnablePageMethods属性设置为true。

　　　　e、在客户端使用如下JavaScript语法调用该页面方法。

　　　　f、PageMethods.[MethodName](param1, param2 …, callbackFunction)

　　　 g、为客户端异步调用指定回调函数，在回调函数中接收返回值并进一步处理。