（计算机科学与技术专业论文）一种基于ajax技术的web应用框架的设计与实现.pdf

北京邮电大学硕士研究生学位论文a j a x 框架的设计与实现 a j a x 框架的设计与实现 摘要 随着w e b 技术的发展和人们对w e b 使用的要求越来越高，传统的 交互方式一方面使用户觉得难以使用、体验感太差，另一方面也不利 于开发人员进行开发和维护。所以当a j a x 概念被提出，就立即得到 了广泛关注和响应。由于它可以构建快捷和灵活的应用程序，马上就 被想构建复杂和动态网站的人们应用，并取得了很好的效果。 a j a x 技术还处在发展阶段，虽然它加强了w e b 应用的能力，但 还是存在一些问题限制了它的应用。现在一般把各种w e b 技术融合起 来形成框架，提供给人们使用。框架内置了各种特性，可以帮助人们 进行开发、部署和维护，所以已经成为主流的a j a x 发展方式。本论 文介绍了现有a j a x 技术和框架的发展现状，分析并总结了a j a x 框架 设计理论和方法，并在此基础上开发了实际框架以支持w e b 应用。 本框架分为基础模块、控制模块、可视化模块和辅助模块四个部 分。基础模块主要用来进行加强面向对象机制和实现包加载机制。控 制模块完成如异步通讯等应用。可视化模块可以进行页面的组件生成 与管理。辅助模块则提供常用的类型或函数便于其它模块调用。 论文最后以“时力永联w e bm a i l 系统项目为例，通过实例详 细描述了本框架在项目中的应用成果。 关键字：a j a xw e b 框架异步通讯 北京邮电大学硕士研究生学位论文 a j a x 框架的设计与实现 d e s i g na n di n 口l e 匝n t a t i o no fa j a x a b s t r a c t w i t ht h ed e v e l o p m e n to ft h ew e bt e c h n o l o g ya n dt h ed e m a n d o fp e o p l eb e c o m i n gh i g h e r ，t h et r a d i t i o n a li n t e r a c t i v em o d e l m a d eu s e r sf i n di td i f f i c u l tt ou s e ，o rw i t hb a de x p e r i e n c e ， a n dm a d et h ed e v e l o p e rf e e lh a r dt od e v e l o pa n dm a i n t a i nw i t h i t w h e nt h ea j a xc o n c e p tw a sp r o p o s e d ， i t i m m e d i a t e l y a t t r a c t e da t t e n t i o na n dg a i n e dl o t s o fr e s p o n s e a si tc o u l d b ef a s ta n df l e x i b l ef o rb u i l d i n gd y n a m i ca p p l i c a t i o n sw i t h a j a x ，a n dc o u l da c h i e v ef a s ta s y n c h r o n o u sc o m m u n i c a t i o n ，w h i c h w a sf i tf o rb u il d i n gc o m p l e xa n dd y n a m i cw e b ，a n dh a v ea c h i e v e d g o o dr e s u lt s a j a xw a sa c c e p t e da n du s e dw i d e l y a tp r e s e n t ，a j a xt e c h n o l o g yi ss t i l li nt h es t a g eo fr a p i d d e v e l o p m e n t ，a l t h o u g h i th a s i m p r o v e dw e ba p p l i c a t i o n c a p a b i l i t i e s t h e r ea r es t i l ls o m ep r o b l e m sl i m i t i n gt h ea j a x t e c h n o l o g ya p p l i c a t i o n s i no r d e rt os u p p o r tc r o s s - p l a t f o r m , c r o s s b r o w s e ra p p l i c a t i o n s ，a n dt of a c i l i t a t et h ei n t e g r a t i o n o fw e bt e c h n o l o g y ，n o wf r a m e w o r kw h i c he x p e n d e dj a v a s c r i p t 北京邮电大学硕士研究生学位论文a j a x 框架的设计与实现 l a n g u a g ew a sp r o v l d e dt ot n ep e o p l et ou s e i h echaracteristlasl 1 m w h i c hw e r eb u il t i nt h ef r a m e w o r kc a nh e l pp e o p l e d e v e l o p ， d e p l o ya n dm a i n t a i n ，a n di th a sb e c o m et h em a i n s t r e a mo fa j a x d e v e l o p m e n ta p p r o a c h t h i sp a p e ri n t r o d u c e st h ed e v e l o p m e n t s t a t u so fe x i s t i n gt e c h n o l o g ya n df r a m e w o r k so fa j a x ，a sw e l l a sas u m m a r yo fa j a xf r a m e w o r kd e s i g nt h e o r ya n dm e t h o d s ，a n d o nt h i sb a s i sb u il da s i m p l ef r a m e w o r kt os u p p o r tw e b a p p li c a ti o n s t h i sf r a m e w o r ki sd i v i d e di n t of o u n d a t i o n a lm o d u l e ， p r o g r a m m i n gm o d u l e ，v i s u a lm o d u l e a n ds u p p o r t i n gm o d u l e f o u n d a t i o n a l m o d u l e p r i m n r i l y i su s e dt o s t r e n g t h e n t h e o b j e c t o r i e n t e d m e c h a n i s ma n dp a c k a g e l o a d i n gm e c h a n i s m p r o g r a m m i n gm o d u l ec o m p l e t e sf u n c t i o n ss u c ha sa s y n c h r o n o u s c o m m u n i c a t i o na p p l i c a t i o n s v i s u a lm o d u l ec a ng e n e r a t ep a g e s c o m p o n e n t sa n dm a n a g et h ec o m p o n e n t s s u p p o r ti n gm o d u l e p r o v i d e st h et y p ec o m m o n l yu s e dt of a c i l i t a t eo t h e rm o d u l et o u s e f i n a l l y ，t h ep a p e rt a k e s f o r l i n kw e bm a i ls y s t e m p r o j e c t f o ra ne x a m p l et od e s c r i b ei m p l e m e n t i n go ft h i sf r a m e w o r ki n t h ep r o j e c t k e y w o r d s ：a j a x ，w e b ，f r a m e w o r k , a s y n c h r o n o u sc o m m u n i c a t i o n 北京邮电大学硕士研究生学位论文 a j a x 框架的设计与实现 独创性( 或创新性) 声明 本人声明所呈交的论文是本人在导师指导下进行的研究工作及取得的研究 成果。尽我所知，除了文中特别加以标注和致谢中所罗列的内容以外，论文中不 包含其他人已经发表或撰写过的研究成果，也不包含为获得北京邮电大学或其他 教育机构的学位或证书而使用过的材料。与我一同工作的同志对本研究所做的任 何贡献均已在论文中作了明确的说明并表示了谢意。 申请学位论文与资料若有不实之处，本人承担一切相关责任。 本人签名：醴题日期l 瑚! 弓可 关于论文使用授权的说明 本人完全了解北京邮电大学有关保留和使用学位论文的规定，即：研究生在 校攻读学位期间论文工作的知识产权单位属北京邮电大学。学校有权保留并向国 家有关部门或机构送交论文的复印件和磁盘，允许学位论文被查阅和借阅；学校 可以公布学位论文的全部或部分内容，可以允许采用影印、缩印或其它复制手段 保存、汇编学位论文。 本学位论文属于保密论文，在年解密后适用本授权书。 本学位论文不属于保密范围，适用本授权书。 本人签名： 盛蝮日期：盖逦：兰：! 羔 导师签名：密友多留 日期：2 1 1 星：墨：竺 北京邮电大学硕士研究生学位论文m a x 框架的设计与实现 1 1 课题背景 第一章引言 1 1 1 b 2 0 的发展 随着w 曲应用不断深入到各个方面，从传统的电子邮箱、门户网站到现在 比较时髦的网络存储和共享、个人博客、网络售货等，人们对于现有的w e b 技 术使用更加纯熟，便在现有技术的基础上提出了各种w e b 应用的方案，用来解 决大家对w e b 越来越强的要求，如安全、稳定、高交互、灵活性等。开发人员 和w e b 用户都希望能够有一套能方便w e b 开发或使用的技术，使自己的w e b 信 息或功能可以更加好的被用户接受。 w 曲2 0 的提出使w e b 进行了一种观念上的改变将一系列网站转变成一 个成熟的为最终用户提供网络应用的服务平台。这种概念的支持者期望w e b2 0 服务在很多用途上最终取代桌面计算机应用。 w e b 2 0 服务大大丰富了互联网用户体验，它要求互联网服务提供商应该追 踪研究用户的消费体验，并尝试不断推出新的应用服务，同时建立以消费者体验 为中心的业务规划，不断推出新的产品和服务，通过公开测试来发现未来的重点 方向。 从互联网发展趋势看，w e b 2 0 服务代表了互联网发展的重点趋势，用户市 场和规模不断拓展，据统计曾经注册使用过w e b 2 0 服务的用户比率占互联网用 户总数的3 2 3 。根据中国w e b 2 0 市场年度综合报告预计，2 0 0 8 年底w e b 2 0 市场将开始爆发，市场规模达到2 1 4 4 亿元。 目前，大量具有w e b 2 0 特征的新兴网站涌现出来，w e b 2 0 相关技术和应 用开始大规模的融入主流网站的应用中，如何研发出促进w e b 2 0 发展的关键技 术从而帮助其推广，成为互联网从业者共同关心的话题。 1 1 2a j a x 技术的概念 由于w e b 应用存在着先天不足，其交互能力比较弱，无法实现丰富多彩的 北京邮电大学硕士研究生学位论文 a j a x 框架的设计与实现 用户界面，而其同步请求方式常常阻塞用户界面，因而w e b 应用主要使用在诸 如提交表格这样的瞬态应用上。 a j a x 技术是由j e s s ej a m e sg a r r e t t 于2 0 0 5 年2 月在一篇文章中提出来， 是a s y n c h r o n o u sj a v a s c r i p tx m l ( 异步j a v a s c r i p t 和x m l ) 的简称，是一种创 建交互式应用的网页开发技术。 它主要包括下列内容： 使用x h t m l + c s s 来表示信息。 使用j a v a s c r i p t 操作d o m ( 3 c 本对象模型) 进行动态显示及交互。 使用x m l 和x s l t 进行数据交换及相关操作。 使用x m l h t t p r e q u e s t 对象与w e b 服务器进行异步数据交换。 使用j a v a s c r i p t 将w e b 的各种技术绑定在一起。 以x m l 的格式来传送方法名和方法参数。 a j a x 与传统w e b 方式相比，相当于在用户和服务器之间加了个中间层， 使用户操作与服务器响应异步化。如下图卜l 所示： b r o w s e rc l i e n t u s e ri n t e r f a c e i i i e q u e s ti r r l c s s i w e bs e r v e r 1 l rt d a t a s t o r e s , b a c k e n d p r o c e s s i n g 。l e g a c y s y s t e m s s e r v e r - s i d e s y s t e m s c l a s s i c w e ba p p l i c a t i o nm o d e l b r o w s e rc l i e n t t l l s e ri n t e r f a c e j a v 训a s c l r i 一1 l rtq o s 匈a 冀e n g i n e jl n l pr e q u e s t x ld a t a 1r w e ba n d o rx ls 4 d r v i b r 1 l rt d a t a 硪o r e s , b a t ：j c e n d p r o c e s s i n g 1 e g a c y 0 y 咀e 鹏 s e r v e r s i d e s y s t e m s a j a x w e ba p p l o c a t l o nm o d e l 图1 - 1 传统模式( 左) 和a j a x ( 右) 模式工作流程的比较 a j a x 技术的提出，就是能在不重新下载整个页面的前提下维护数据，这使 得w e b 应用程序更为迅捷地回应用户动作，并避免了在网络上发送那些没有改 变过的信息，而且也不需要任何浏览器插件，就可以使w e b 与用户的交互达到 很好的程度。a j a x 在对w e b 应用功能的大幅提升将直接导致应用模式的改变， 2 北京邮电大学硕士研究生学位论文a j a x 框架的设计与实现 尤其对于大型企业的应用来说，w e b 模式带来的易用性和可维护性显然具有诱惑 力，a j a x 支持的客户端功能提升使得替换传统的操作界面成为可能。a j a x 有 数据与样式分离及易于与现有各种技术结合的特点，还具有松散的耦合性、优良 的开放性，这些都非常有利于网络信息共享。它的技术特点类似w e bs e r v i c e ， 在因特网信息共享及个性化交互方向可以得到充分发挥。a j a x 技术所涵盖的内 容将可能是各类信息管理、网络客服、在线设计、网上交流、甚至是在线游戏。 由于这些特点，它便被认为是w e b 2 0 的核心技术之一。 目前a j a x 己经成为一股推动力，催生了一系列基于w e b 2 0 的新服务，包 括免费文字处理程序w r i t e l y 、子数据表制作网站n u m s u m ，以及人们用于编制 日程和工作时间表的网站v 0 0 2 d o 。这些使用a j a x 技术的网站的出现，已经促 使人们开始重新思考互联网和个人计算机之间的关系。事实上，a j a x 也许会导 致许多基于个人计算机应用的软件遭到淘汰，进而导致计算机行业中很多领域出 现翻天覆地的变化。广受欢迎的图片共享网站f l i c k e r 已经采用了a j a x 技术， 让用户可以及时为他们的照片加入标题和说明、及时把照片放进自己的收藏影 集，或者连续地观看照片。业界的分析师认为a j a x 之所以重要是因为它让户使 用浏览器直接w e bs e r v i c e 进行交互，这是让用户获取w e bs e r v i c e 最佳方法。 而国内对a j a x 的研究刚刚开始，可用的资料还比较少，但是已经有不少w e b 网站已经纷纷开始应用a j a x ，如国内门户网站网易、新浪的邮件系统等，都采 用了a j a x 技术进行了设计，从而加强了交互性和减少了用户操作的响应时间。 为了方便程序员进行a j a x 的开发，现在不少的组织或机构推出的自己的 a j a x 开发工具，如微软的a j a x n e t 开发平台、d o j of o r u m 的d o j o 框架、d w r 框架、p r o t o t y p e 框架等等。到目前为止a j a x 仍在不断的发展，许多相关技术 层出不穷，种类繁多的新的开发框架和组件库的出现在给a j a x 开发带来很多便 利的同时，也使a j a x 的应用处于一种混沌状态。如何将a j a x 应用于企业级 的w e b 应用中，如何实现基于a j a x 模式的w e b 开发是一个非常值得研究的问 题。 1 1 3 项目背景 由于a j a x 技术的普及和在实际应用中展示的优秀的交互效果，时力永联公 司希望能借助a j a x 技术对“w e bm a i l 企业邮件系统进行升级，使其能在不 对后台服务器端进行太多改造的同时，就可以加强与使用者的互动效果，提高用 3 北京邮电大学硕士研究生学位论文a j a x 框架的设计与实现 户的体验，从而促进其邮件系统的推广。同时，邮件系统作为一个良好的认证和 信息交流功能可以将其延伸成一个企业信息化平台，还具有更加深度的企业战略 意义。虽然互联网上的各种邮件服务系统层出不穷，基于a j a x 的邮件系统也有 燎原之势，可作为企业使用的邮件系统出于各种考虑，普遍还停留在传统的模式 下，所以如果能够开发一套适合企业使用的a j a x 邮件系统将具有相当大技术与 市场意义。 目前的a j a x 开发技术或者需要服务器的改造，或者所选框架不能提供系统 所要求的功能，这就需要改造现有的a j a x 框架，但这样所花的代价就会过大， 而且也不能保证改造后框架的安全性和稳定性，所以就需要开始设计一套轻量级 的，在浏览器端执行，又便于扩展的a j a x 框架来完成所要求的功能。 本人作为项目的主要开发人员承担了上述框架和部分业务开发工作，本文将 阐述a j a x 框架的设计和实现，并通过在该邮件系统的业务应用说明其使用方 法。 1 2 课题任务 使用a j a x 技术可以改善客户操作体验，还可以降低网络负担，能帮助我们 达到以往在c s 架构中才能实现的界面效果。目前a j a x 尚处于基础架构完善中， 大多框架都不完整。本课题主要是设计和实现一个a j a x 框架，w e b 开发者可 以利用此框架方便、快速地实现基于a j a x 的各种应用，并能根据自己的应用需 要添加自己的功能。 由上述的应用，本课题的设计和实现应当包括下列目标： 有基本或部分的o o p 设计，使开发出的各种实例和对象能够被方便的 使用、维护。 有简单的扩展机制，能够加入根据需要而编写的各种对象。 在基础代码的支撑下，实现组件的设计，这些组件能快速响应用户需求， 提供丰富的表现，并能够重用和根据用户需要进行扩展。 根据技术调研结果，本课题准备将此框架完全在客户端实现，这样既可以达 到在各种服务器平台的通用性，而且可以利用客户端浏览器的运算能力来分担一 些在以前在服务器上实现的计算和处理从而提高效率。要达到这个目标，就需要 4 北京邮电大学硕士研究生学位论文 a j j u x 框架的设计与实现 使用w o b 客户端开发的各种技术。 1 3 论文结构 本文共分六章，内容安排如下： 第一章绪论，介绍本课题的意义、任务、预期目标。 第二章a j a x 技术与框架简介，简要介绍了a j a x 支撑技术的概念、特点， 并对它的研究现状，然后对a j a x 开发过程中的重要工具a j a x 框架进行简单 的介绍，最后总结出了使用a j a 】【技术的需要注意或改进的地方。 第三章a j a x 框架技术研究，提出了a j a x 应用客户端框架模型。详细介绍了 整体结构到各个组成部分。模型的着重考虑了组件复用度、互操作性和安全性。 第四章框架的设计与实现，据编程模型，设计了该模型的简单实现，给出 了u m l 类图，并给出了一些关键技术的实现代码。 第五章基于框架的w e bm a i l 系统应用，在第四章实现的框架上实现了w e b m a i l 系统的应用。主要是针对在一个企业邮件系统项目中w e b 的开发问题，给 出了本框架的应用实例，展示了本框架相对传统w e b 开发的优势。 第六章结束语，对本论文中所阐述的内容以及研究的过程进行了总结，谈 了作者在研究过程中的收获，也阐明了研究过程中的体会，最后提出了对项目今 后研究工作的设想。 5 北京邮电大学硕士研究生学位论文a j a x 框架的设计与实现 第二章a j a j 【技术与框架简介 在w e b 发展的初期阶段，由于用户数量不多、w e b 网站提供给用户使用的 功能有限，弊端并未完全暴露出来。但随着互联网发展，w e b 网站做得越来越 华丽、提供给用户的功能越来越复杂，再加上用户数量飞速增长，w e b 同步模式 造成的问题引起人们的注意。一方面，用户抱怨浏览w e b 时交互性不好，在使 用w e b 功能时不像在桌面系统一样方便；另一方面，w e b 开发和维护人员对实 现页面复杂的功能和服务器承担接近临界的访问压力感到不满。这时a j a ) 【适时 产生了，由于它能提供高效的与用户之间的交互，便立即被大量w e b 网站应用， 并认为是新一代网络应用的核心技术。 a j a x 是多种技术的综合，它使用h t m l 和c s s 技术进行标准化呈现，使用d o m 技术实现动态显示和交互，使用浏览器的x m l h t t p r e q u e s t 对象进行异步数据读 取，使用j a v a s c r i p t 语言绑定和处理所有数据。更重要的是它打破了使用页面 重载的惯例技术组合，可以说a j a x 已成为w e b 开发的重要武器，也成为区别传 统w e b 技术的重要工具。 2 1a j a x 与传统方式的区别 2 1 1 b 传统方式 现在的w e b 实现技术多种多样，但是用户与服务器交互的形式却基本相同， 都是简单的同步模式请求响应模式。用户在页面上进行某种操作，最后点 击提交的按钮，该页面内容就被发送到服务器，服务器获得参数，识别出用户的 动作，并对数据进行处理，将处理结果或处理后的数据以某个页面的形式重新返 回给用户。在用户进行操作时，服务器在等待用户的输入操作，当用户提交之后， 用户等待服务器的处理和传输新页面操作，当新的页面到用户那里时，服务器又 开始等待。如图2 - 1 所示： 6 北京邮电大学硕士研究生学位论文a j a x 框架的设计与实现 w e b 同步摸式 客户罐 最户铺八 时闻 服务嚣端 服务器处理 服务器处理 ，t ：i、 。一 一。 图2 - 1 传统w e b 同步模式 2 1 2 传统方式存在的问题 由于现在w e b 大量使用同步模式，会带来下面一些问题： ( 1 ) 传输冗余信息： 用户对页面进行某项操作后，关心的是该操作的处理结果，而服务器却返回 了处理结果的页面，不需要进行更新的数据也被传递回来重新显示，造成传输了 大量无用数据。 ( 2 ) 低效的用户交互性： 在用户进行几个操作时，服务器必须等待用户完成所有的操作才能得到数 据，并进行处理，因而不能及时返回用户所完成操作结果，造成应用不能及时获 取用户所关心的事件或数据，并对此进行反馈。如，用户在进行注册操作时，用 户写入申请的用户名，并填写其他的信息，当提交完成后，却发现用户名已被注 册，需要重新填写，这样就造成了用户在时间和精力上的浪费，而服务器却一直 闲置；在服务器处理完毕后，由于需要重新刷新页面，用户又需要等待，但是页 面上大量的信息并不需要刷新的。 2 1 3a j a x 异步通讯方式 a j a x 异步通讯是a j a x 的主要功能之一，也是区别传统w e b 开发的方式，其 主要指客户端并不直接与服务器进行通讯，而是通过一个a j a x 引擎来和服务器 进行来回的交互，这样就摒弃了“请求一等待一响应的模式，用户通过a j a x 引 擎可以分开提交页面各自的功能，服务器对请求进行处理，将结果发送回客户端， a j a x 引擎再次将响应获取，并通过开始定义的回调函数，将数据在页面上进行 呈现或其他操作n 1 。而传统w e b 开发浪费资源( 传递全部页面信息) 、用户交互 性差( 需要多次等待) ，a j a x 则极大的弥补了这些方面。如图2 2a j a x 的w e b 北京邮电大学硕士研究生学位论文a j a x 框架的设计与实现 模型显示的通讯过程： a j a x w e b 模型 ：，“：i ，“op 。：。 ? i ，z ”oh o 二，t 一? y j ? ，?i t ，? ，一谚 图2 - 2a j a x 的w e b 模型叫 由上图2 - 2 可见，在异步提交模式下，用户只将部分的数据传输到服务器端 进行处理，并将处理好的数据重新在页面显示，由于整个页面没有被刷新，所以 在页面也就没有了白页时间( 在同步提交，由于用户要等待服务器重新传输过来 的整个页面，会出现一段时间页面上什么都没有的状态) ，用户在这部分数据传 输的情况下仍然可以在页面上进行查看和各种操作。 2 1 4a j a x 异步通讯原理 a j a x 进行异步通讯的关键就在于浏览器内置的x m l h t t p r e q u e s t 对象，在 i e 5 0 后就内置到i e 中，从此程序员可以使用浏览器内置的对象进行与服务器 通讯，而不需要用其他的模拟方法。使用浏览器内置x m l h t t p r e q u e s t 对象进行 异步通讯的主要过程包括：创建x m l h t d p r e q u e s t 对象，为该对象设置对应参数， 打开通讯通道，发送相应数据到服务器，当服务器返回信息时调用设置的回调函 数从而完成通讯过程。下面将详细描述整个通讯的过程。 ( 1 ) 创建x m l h t t p r e q u e s t 对象 由于x m l h t t p r e q u e s t 不是一个w 3 c 标准，所以不同浏览器有其不同的方法 通过j a v a s c r i p t 来创建x m l h t t p r e q u e s t 的实例。i n t e r n e te x p l o r e r 把 h x m l h t t p r e q u e s t 实现为一个a c t i v e x 对象，其他浏览器( 如f i r e f o x 、s a f a r i 和o p e r a ) 把它实现为一个本地j a v a s c r i p t 对象。由于存在这些差别，j a v a s c r i p t 代码中必须包含有关的逻辑，从而使用a c t i v e x 技术或者使用本地j a v a s c r i p t 对象技术来创建x m l h t t p r e q u e s t 的一个实例。代码如下： 8 北京邮电大学硕士研究生学位论文a j a x 框架的设计与实现 v a rx m l h t t p ； f u n c t i o nc r e a t e x m l h t t p r e q u e s t ( ) 如果是i e 浏览器 i f ( w i n d o w a c ti v e x o b j e c t ) x m l h t t p = n e wa c t i v e x o b j e c t ( ”m i c r o s o f t x m l h t t p ”) ： 如果是其他浏览器 e l s ei f ( w i n d o w x m l h t t p r e q u e s t ) x m l h t t p = n e wx m l h t t p r e q u e s t0 ： ( 2 ) 为该对象设置对应参数 异步通讯对象常用的方法和属性如下： g e t a l l r e s p o n s e h e a d e r s ( ) ：把h t t p 所有响应首部作为名值对返回： g e t r e s p o n s e h e a d e r ( s t r i n gh e a d e r ) ：返回指定首部的串值： o p e n ( s t r i n gm e t h o d ，s t r i n gu r l ，b o o l e a na s y n ) ：建立对服务器的调用。 m e t h o d 表明通讯的方式，一般为p o s t 、g e t 方式；u r l 参数可以是相对u r l 或绝 对u r l ，表明调用的服务端的地址；a s y n 设置t r u e 或f a l s e 表明是否调用异步 通讯： s e n d ( s t r i n gc o n t e n t ) ：这个方法具体向服务器发出请求。如果请求声明为 异步的，这个方法就会立即返回，否则它会等待，直到接收到响应为止。该内容 使用名值对方式，并用“ 符进行分割不同的名称，如 “n a m e = c h e n j ia o & id = 0 5 5 6 4 0 一。 s e t r e q u e s t h e a d e r ( s t r i n gh e a d e r ，s t r i n gv a l u e ) ：这个方法为h t t p 请求 中一个给定的首部设置值。它有两个参数，第一个串表示要设置的首部，第二个 串表示要在首部中放置的值。需要说明，这个方法必须在o p e n ( ) 之后才能调用。 r e a d y s t a t e ：表明异步通讯请求的状态。有5 个可取值，0 为未初始化，1 为正在加载，2 为已加载，3 为交互中，4 为完成。 o n r e a d y s t a t e c h a n g e ：每个r e a d y s t a t e 状态改变时都会触发这个事件处理 9 北京邮电大学硕士研究生学位论文a j a x 框架的设计与实现 器，通常会调用一个j a v a s c r i p t 函数。 r e s p o n s e t e x t ：服务器的响应，表示为一个串。 r e s p o n s e x m l ：服务器的响应，表示为x m l 。这个对象可以解析为一个d o m 对象。 s t a t u s ：服务器的h t t p 状态码( 如2 0 0 对应o k ，4 0 4 对应n o tf o u n d 未找 到，等等) 。 s t a t u s t e x t ：h t t p 状态码的相应文本。 ( 3 ) 打开通讯通道 一般调用o p e n 方法就可以了。需要注意的是，如果m e t h o d 方法设置的是 g e t ，那么后面调用s e n d 方法时就要使用s e n d ( n u l l ) ；如果是设置的p o s t ，那 么需要调用s e t r e q u e s t h e a d e r 方法，设置“c o n t e n t t y p e 属性值为 “a p p li c a t i o n x - w w w f o r m - u r l e n c o d e d 刀。 如：x m l h t t p o p e n ( “g e t 一，一栅b a i d u c o m n a m e = l 一，t r u e ) 或 x m l h t t p o p e n ( “p o s t ， 胛b a i d u c o m ，f a l s e ) 。 ( 4 ) 发送相应数据到服务器 使用s e n d 方法。如果o p e n 方法设置的m e t h o d 属性为g e t ，那么s e n d 方法 就只能发送的n u l l 对象；如果设置的是p o s t 方法，则可以以名值对方式进行发 送到指定的服务端地址。 如：x m l h t t p s e n d ( n u l l ) 或x m l h t t p s e n d ( “n a m e = c h e n j i a o v a l u e = l ) 。 ( 5 ) 当服务器返回信息时调用设置的回调函数 通过在o n r e a d y s t a t e c h a n g e 设置函数指针，可以根据r e a d y s t a t e 状态的不 同从而设置指定状态的事件。如代码： x m l h t t p o n r e a d y s t a t e c h a n g e = f u n c t i o n ( ) r e a d y s t a t e 为4 表明异步通讯完成 i f ( x m l h t t p r e a d y s t a t e = = 4 ) s t a t u s 为2 0 0 表明成功返回信息 i f ( x m l h t t p s t a t u s = = 2 0 0 ) v a td a t a ； d a t a = x m l h t t p r e s p o n s e t e x t ： 1 0 北京邮电大学硕士研究生学位论文 a j a x 框架的设计与实现 ) ) ) 这样就完成了回调函数设置，表明当通讯完成并且从服务器成功返回信息 后，将得到的返回的文本信息储存到d a t a 变量中。 2 2a j a x 应用案例 2 2 1g o o g i es u g g e s t g o o g l e 是目前最受欢迎的搜索引擎之一，g o o g l es u g g e s t 就是它的一项被 人们所津津乐道的功能，也是采用a j a x 技术的典型例子。当人们在搜索文本框 中输入所要查询关键词的时候，它会自动给出一些关键词的建议。从内容上看， 它实际上和其他搜索引擎的结果一样，但在界面上却很不同。其他搜索引擎的相 关搜索时罗列搜索结果页面的下方，而g o o g l e 的相关搜索建议却是实时显示在 输入文本框下，随着输入的不同给出的提示也不同。同时显示的还有这些关键词 搜索结果的数目。这就方便了用户的使用，使搜索过程更加智能，而从也提高了 与用户的交互感。g o o g l es u g g e s t 搜索效果如下图2 - 3 所示： 如静鲈 a j a x a j a 埔埔i a j a 聱技术 a j a x 基础敦程 a j a x 4 e 槊 a j 。a x 框架 a j a x n e t a j 。a x 实例 a j a x 教程 a j a xi na c t i o n 1 t 1 o o o 麒) o 结果 2 0 3 0 , o o o 结果 3 , 0 1 0 。0 0 0 结果 5 2 4 0 0 0 结果 5 5 0 0 0 0 结果 5 7 8 0 0 0 结果 9 伯国结果 1 6 1 0 0 0 0 结果 2 0 3 0 , 0 0 0 结果 3 0 1 0 。0 0 0 结果 差圃 图2 - 3g o o g i es u g g e s t 提示信息 直堑燕麦 缝瞪 置室王县 北京邮电大学硕士研究生学位论文a j a x 框架的设计与实现 2 2 2g g i em a p s a j a x 是g o o g l em a p s 所依赖的技术。它从设计上对页面进行了分割，使地 图从一个整体变为独立的部分，并精心设计了一套a j a xa p i ，用来处理页面状 态和与地图服务器交互数据。当用户移动鼠标或拖拉地图时，a j a x 捕获到该事 件，通过分析用户动作和当前状态，计算出需要载入的地图，并通知后台服务器， 取得地图数据，在解析之后显示出来。这样就实现了一种更为平滑和更快速的用 户体验。g o o g l em a p s 效果如下图2 4 所示： g o o g l e 黼蒜塑坐竺竺l 一：鍪鎏塑照_ - = - j i 一 塾! ! 也璺! 苎塑 醢i 迸匠；i 矗i q 皿j i 孟五i 壶i 图2 - 4g o o g l em a p 显示界面 2 2 3v 0 0 2 d o 在线日程 仅仅只需要登陆到w e b 上，便可管理并编辑自己的日程，操作和查看与办公 系统常用的o f f i c e 系列基本一致。用户能够授权任何人上网观看甚至可以修改 该内容，并且通过一个小型的窗口和作者或他人讨论，是信息交流和发布更加方 便和快速。它是使用a j a x 技术写成。由于使用了组件技术，使页面效果十分丰 富，如同在操作本地文件系统一样。页面效果如下图2 5 所示： 翊鼠。主若b 一矗叫一臣一 c o n t e x t 丽习陵画西l i 四 三篁羔i 遴遂釜薹_ - _ ：_ 选照二- _ _ _ 垒! 照_ ：二羔：主二遗二蓬：- 三蔓二整! 二耋盔立 n e wt a s g l r e c e n t l yc o m p l e t e dt a s k s 匠蹴i 鞠1 73 r - j 2 f l o b1 图2 - 5 文档在线编辑 1 2 北京邮电大学硕士研究生学位论文a j a x 框架的设计与实现 2 3a j a x 关键技术 a j a ) 【是多种技术的一个组合应用，尽管许多技术都已经存在多时并且相当成 熟了，但却没有引起人们足够的重视，对它们了解一般也都停留在比较基础的阶 段。本节就将对这些技术做一个简要的介绍，说明它们在a j a x 中所起的作用与 如何协同工作。 2 3 1j a v a s o r i p t 在浏览w e b 网页时，可以看到在页面中有许多脚本的特效，例如，文字的闪 烁、状态栏字符串的滚动、图片的出现或消失，这些都是通过j a v a s c r i p t 进行 的操作。 在a j a x 中，j a v a s c r i p t 已经从默默无闻的后台状态完全转移到前台，发挥 着巨大的作用。可以说，j a v a s c r i p t 是a j a x 中的粘合剂，它使d o m 、h t m l 、x m l 和c s s 可以互相协作，并控制它们的行为。 j a v a s c r i p t 语言的前身是n e t s c a p e 公司发明的l i v es c r i p t 语言。自从s u n 公司推出著名的j a v a 语言之后，n e t s c a p e 公司引进了s u n 公司有关j a v a 的程 序概念，将自己原有的l i v es c r i p t 重新进行设计，并改名为j a v a s c r i p t 。 j a v a s c r i p t 是一种基于客户端浏览器的语言，用户在浏览中填表、验证的 交互过程只是通过浏览器对调入h t m l 文档中的j a v a s c r i p t 源代码进行解释执行 来完成的，即使是必须调用c g i 的部分，浏览器只将用户输入验证后的信息提交 给远程的服务器，大大减少了服务器的开销。 j a v a s c r i p t 有下面几个特点： ( 1 ) 脚本语言。脚本语言就是一条条的命令，通常保存为a s c i i 码文本文 件，提交给计算机由解释器解释成机器可识别的指令顺序执行，对应的另外一种 动态程序实现方式是二进制方式，将程序语言编译为二进制代码再解释执行。简 单讲，脚本就是代码程序，源程序。 ( 2 ) 基于对象。j a v a s c r i p t 具备一些面向对象编程语言的特征，能够创建 自己的对象，扩大j a v a s c r i p t 的应用。但是它没有提供如抽象、继承、重载等 有关面向对象语言的功能，所以不是面向对象的语言。 ( 3 ) 事件驱动。事件是让页面动起来的驱动力，j a v a s c r i p t 代码是对某个 事件做出相应的操作和反应。比如在h t m l 页面中做一个表单，用户单击提交按 1 3 北京邮电大学硕士研究生学位论文a j a x 框架的设计与实现 钮，或是做了一个超级链接，用户的鼠标滑过链接文字或是点击了链接文字，这 就是事件。而j a v a s c r i p t 就能对这些事件做出反应，从而实现与