基于AJAX 的Web 无刷新页面快速更新数据方法.pdf

第 11 期 吕林涛等: 基于 AJAX 的 Web 无刷新页面快速更新数据方法 1·99 · 基于 AJAX 的 Web 无刷新页面快速更新数据方法* 吕林涛, 万经华, 周红芳 ( 西安理工大学 计算机科学与工程学院, 陕西 西安 710048) 摘 要: 针对 B/ S 应用中的 Web 服务器与浏览器间频繁操作导致 Web 应用执行速度慢的问题 , 提出了一种基 于 AJAX 的 Web 无刷新页面更新数据的方法。 关键词: AJAX; XMLHttpRequest; 异步交互 中图法分类号: TP311 文献标识码 : A 文章编号 : 1001- 3695( 2006) 11- 0199- 02 Research of Not Refurbishing and Updating Data Method in AJAX Web Application LV Lin-tao, WAN Jing-hua, ZHOU Hong-fang ( Institute of Computer Science Engineering, Xi ’an University of Technology, Xi ’an Shanxi 710048, China) Abstract: In view of the slow speed arising from frequent interactions between Web server and the browser, an updating me- thod without refreshing Web pages based on AJAX is proposed. Key words: AJAX; XMLHttpRequest; Interact Asynchronously 在传统的交互方式中, 由用户触发一个 HTTP 请求到服务 供服务的同时也导致了另外的问题: 如果一个浏览器需要向 器, 服务器对其进行处理后再返回一个新的 HTML 页到客户 Web 服务器提出一系列相互有关联的请求, 由于服务器不适 端, 每当服务器处理客户端提交的请求时, 客户只能空闲等待。 合存放浏览器的状态信息, 浏览器每次请求都不得不向 Web 即使从服务器端得到很简单的一个数据, 都要返回一个完整的 服务器发送自身的状态信息, Web 服务器每次响应均作为一 HTML 页, 而用户每次要浪费时间和带宽去重新读取整个页 个新的请求处理, 如果涉及数据库处理, Web 服务器每次都得 面, 从而降低了 Web 应用的执行速度。针对这一缺点, 本文提 向数据库提出查询请求。数据库查询结果的分页显示就是一 出一种 Web 无刷新页面更新数据方法是十分必要的。 个典型的例子, 由于缺乏 XML 协议以及 IE 浏览器对它的支 持, Web 服务器向浏览器传递的数据只能是以单纯的 HTML 1 传统的 We b 应用模型 页面的形式传递, 为了将同一查询结果放在不同的页面上, 必 传统的 Web 应用模型工作原理是, 大部分界面上的用户 须将结果分为几个不同查询来对待, 不同的页面信息由隐藏字 动作触发一个连接到 Web 服务器的 HTTP 请求, 服务器完成 段随页面传给 Web 服务器。该方法具有以下缺点: ①同样的 一些处理, 如接收数据、处理计算等, 再访问其他数据库系统, 数据反复地在网络上传输; ②同样的数据查询要重复地在数据 最后返回一个 HTML 页面到客户端, 如图