【PHP开源代码栏目提醒】:网学会员在PHP开源代码频道为大家收集整理了“Web设计开发过程中EXT框架的应用与研究 - 硕士论文“提供大家参考,希望对大家有所帮助!
大连海事大学 硕士学位
论文Web设计开发过程中EXT框架的应用与研究 级别:硕士 专业:计算机科学与技术 指导教师:赵子祥 20090601 中文摘要 摘 要 随着Intemet的迅猛发展,网络规模的迅速扩大,网站技术的广泛应用,网络用户对富客户端的要求也不断增高,从而提出了富界面应用程序RIA(mchInterface Applications)。
传统网络程序的开发是基于页面的、服务器端数据传递的模式,把网络程序的表示层建立于HTML页面之上,而HTML是适合于文本的,传统的基于页面的系统已经渐渐不能满足网络浏览者的更高的、全方位的体验要求了,而RIA的出现正是为了解决这个问题。
Ext是一个创建丰富互联网应用程序的跨浏览器的JavaScrip库。
它包含:高效率、可定制用户界面的小部件,设计漂亮的、可扩展的组成部件模型,容易使用的、直观的应用程序接口。
基于纯Html/CSS+JS技术,提供丰富的跨浏览器UI组件,灵活采用JSON/XML为交换格式,使得服务端的负荷真正减轻,从而达到客户端的RIA应用。
本文旨在研究Ext框架的工作原理及与其他主流Web开发框架的整合,对其功能与工作特性进行了详细的研究。
根据所做的研究进行了系统的整体设计,框架的选择与整合,编码实现到工程发布,最后实现了图书管理系统。
本文首先对Ext框架进行了详细的介绍,并分析和研究了其基础构成与实现机制。
然后借鉴了对基于J2EE架构Web开发的项目经验,成功引进了Struts、Hibernate、Spring---大框架,并对他们进行了整合。
通过框架的使用,降低了
代码的耦合性, ●减少了开发周期,从而为该系统的开发提供了便利。
该系统是基于B/S架构的框架技术进行的开发。
其目的一是为了实现对Ext框架的研究,二是为了使那些对MIS系统开发有兴趣的研究者少走弯路。
关键字:RIA;Ext;Struts:Hibernate;Spring 英文摘要 Abstract With the rapid development of internet,the rapid expansion of the network scale,the widely use of the Web site technology,the user’S requirements of rich-client havebeen increased,in order to put forward a rich interface application RIA(Rich InterfaceApplications).The development of the traditional network is based on the page, server-side data transfer model,the network side procedures establish the HTML page above,and is suitable for HTML text,the traditional page-based system has beengradually can not meet the the higher,all-round experience requirements,and theemergence of RIA is to solve the problem. Ext is a rich intemet applications javaScrip library to create cross-browser.Itcontains:a highly efficient and customizable user interface,small parts,the beautifuldesign,scalable model for the composition of components,easy-to-use,intuitiveapplication programming interface.Based on pure Html/CSS+JS technology,provides awealth of cross-browser UI components,a flexible use of JSON/XML format for the exchange,the client that the 1.evel of service to really lighten the load,SO as to achievethe RIA client application. The paper is to study the Ext framework how to work and integrate the Extframework with oter main Web development framework,research its function andoperationg characteristics in detail.According to the research,make the system designoverall,the selection and integration of the framework,and the realization of theproject,at last develop the library management system. The paper introduces the Ext framework at first,analyzes and research the basis ofthe mechanism and implementation of the Ext framework.And then draws on the frame—work based on J2EE experience in WEB development projects,successfully introduce Struts,Hibernate,Spring framework一一the three frameworks,and integrate them.Throughthe use of the frameworks,reduce the code coupling and the development cycle.So helpthe system’S development.The system’S development first is to research the Extframework,the second is to help them who are interested in the development of MISwalk less detours.Key Words:RIA;Ext;Struts;Hibernate;Spr ing 大连海事大学学位
论文原创性声明和使用授权说明 原创性声明 本人郑重声明:本
论文是在导师的指导下,独立进行研究工作所取得的成果,撰写成博/硕士学位
论文 ==里堂逡盐珏筮蕉猩主星丕!挺.翌鲍廛旦量鲤究::。
除
论文中已经注明引用的内容外,对
论文的研究做出重要贡献的个人和集体,均已在文中以明确方式标明。
本
论文中不包含任何未加明确注明的其他个人或集体已经公开发表或未公开发表的成果。
本声明的法律责任由本人承担。
学位
论文作者签名:堇』垒塑 学位
论文版权使用授权书 本学位
论文作者及指导教师完全了解大连海事大学有关保留、使用研究生学位
论文的规定,即:大连海事大学有权保留并向国家有关部门或机构送交学位
论文的复印件和电子版,允许
论文被查阅和借阅。
本人授权大连海事大学可以将本学位
论文的全部或部分内容编入有关数据库进行检索,也可采用影印、缩印或扫描等复制手段保存和汇编学位
论文。
同意将本学位
论文收录到《中国优秀博硕士学位
论文全文数据库》(中国学术期刊(光盘版)电子杂志社)、《中国学位
论文全文数据库》(中国科学技术信息研究所)等数据库中,并以电子出版物形式出版发行和提供信息服务。
保密的
论文在解密后遵守此规定。
本学位
论文属于: 保密口在. 年解密后适用本授权书。
不保密囤/(请在以上方框内打“√,,)
论文作者签名:寺 Web设计开发过程中EXT框架的应用与研究 第1章绪论1.1课题背景及意义1.1.1课题背景 随着互联网作为第四媒体的载体深入应用,Web开发的下一站众望所归必然是富界面应用程序(RIA Rich Interface Applications)。
由于HTML天生是一种描述性的语言,使得当今Web交互程序虽然丰富多彩,但互动缺乏,就像在看一页页的书稿一样,对于企业级应用程序的UI表现能力,HTML表单提供的Input、Select、CheckBox等元素很难满足复杂的业务需求。
于是人们相对于这种较简单的用户交互方式而言,提出“富界面”程序的概念,力求提供桌面程序级水平的网络应用,从而带来丰富的客户端操作体验,与此同时,各大IT厂商亦纷纷积极参与实施,提出各自的解决方案,如SuIl的JavaApplet/JSF、Macromedia/Adobe的Flash/Flex/AIR、Microsoft的WPF/Silverli曲t_当然也包括不属于任何场商的A{ax【11。
作为Aia)【的一个优秀框架,Ext框架主要用来开发RIA应用,即富客户端应用。
RIA具有的桌面应用程序的特点包括: (1)在消息确认和格式编排方面提供互动用户界面; (2)在无刷新页面之下提供快捷的界面响应时间; (3)提供通用的用户界面特性如拖放式(drag anddrop)以及在线和离线操 作能力。
RIA具有的web应用程序的特点包括如立即部署、跨平台、采 用逐步下载来检索内容和数据以及可以充分利用被广泛采纳的互联网 标准。
在实现RIA的技术方面,现在也形成了两个分支,一种是以Flex和SliverLight为代表的运行于浏览器插件中的RIA应用;另一种是以ExtJS、Bindows等为代表的利用HTML、CSS和JavaSript等实现的富客户端组件技术的RIA。
自从Aia)【一词于2005年由Jessse James Garrett提出以来,Ajax的应用日益增多,最著名的就是Google的GMail和GMapJ〕艮务,以及照片共享站Flicker.这些站点的用 第一章绪论户交互界面突破了原有的方式,使得浏览页面时更为流畅和便捷——于是这种技术迅速流行,加上web 2.0的概念推波助澜,使得Ajax成为业界的明星、不少开发者研究的对象。
Yahoo!User Interface(YUI)Library是一套稳定而强大的界面开发套件,于2006年上半年由著名互联网运营商——雅虎公司以免版税的方式推出,为浏览器运行内容交互平台带来了一系列的基础设施建设,然而在提供用户界面的控件方面却显得相对不足,此时浏览器已被业界证明并广泛接受为一种能与传统桌面相媲美的新型舞台,迎接着Web技术的二次复兴。
那是一种富界面的、渐进增强的Web应用。
与此同时,由于YuI Library本身是一套比较清晰的OPP设计框架,其他开发者理解Jack的
代码并不太困难,有时还为YUI.Ext进行二次开发。
为期一年的紧张投入开发后,Jack Slocum正式宣布了独立的解决方案并更名为Ext JS,这时Ext已经是一套覆盖企业级应用的界面库,由于采用了“命名空间”的技术隔离,开发者可以确保Ext的控件不会受其他JavaScript
代码的影响。
数月之后,随着开发过程的进展,Ext自己的适配器也出现了。
随着更多开发人员的加入和持续蓬勃的社区活动的进行,在2.0版发布之后,Ext已经成为业内首屈一指的前端JavaScdpt库【9〕。
1.1.2课题意义 如今Web应用不只局限于简单的网页、网站,随着Web应用的发展和成熟,Web程序已经发展成了大型而又复杂的应用软件,一个Web应用程序甚至包括上千个页面,而且客户的要求和期望也越来越高,因此在程序开发过程中Web的界面设计成了一个很重要的部分,当然程序的业务逻辑和易维护性也很重要。
早期的页面都是一个个设计完成的,这样的开发方式对于现在规模的Web程序显然是不能满足要求的,而是需要对整个Web界面进行设计,一个好的设计可以大大提高开发效率和满足需求的变化以及程序的维护。
传统的开发模式已经远远不能满足开发者与客户的要求。
随着Web开发技术的逐渐成熟,越来越多的开发人员开始使用Web应用框架,框架为Web的应用提供了预先的软件架构和相关的软件包,大大提高了开发的速度与效率。
Web设计开发过程中EXT框架的应用与研究 Struts框架是目前最成熟、应用最广泛的开放源
代码Java Web框架,它提供了模型.视图.控制器框架,该框架为Java Web应用系统的开发者提供了一个结构清晰、功能强大、成本低廉、容易扩展及方便维护的平台。
S研ng框架的核心是个轻量级的容器,它是实现IoC(Inversion of Contr01)容器和非侵入性(Nointrusive)的框架,并且提供AOP(Aspect oriented programming)概念的实现方式;提供了对持久层(Persistence),事务(Transaction)的支持;提供MVC Web框架的实现,并对于一些常用的企业服务API(耳PApplication Interface)提供一致的模型封装,是一个全方位的应用程序框架,除此之外,对于现存的各种框架(Struts,JSF,Hibernate等),Spring也提供了与它们相整合的方案。
J2EE模型中出现了比较经典而且实用的持久层框架Hibernate,它是对JDBC的轻量级的封装,可以应用在任何JDBC的场合,不但如此Hibernate还可以在EJB中取代CMP,完成数据持久化。
在具体的项目中,Hibernate还可以与大多数的应用平稳地集成,同时Hibernate还有独立作战能力,可以用一般的测试程序进行测试。
随着网络的发展,Hibernate越来越受到开发者的欢迎,运用Hibernate作为数据持久化的
开源框架也越来越多。
Ext可以用来开发RIA也即富客户端的Ajax应用,是一个用Javascript写的,主要用于创建前端用户界面,是一个与后台技术无关的前端Ajax框架。
因此,可以把ExtJS用在.Net、Java、Php等各种开发语言开发的应用中。
ExtJs最开始基于YUI技术,由开发人员JackSlocum开发,通过参考JavaSwing等机制来组织可视化组件,无论从UI界面上CSS样式的应用,到数据解析上的异常处理,都可算是一款不可多得的JavaScript客户端技术的精品。
本文的意义在于,深入研究上述三个主流web开发框架的设计模式、设计原则及功能实现,重点研究基于RIA富客户端开发的Ext框架的原理和机制,并将它们进行整合实现了图书管理系统,通过Ext技术对Web应用系统布局功能的,系统展示了如何使用Ext来提高页面易用性和改善用户体验。
并总结出它们之间整合的方法与具体协同合作的原理,为web开发者在实现过程中提出些可供参考经验。
第一章绪论1.2
论文的研究内容及组织1.2.1
论文的主要研究内容 本文所做的工作主要有以下几点: (1)本文系统、详细的介绍-Y”Ext框架的技术特点和实现方法; (2)深入探讨了Ext框架与当前主流J2EE
开源框架的协同工作,并对其框架结 构与配置使用做了简单的介绍; (3)将Ext框架与Struts、Hibemate、Spring框架进行整合,完成图书管理系统。
1.2.2
论文的组织 本文共分为五章,各章的内容如下: 第1章绪论 概述了
论文的研究背景,介绍了
论文的研究内容及
论文的组织。
第2章Ext的基本理论与关键技术 系统地研究和阐述了Ext框架的基本工作原理与实现特性,并对基于RIA开发的
开源框架Ext的优点与不足进行了介绍。
第3章系统的总体设计 对系统的数据库的设计、WEB应用的层次结构与
开源框架的选择策略、系统的功能模块及业务流程进行了具体的阐述。
第4章系统的实现 通过应用Ext框架开发界面,Struts2作为表示层,Hibernate作为模型层,Spring作为控制层,进行框架的整合,开发出具有C/S架构程序部分特点的图书管理系统,界面漂亮,格式新颖并且能实现动态更新。
第5章结束语 对全文进行总结,并提出未来研究的发展方向和有待进一步研究的问题。
Web设计开发过程中EXT框架的应用与研究 第2章Ext的基本理论与关键技术2.1 Ajax概述 2.1.1 Ajax的技术概述 Ajax全称为“Asynchronous JavaScript and XML”(异步JavaScript和XML), 是指一种创建交互式网页应用的网页开发技术。
Ajax这个名词的首次出现是在 2005年2月18日美国一位叫做杰西詹姆斯加勒特(Jesse James Garrett)发表的 一篇题为(<Ajax一个Web应用的新途径》的
论文中。
文章认为Ajax不是一种技 术。
实际上,它由几种蓬勃发展的技术以新的强大方式组合而成。
Ajax包含【2q: (1)使用XHTML和CSS标准化呈现; (2)使用DOM(Document Object Model)进行动态显示和交互; (3)使用XML和XSLT进行数据交换与处理; (4)使用XMLnttpRequest与服务器进行异步通信; (5)使用JavaScript绑定和处理所有数据。
Ajax技术是目前在浏览器中通过JavaScript脚本可以使用的所有技术的集 合。
Ajax并没有创造出某种具体的新技术,它所使用的所有技术都是在很多年前 就已经存在了,然而Ajax以一种崭新的方式来使用所有的这些技术,使得古老的 B/S方式的Web系统焕发了新的活力【¨。
2.1.2 Ajax的基本工作原理 Ajax(Asynchronous JavaScript and XML)结合了Java技术、XML以及 JavaScript的web开发模式,可以构建基于Java技术的Web应用,和传统的Web 更新技术有所不同,相当于在客户端和服务器之间加了中间层—_Ajax引擎,这 样并不是所有的用户请求都提交给服务器,一些数据的验证和处理由Ajax自己来 做,只有确实需要从服务器读取新数据时,才由客户端通过JavaScript,调用Ajax 引擎,向服务器端发出Http请求。
当服务器端的数据以XML形式返回时,Ajax 第2章Ext的基本理论与关键技术引擎接收数据,并指定JavaScfipt函数来完成相应的处理或页面的更新,而不是刷新整个页面,从而实现用户操作与服务器响应的异步化【21。
如2.1所示: 客户端 用户接口‘ 用户接口 客 I · J L 产 JavaScrip HTML+CSS 湛 01Iu ● I Htt )请求 Http传输 Html+CS Ajax引擎 ’ J L 1 r H :tp请求 Http传输 弛IL型 据 Web服务器 ’ r 上 T 服 缝 Web和或XML服务器 数据仓库 量 自口’ 上 t 端 数据仓库 服务器端 (a)传统的Web体系结构 (a)Ajax的Web体系结构 (b)Structure of the Traditjonal (b)Ajax Structure of the Web 图2.1 Web体系结构比较图 Fig 2.1 Comparison Chart of Web Structure2.1.3 Ajax的异步数据传输实现方法 (1)发出http请求 指定响应处理函数之后,就向服务器发出http请求,这一步是通过调用XMLHttpRequest对象的open和send方法。
http_requestl open(“method”,”URL”,true); http_request 1 send(null); open第一个参数是http请求的方法,可以为GET、POST; Web设计开发过程中EXT框架的应用与研究 open第二个参数是目标URL; open第三个参数是指定http请求异步执行。
Send的参数是客户端发往服务器的请求实体,可以是XML格式文档,也可以是其他的字符串。
之后在服务器端其处理与普通的Web应用程序一样【¨。
(2)处理服务器返回的信息 从W3C官方网站查到,响应处理函数首先要检查XMLHttpRequest对象的readyState值,以判断请求目前的状态,当readyState=4,代表http请求发送成功且服务器已经返回所有的信息,可以处理信息并更新页面。
其
代码为【4I】: If(httprequest 1 readyState==4){ //处理信息并更新页面 )else{ //信息没返回,等待 )2.1.4 Ajax的优势与弊端 与传统的Web开发不同,Ajax并不是以一种基于静态页面的方式来看待Web应用的。
从Ajax的角度看来,‘Web应用仅由少量的页面组成,其中每个页面其实是一个更小型的Ajax应用。
Ajax应用的优势主要表现在以下几个方面: (1)减轻服务器的负担。
Ajax的原则是“按需取数据”,可以最大程度的 减少冗余请求,和响应对服务器造成的负担。
(2)无刷新更新页面,减少用户心理和实际的等待时间。
Ajax利用了客户 · 端强大的计算资源,减轻了服务器负担,使服务器能承载更多的连接访 问量可以同时进行多个数据更新操作,实现真正的多任务处理。
例如: 检查用户名是否可用。
传统的检查必须要弹出一个新的窗口,显示结果 页面,而在弹出过程中,用户是只能干等结果而不能做其它的事情的(即 不能填其它信息,因为页面已经被锁定了),Ajax技术的应用,可以使 第2章Ext的基本理论与关键技术 用户在等待结果的时间段内,处理其它的任何数据(填写其它信息),相 互不受影响。
特别的,当要读取大量的数据的时候,不用像Reload那 样出现白屏的情况,Ajax使用xmlHttp对象发送请求并得到服务器响 应,在不重新载入整个页面的情况下用JavaScript操作DOM最终更新 页面。
所以,在读取数据的过程中,用户所面对的不是白屏,是原来的 页面内容(也可以加一个Loading的提示框让用户知道处于读取数据过 程),只有当数据接收完毕之后才更新相应部分的内容。
这种更新是瞬 间的,用户几乎感觉不到【31。
(3)带来更好的用户体验。
(4) 可以把以前一些服务器负担的工作转嫁到客户端,利用客户端闲置的 能力来处理,减轻服务器和带宽的负担,节约空间和宽带租用成本。
(5)可以调用外部数据。
(6)基于标准化的并被广泛支持的技术,不需要下载插件或者小程序。
(7) 一步促进页面呈现和数据的分离【31。
Ajax应用的弊端主要表现在以下几个方面:(1)所谓的无刷新,这在客户端经常出现
代码错误,导致有些功能不能使用。
用JavaScript作的Ajax引擎,JavaScript的兼容性是一个问题,并且调.