Ajax技术全解之二
2024-09-01 08:30:36
供稿：网友
术语Ajax用来描述一组技术，它使浏览器可以为用户提供更为自然的浏览体验。在Ajax之前，Web站点强制用户进入提交/等待/重新显示范例，用户的动作总是与服务器的“思考时间”同步。Ajax提供与服务器异步通信的能力，从而使用户从请求/响应的循环中解脱出来。借助于Ajax，可以在用户单击按钮时，使用JavaScript和DHTML立即更新UI，并向服务器发出异步请求，以执行更新或查询数据库。当请求返回时，就可以使用JavaScript和CSS来相应地更新UI，而不是刷新整个页面。最重要的是，用户甚至不知道浏览器正在与服务器通信：Web站点看起来是即时响应的。
虽然Ajax所需的基础架构已经出现了一段时间，但直到最近异步请求的真正威力才得到利用。能够拥有一个响应极其灵敏的Web站点确实激动人心，因为它最终允许开发人员和设计人员使用标准的HTML/CSS/JavaScript堆栈创建“桌面风格的（desktop-like）”可用性。
与传统的web应用比较
传统的web应用允许用户填写表单(form)，当提交表单时就向web服务器发送一个请求。服务器接收并处理传来的表单，然后返回一个新的网页。这个做法浪费了许多带宽，因为在前后两个页面中的大部分HTML代码往往是相同的。由于每次应用的交互都需要向服务器发送请求，应用的响应时间就依赖于服务器的响应时间。这导致了用户界面的响应比本地应用慢得多。
与此不同，AJAX应用可以仅向服务器发送并取回必需的数据，它使用SOAP或其它一些基于XML的web service接口，并在客户端采用JavaScript处理来自服务器的响应。因为在服务器和浏览器之间交换的数据大量减少，结果我们就能看到响应更快的应用。同时很多的处理工作可以在发出请求的客户端机器上完成，所以Web服务器的处理时间也减少了。
Ajax的工作原理
Ajax的核心是JavaScript对象XmlHttpRequest。该对象在Internet Explorer 5中首次引入，它是一种支持异步请求的技术。简而言之，XmlHttpRequest使您可以使用JavaScript向服务器提出请求并处理响应，而不阻塞用户。
在创建Web站点时，在客户端执行屏幕更新为用户提供了很大的灵活性。下面是使用Ajax可以完成的功能：
动态更新购物车的物品总数，无需用户单击Update并等待服务器重新发送整个页面。
提升站点的性能，这是通过减少从服务器下载的数据量而实现的。例如，在Amazon的购物车页面，当更新篮子中的一项物品的数量时，会重新载入整个页面，这必须下载32K的数据。如果使用Ajax计算新的总量，服务器只会返回新的总量值，因此所需的带宽仅为原来的百分之一。
消除了每次用户输入时的页面刷新。例如，在Ajax中，如果用户在分页列表上单击Next，则服务器数据只刷新列表而不是整个页面。
直接编辑表格数据，而不是要求用户导航到新的页面来编辑数据。对于Ajax，当用户单击Edit时，可以将静态表格刷新为内容可编辑的表格。用户单击Done之后，就可以发出一个Ajax请求来更新服务器，并刷新表格，使其包含静态、只读的数据。
Ajax的优势
1、减轻服务器的负担。因为Ajax的根本理念是“按需取数据”，所以最大可能在减少了冗余请求和响影对服务器造成的负担；
2、无刷新更新页面，减少用户实际和心理等待时间；
首先，“按需取数据”的模式减少了数据的实际读取量，打个很形象的比方，如果说重载的方式是从一个终点回到原点再到另一个终点的话，那么Ajax就是以一个终点为基点到达另一个终点；
图5－1
图5－2
其次，即使要读取比较大的数据，也不用像RELOAD一样出现白屏的情况，由于Ajax是用XMLHTTP发送请求得到服务端应答数据，在不重新载入整个页面的情况下用Javascript操作DOM最终更新页面的，所以在读取数据的过程中，用户所面对的也不是白屏，而是原来的页面状态（或者可以加一个LOADING的提示框让用户了解数据读取的状态），只有当接收到全部数据后才更新相应部分的内容，而这种更新也是瞬间的，用户几乎感觉不到。总之用户是很敏感的，他们能感觉到你对他们的体贴，虽然不太可能立竿见影的效果，但会在用户的心中一点一滴的积累他们对网站的依赖。
3、更好的用户体验；
4、也可以把以前的一些服务器负担的工作转嫁到客户端，利于客户端闲置的处理能力来处理，减轻服务器和带宽的负担，节约空间和带宽租用成本；
5、Ajax由于可以调用外部数据；
6、基于标准化的并被广泛支持和技术，并且不需要插件或下载小程序；
7、Ajax使WEB中的界面与应用分离（也可以说是数据与呈现分离）；
8、对于用户和ISP来说是双盈的。
Ajax的问题
1、一些手持设备（如手机、PDA等）现在还不能很好的支持Ajax；
2、用JavaScript作的Ajax引擎，JavaScript的兼容性和DeBug都是让人头痛的事；
3、Ajax的无刷新重载，由于页面的变化没有刷新重载那么明显，所以容易给用户带来困扰――用户不太清楚现在的数据是新的还是已经更新过的；现有的解决有：在相关位置提示、数据更新的区域设计得比较明显、数据更新后给用户提示等；
4、对流媒体的支持没有FLASH、Java Applet好；
