基于Ajax技术的Web 2.0开发应用

0 引言

随着互联网的不断发展和信息量的剧增，如何使Web响应更加灵敏，数据传输更加快捷，已成为当今关注的热点。应用系统所采用的技术也由早期的C／S(Client／Server)模式向基于B／S(Browser／Server)的应用模式进行转变。这种转变避免了繁琐的部署工作，同时也体现了瘦客户的开发理念，但同步交互方式带来客户端响应速度慢的问题始终困扰着最终用户。基于Ajax(Asynchronous JavaScript. and XML)的Web 2.0技术改变原有的同步交互为异步交互方式，使页面在后台按需获取数据，这样不仅节省了带宽，更加大大提升了用户体验。

Ajax是新兴网络开发技术的象征，是Web 2.0时代的代表。最关键的是颠覆了传统Web与服务器的交互模式，这种思维模式的转变为Web发展提供了更广阔的前景。Ajax是一个前台工具，在后台可以使用各种服务器语言，比如：.NET，PHP，Java等。Ajax是集合了多种技术，提高互联网性能的一种关键技术。Ajax理念的出现，揭开了无刷新更新页面时代的序幕，并有代替传统Web开发中采用form(表单)递交方式更新Web页面的趋势，其可以算是一个里程碑。

1 Ajax的工作原理

在传统的浏览器与服务器的交互方式中“采用同步方式”由用户触发一个HTTP请求到服务器，服务器对其进行处理后再返回一个新的Web页到浏览器。每次应用的交互都需要向服务器发送请求，应用的响应时间就依赖于服务器的响应时间。当服务器正在处理的时候，用户只是在等待，这样，不会产生很好的用户体验；而在前后两个页面中的大部分HTML代码往往是相同的，也浪费了许多带宽资源。

现在使用的Ajax技术是将几种成熟技术按一定的方式结合在一起，通过协作发挥各自作用，包括：使用XHTML和CSS标准化呈现；使用DOM实现动态显示和交互；使用XML和XSLT进行数据交换与处理；使用XMLHttpRequest进行异步数据读取；用JavaS-cript绑定和处理所有数据。

Ajax需要一个稳定、响应及时的服务器向引擎发送内容，作为必要的服务端处理逻辑，确保向Ajax引擎发送的数据格式是正确的。

Ajax的工作原理相当于在用户和服务器之间加了一个中间层Ajax引擎，从而实现用户操作与服务器响应的异步化。这样把以前的一些服务器负担的工作转嫁到客户端，利于客户端闲置的处理能力来处理，减轻服务器和带宽的负担，从而达到节约ISP的空间及带宽租用成本的目的。但并不是所有的用户请求都提交给服务器，像一些数据验证和数据处理等都交给Ajax引擎自己来做，只有确定需要从服务器读取新数据时再由Ajax引擎代为向服务器提交请求。传统的Web应用程序模型和基于Ajax的Web应用模型分别如图1，图2所示。

由于Ajax技术的结构特点，可以为ISP、开发人员、终端用户带来可见的便捷：

(1)按需获取数据。这是Ajax的根本理念，Ajax的原则是“按需取数据”，这样可以最大程度地减轻冗余请求，减轻服务器的负担。

(2)无刷新更新页面，减少用户心理和实际的等待时间。这是Ajax最大的特点，用户无需刷新页面便可向服务器传输和读写数据。

(3)基于标准化的并被广泛支持的技术。Ajax包含的技术都是各自领域强有力的技术，组合之后的功能更加强大。

(4)给用户带来更好的体验。Ajax使得在Web上运行软件的感受，越来越接近于本机上运行的效果。

(5)可以调用外部数据，取得足够权限后，能轻易地实现数据聚合。

(6)进一步促进页面呈现与数据的分离。

2 Ajax技术在Web 2.0中的应用

下面简要介绍利用Ajax技术的无需页面提交而能与服务器交互，即时从服务器获取数据并显示出来的特性，实现自动完成(字典)功能的过程。自动完成功能实现的主要目的是帮助用户快速准确的输入内容，就是用户在输入框中输入一些检索词，根据用户所输入的信息，从后台数据库以LIKE方式查询，同时在输入框下方显示相应的提示信息，进而帮助用户快速的搜索。在很多系统中都需要实现自动完成的功能，但在Ajax技术出现之前，一般只有桌面应用程序才能实现类似的功能。Web应用程序只能借助于浏览器自身的自动完成功能来实现，而浏览器的自动完成功能是比较有限的，它只能提示用户输入过的信息。如果自动完成的数据是来自于服务器端的，Ajax则是最好的选择。比如用户只记住了要查询信息的前面几个字，而记不清全名，这样要查询到所要的信息就比较困难。使用Ajax技术后，在用户输入的同时，输入框下方可以给出与已输入信息相匹配的提示来辅助用户输入，这样用户进行查询的速度和准确率会大大提高，也可以有效地改善用户体验。下面利用Ajax(.net)技术实现一个学校信息查询的自动完成功