当前位置:首页 >> 互联网 >>

基于GWT_和J2EE_的Web_开发框架的设计实现与应用_图文

华东理工大学硕士学位论文 基于 GWT 和 J2EE 的 Web 开发框架的设计实现与应用 摘要

第I页

今天 Web 应用程序的界面不再是通过 Web 服务器中的模板生成,而是通过浏览器 中的 JavaScript 生成。用 Ajax 技术构建 Web 应用程序,使 Web 应用程序的架构产生了 一次重大变革。但通过 JavaScript 来编写 Ajax 应用程序,使得开发者很难像使用桌面应 用程序的开发语言那样,灵活地处理应用程序的规模性和复杂性,且 JavaScript 缺少构 建复杂应用程序的语言特性——面向对象编程的结构和在编译时捕获错误的能力。 Google Web Toolkit(GWT)是一款基于 Java 的 Ajax 应用程序开发框架。有了这个 框架,Java(及其它面向对象语言的)开发人员可以不必学习 JavaScript,就能够轻松的 创建 Ajax 应用程序。 如何构建基于 GWT 且适合应用开发的新型开发架构是本文讨论的 重点内容。 本文在研究了 GWT 框架技术和 J2EE 相关技术的基础上,设计并实现了基于 GWT 和 J2EE 的 Web 开发框架,该开发框架提出了基于 GWT 的 Web 应用程序的分层结构, 并详述了基于 GWT 的 RPC 服务扩展框架、应用级控件、模块框架、界面框架、验证 框架的设计与实现,最终该开发框架被应用于企业国有产权交易系统中。本文以样例模 块为例,详述了应用该开发框架开发 GWT 模块的基本过程,同时验证了开发框架的正 确性与实用性。 关键词:GWT;J2EE;框架;RPC

第 II 页

华东理工大学硕士学位论文

The Design Implementation and Application of a Web Development Framework Based on GWT and J2EE Abstract
Web applications now used interfaces that weren’t generated through templates on a web server but with JavaScript in the client’s browser. Using Ajax techniques to build web applications caused an important change in web application architecture. Writing Ajax applications’ programmatic logic in JavaScript, makes it hard for developers to scale an application’s size and complexity the way developers can with languages meant for desktop applications. JavaScript also lacks the language features that dramatically improve the ability to build complex applications, including certain object-oriented programming constructs and the ability to catch errors at compile time. Google Web Toolkit (GWT) is a Java-based application development framework for Ajax. With this framework, Java (and other object-oriented languages) developers do not have to learn JavaScript, will be able to easily create Ajax applications. How to build a new development architecture to fit the application development is the highlights of this paper to discuss. This paper studied the GWT framework and the related technologies of J2EE, designed and implemented the Web development framework based on GWT and J2EE. The development framework set out the GWT application's hierarchical structure and detailed of the RPC framework, the application-level widgets, the module framework, the interface framework and the validation framework. Eventually, the development framework has been applied to the state-owned property rights transction system. In this paper, the sample module, for example, detailed the basic prosess of developing a GWT module with the application development framework, and verified the correctness and practicality of the development framework. Key Words: GWT; J2EE; framework; RPC

华东理工大学硕士学位论文 目录

第 III 页

第1章
1.1 1.2 1.3

绪论......................................................................................... 1

课题研究的背景 .............................................................................................. 1 课题研究的内容和意义 ................................................................................... 2 本文的组织结构 .............................................................................................. 2

第2章
2.1 2.2

相关技术研究 ......................................................................... 4

J2EE 体系结构 ................................................................................................. 4 GWT 体系结构 ................................................................................................ 5

第3章
3.1 3.2 3.3

开发框架的总体设计 ............................................................10

开发框架的设计要求..................................................................................... 10 开发框架的设计分析..................................................................................... 10 开发框架的体系结构..................................................................................... 11

第4章
4.1 4.2 4.3 4.3.1 4.3.2 4.3.3 4.3.4 4.4 4.4.1 4.4.2 4.4.3 4.5 4.5.1 4.5.2

开发框架的设计与实现 ........................................................14

MVC 设计模式的应用................................................................................... 14 系统数据对象的刻画..................................................................................... 15 客户端和 Web 服务层总体设计 .................................................................... 16 业务外观模式应用...................................................................................... 16 客户端结构 ................................................................................................. 17 客户端界面结构 ......................................................................................... 18 Web 服务层结构 ......................................................................................... 18 RPC 服务扩展框架设计与实现 ..................................................................... 19 命令模式应用 ............................................................................................. 19 RPC 服务扩展框架的设计 ......................................................................... 19 RPC 服务扩展框架的实现 ......................................................................... 20 应用级控件层 ................................................................................................ 21 构建应用级控件 ......................................................................................... 21 控件验证功能接口设计 .............................................................................. 22

第 IV 页 4.5.3 4.5.4 4.5.5 4.6 4.6.1 4.6.2 4.6.3 4.7 4.7.1 4.7.2 4.7.3 4.7.4 4.8 4.8.1 4.8.2 4.8.3

华东理工大学硕士学位论文

控件标题功能接口设计 .............................................................................. 23 基本控件设计与实现.................................................................................. 24 控件性能测试 ............................................................................................. 25 模块框架 ........................................................................................................ 29 模块框架设计 ............................................................................................. 29 模块框架实现 ............................................................................................. 30 模块内界面跳转机制.................................................................................. 31 界面框架 ........................................................................................................ 32 模板方法模式应用...................................................................................... 32 单例模式应用 ............................................................................................. 33 界面框架设计 ............................................................................................. 33 界面框架实现 ............................................................................................. 35 验证框架的设计与实现 ................................................................................. 36 验证框架设计 ............................................................................................. 37 Hibernate 验证框架 .................................................................................... 37 数据字典 ..................................................................................................... 38

第5章
5.1 5.1.1 5.1.2

开发框架的应用 ....................................................................40

系统概述 ........................................................................................................ 41 背景............................................................................................................. 41 原则............................................................................................................. 41

5.2 与其它软件的关系 ........................................................................................ 41 5.3 组织结构 ........................................................................................................ 43 5.4 业务过程设计 ................................................................................................ 44 5.4.1 5.4.2 5.4.3 5.4.4 5.4.5 5.5 5.5.1 5.5.2 受理转让申请 ............................................................................................. 44 发布转让信息 ............................................................................................. 44 登记受让意向 ............................................................................................. 45 组织交易签约 ............................................................................................. 46 结算交易资金 ............................................................................................. 46 样例模块实现 ................................................................................................ 47 业务逻辑层设计实现.................................................................................. 47 客户端设计实现 ......................................................................................... 49

华东理工大学硕士学位论文
5.5.3

第V页

Web 服务层设计实现 ................................................................................. 50

第6章
6.1

总结与展望 ............................................................................55

总结................................................................................................................ 55

6.2 展望................................................................................................................ 55

参考文献 ...............................................................................................56 致谢 .......................................................................................................59

华东理工大学硕士学位论文 第1章
1.1 课题研究的背景

第1页

绪论

2003 年由 Macromedia(现今的 Adobe)提出了 RIA 的概念[1]。RIA(Rich Internet Application,富互联网应用系统)技术允许我们在互联网上以一种象使用 Web 一样简单 这对于采用富客户端技术运行复杂应用系统的机构来 的方式来部署富客户端应用系统。 说,RIA 提供了一种廉价的选择。 2005 年 2 月是由 Jesse James Garrett 在一篇文章中提出来 Ajax 的概念[2],Ajax 是 Asynchronous JavaScript XML(异步 JavaScript 和 XML)的简称,是一种创建交互式应 用的网页开发技术。Ajax 刚一提出,其基于构建富客户端的 WEB 应用程序的特性,以 及可开发友好的用户界面,良好的交互性和互操作性,和桌面程序相近的用户体验,使 其得到越来越多的人的青睐,并将其列入 Web2.0 的核心技术。 由于采用 Ajax 的应用程序越来越多,竞争性和应用复杂性也不断增加,使得 Ajax 应用程序的开发面临着可扩展性的考验。针对此类问题,其它应用程序开发技术是通过 面向对象的设计和强大的开发工具来处理的。然而,从技术发展而来的 Ajax 并不是用 来构建应用程序的,更不必说构建大型应用程序。而且也不存在类似辅助桌面应用程序 开发的工具,来辅助 JavaScript 构建大型程序。这种支持是以框架的形式出现的,框架 为构建 Ajax 应用程序提供了更好的基础 (比如 Dojo, 就是一个社区努力的结晶) 。 但是, 无论为构建 Ajax 应用程序开发的库有多少,Ajax 的用途正日益与设计它的初衷背道而 驰。 2006 年 5 月 Google 发布了 Google Web Toolkit(GWT)Version 1.0 RC 1[4]。GWT 刚发布就立即成为 Digg.com 和 Slashdot.org 的头条新闻。GWT 是用来创建 Ajax 应用程 序的强大工具。 尽管眼前已经有很多优秀的 JavaScript 库可以创建优秀的 Ajax 应用程序, 但 GWT 与这些库存在本质的区别。GWT 并不是一个特性丰富的库,它能将用于 Java 开发的大量软件工程工具用于 Ajax 应用程序的开发中。在 GWT 中也可以包含现有的 JavaScript 库,最终的应用程序将会编译并作为 Ajax 应用程序发布,而且这些应用程序 只遵循 Web 标准,也不需要任何新的运行时环境或插件支持。对浏览器而言,它同任 何 Ajax 应用程序没有分别。对开发者而言,则如同是在构建普通的桌面应用程序。这 种改进的开发灵活性和生产力不仅能够使开发者受益,而且,最终将会因为应用程序具 有良好的可用性和健壮性而惠及用户。关键在于,通过 GWT 进行 Ajax 应用程序开发, 能够充分利用高水平的软件工程工具如 JUnit,进行测试驱动的开发,利用像 Eclipse 这 样的 IDE 提供的高级测试支持和动态编译时错误检测功能。GWT 中包含了许多能够辅 助构建 Ajax 应用程序的工具, 比如由部件和面板组成的用户界面库、 通过 HTTP 或 RPC

第2页

华东理工大学硕士学位论文

(Remote Procedure Call)执行异步服务器通信的各个库、同其它使用 JavaScript、JSON 和 XML 的 Web 应用程序交互的工具,以及访问成熟的软件工程开发环境的能力。 但 GWT 只提供了 Web 应用程序的某一层开发框架, 而不是一个完成的应用开发框 架。完整的应用开发框架是整个系统的可重用设计,是构建应用程序的模板。实际上应 用开发框架是一系列设计模式的抽象实现,并提供一些框架基础服务。它预先设置了应 用的体系结构概括了 Web 框架、数据访问框架、业务对象框架、权限管理框架、验证 框架等内部体系之间的相互联系,使开发者能够在此基础上定制自己的应用系统。基于 应用开发框架的编程方法在提高软件开发效率、保障产品质量、降低开发及维护成本方 面具有无可比拟的优势。 1.2 课题研究的内容和意义 本课题是从企业国有产权交易系统的软件开发过程引申而来。这是一次利用 GWT 和 J2EE 构建大型富客户端应用程序的过程,通过对项目的具体分析,结合国内外相关 技术,提出了一套基于 GWT 和 J2EE 的富客户端应用程序的开发框架,并在企业国有 产权交易系统中得以应用。 本课题对 GWT 框架技术进行了深入的研究和分析,并将其用于大型富客户端应用 程序开发中。在研究过程中,我们采用创新性和先进性兼备的原则,希望能够推动富客 户端应用程序相关技术的研究,推进我国软件产业的发展。 论文主要完成的研究工作表现在: (1)GWT 框架技术研究; (2)J2EE 相关技术研究; (3)将 GWT 与 J2EE 结合,设计并实现基于 GWT 的 Web 开发框架; (4)在设计和开发过程中,总结宝贵经验,进行大量测试,得出珍贵数据; (5)将该开发框架应用于企业国有产权交易系统。 最终系统在上海、北京、天津、重庆四家交易机构进行了安装和测试。测试结果表 明,系统有很好的用户体验,系统安全稳定。 1.3 本文的组织结构 第 1 章 绪论 介绍课题的研究背景以及课题研究的内容和意义,最后说明了论文的组织结构。 第 2 章 相关技术研究 研究了 J2EE 的相关技术和 GWT 框架技术,这些技术是开发框架设计、实现与应 用的基础。 第 3 章 开发框架的总体设计 论述了本开发框架的要求,分析了基于 GWT 的开发框架的特点,对开发框架进行

华东理工大学硕士学位论文
了整体设计。 第 4 章 开发框架的设计与实现

第3页

提出了开发框架的分层结构,具体设计并实现了基于 GWT 的 RPC 服务扩展框架、 应用级控件、模块框架、界面框架、验证框架,同时给出了 UML 设计类图和部分核心 代码。 第 5 章 开发框架的应用 对企业国有产权交易系统进行分析,细化系统功能并模块化,将开发框架应用到系 统中,开发典型实例模块,验证框架可行性和实用性。 第 6 章 总结与展望 总结了本课题的主要研究内容, 针对现有工作的不足以及基于 GWT 的 Web 应用系 统的前景做了展望,提出了下一步工作的任务。

第4页

华东理工大学硕士学位论文 第2章 相关技术研究

2.1 J2EE 体系结构 J2EE 是基于分布式的多层应用模型,在这该模型中,应用逻辑按功能划分为不同的 组件,各个应用组件根据它们所在的层分布在不同的机器上。事实上,SUN 设计 J2EE 的初衷正是为了解决两层模式 C/S(Client/Server,客户端/服务器)难于升级、可 伸展性差等弊端。现在 J2EE 的多层分布式应用模型将两层化模型中的不同层面切分成 图 2.1 展示了 J2EE 许多层。 一个多层化应用能够为每种不同的服务提供一个独立的层[7]。 的分布式四层应用模型:

图 2.1 J2EE 的四层模型 Fig. 2.1 The four-layer model for J2EE

(1)运行在客户端机器上的客户端(Client Tier) ; (2)运行在 J2EE 服务器上的 Web 服务层(Web Tier) ; (3)运行在 J2EE 服务器上的业务逻辑层(Business Tier) ; (4)运行在 EIS 服务器上的企业信息系统层(Enterprise Information Systerm Tier) 。 尽管 J2EE 支持四个不同的层:客户端、Web 服务层、业务层和 EIS 层,但不一定 要求每一层在物理上位于单独的计算机体系中。在通常情况下,Web 服务层和业务逻辑 层在同一台服务器 (J2EE 服务器) 上运行, 基于这一点, 这两层被认为是中间层 (Middle Tier)的子层。J2EE 应用也被考虑为三层结构的应用。三层结构的应用程序可以理解为

华东理工大学硕士学位论文
的应用程序服务器。

第5页

在标准的两层结构 C/S 模式的客户端应用程序和后端存储资源中间增加了一个多线程 在实际的项目中,四层的划分往往不能很准确地指导开发,因为在业务逻辑层与数 据库交互的过程中往往需要对数据库调用接口做进一步的封装。这样在项目的开发和维 护上会增加一定的复杂性和管理的难度。一个有效的解决方案是把业务信息按照功能模 块拆分开:业务逻辑与数据库服务器分开,用户界面与业务逻辑分开,彼此相对独立, 任一方的任何改变都不会影响对方,或者影响不大。因此可以在业务逻辑层和数据库层 之间增加一个数据持久层。将数据持久逻辑和业务逻辑分离,业务逻辑层通过数据持久 层与数据库交互,数据持久层位于数据库之上,隐藏数据读取和操纵中的所有数据访问 代码细节,将客户应用程序和底层存储机制隔离开。这样使得各层功能简洁、专一,降 低各层之间的藕合。图 2.2 展示了 J2EE 五层应用模型:

图 2.2 J2EE 五层模型 Fig. 2.2 The five-layer model for J2EE

2.2 GWT 体系结构 如今,编写网络应用程序是一个单调乏味且易于出错的过程。开发人员可能要花费 90%的时间来处理浏览器之间的兼容性。此外,构建、重复使用以及维护大量 JavaScript 代码库和 AJAX 组件可能困难且不可靠。Google Web 工具包( GWT)通过允许开发人 员用 Java 编程语言快速构建和维护复杂但高性能的 JavaScript 前端应用程序来减轻该负 担[10]。 GWT 为用 Java 而不是 JavaScript 写浏览器端代码,提供了一系列工具和解决方案。 图 2.3 展示了 GWT 的体系结构:

第6页

华东理工大学硕士学位论文

图 2.3 GWT 的体系结构 Fig. 2.3 The Architecture of GWT

(1)GWT 的 Java-to-JavaScript 编译器 GWT 编译器[11]的职责是将 Java 代码编译成 JavaScript 代码, 就像 Java 编译器将 Java 代码编译成字节码一样。GWT 编译器运行 GWTCompiler 编译 GWT 模块。在模块中通 常会定义一个入口点类,GWT 编译器从入口点开始,编译所有需要编译的 Java 代码。 GWT 编译器与标准的 Java 编译器不同,它在编译的时候只会加载那些在入口点用到的 类而不是所有的类。 (2)GWT 的 JSNI 技术 JSNI[11]是 GWT 提供的一项非常有用的技术,JSNI 可以封装 JavaScript 代码,将 JavaScript 代码整合到 GWT 客户端的 Java 代码中,并且可以实现客户端 Java 代码和 JavaScript 代码之间的相互通信, 所以非常合适将以已有 JavaScript 程序迁移到 GWT 中。 (3)GWT 的 JRE Emulation 在 JRE 模拟类别中包含了一个 JRE 库的一个子集,用于辅助开发者完成常见的编 程任务。例如,基本的 Java 类型、异常和集合等。我们知道,Java 语言提供了许多库, 用于构建各种应用程序。为了利用现有资源,GWT 模拟了 JRE 中两个最常用的库,没 有创建新库。通过模拟,能够为开发者提供熟悉的类,从而使开发更加方便。把这个类 列称为模拟是因为在部署 GWT 应用程序时,不会使用 JRE 中的类。GWT 编译器会把 用到的 JRE 类替换成等价的 JavaScript 代码。 (4)GWT 的控件和面板 通过使用 com.google.gwt.user.client.ui 包中的类,开发者能够像使用 Java 的 AWT 技术一样,来创建动态的用户界面。这个包中的类是基于 Web 浏览器的用户界面特性 构建的,用于提供可重用的组件,这些组件称为部件,涉及到从简单的按钮、标签到复 杂的选项卡面板和树形视图。这些部件,有的直接映射为普通网页中经常用到的 HTML 元素,有的则是一些 HTML 元素、脚本和事件处理操作结合的产物。

华东理工大学硕士学位论文
GWT 中部件分类:

第7页

静态部件:指那些不具有交互性,只会根据应用程序中某些操作的结果改变状态的 部件。 表单部件:指简单地包装 HTML 元素并用于构建 Web 表单的部件,包含文本框和 按钮等。 复杂部件:指对浏览器而言的一组新 UI 特性,它们由 HTML 标签和 JavaScript 事 件处理代码复合而成。 剩下的部件类别都与面板有关。其中,简单布局面板和复杂布局面板一般用作其它 部件的上层部件。每种布局面板都遵循唯一的布局模式。另外两种面板——简单容器面 板和复杂容器面板,不涉及界面布局,只是作为其它单一子部件的特殊容器使用。 (5)GWT 的国际化 通过 GWT 构建的应用程序是以 Web 方式进行分发的,也就是说要向全球分发。为 此,经常需要涉及到根据不同的语言,转化文本字符串和格式化样式。这种转化的过程 成为国际化[13](i18n,i18n 是 internationalization 的一般简写形式。其中,I 和 N 引用其 。GWT 为应用程序国际化 第 1 和最后 1 个字母,而 18 指的是 I 和 N 之间有 18 个字母) 提供了相应的类。这些类包含在 com.google.gwt.i18n.client 包中。 (6)GWT 的 RPC GWT 应用程序与传统的 HTML Web 应用程序最基本的不同在于 GWT 程序执行时 不需要更新整个 HTML 界面,GWT 应用程序可以在浏览器中像桌面应用程序那样,只 更新界面中需要更新的部分。 像其它 C/S 应用程序一样, GWT 应用程序执行时需要从 服务器取得数据。这种通过网络与服务器进行交互的机制称为远程过程调用(Remote Procedure Call,简称 RPC)[13]。 如果应用 RPC 得当,可以实现在客户端处理 UI 逻辑,以提高程序执行效率、减少 带宽使用量、降低 Web 服务器负载,并能改善用户体验。 GWT 中的 RPC 常被称作服务(Service) ,每个服务有一些辅助的接口和类,有些 辅助类是 GWT 后台自动生成的,每个服务的辅助类大致相同。图 2.4 展示了 GWT 的 RPC 机制的 Java 组件。 GWT 通过提供 RPC 库(Remote Procedure Call,远程过程调用) ,扩展了浏览器与 服务器异步通信的能力。一般来说,远程过程调用的目标是通过为开发者提供能够像常 规方法一样调用接口方法,来简化对服务器进行调用的任务。调用会被编组并发送到远 程服务器。服务器在收到编组数据后,会对其进行解组处理并在服务器上调用相应的方 法。

第8页

华东理工大学硕士学位论文

图 2.4 GWT RPC 机制的 Java 组件 Fig. 2.4 Java components of the GWT RPC Mechanism

(7)GWT 的 XML 解析器 该 XML 解析 GWT 的 XML 解析器[13]为应用程序提供解析和构造数据格式的能力。 器由 com.google.gwt.xml.client 包提供。通过 XML 包,开发者可以在应用程序中解析 XML 文档,并能基于文档对象模型迭代遍历 XML 文档的内容。而且,也可以使用这个 将这个包与 HTTP 包一起使用,可以把 XML 包来构造文档对象模型和生成 XML 文档。 文档发送到服务器,也可以从服务器接收 XML 文档。 还有一个 JSON 包 com.google.gwt.json.client 与 XML 包类似,只不过数据格式为 JSON 而不是 XML。JSON 与 XML 类似,也是一种层次化的数据格式,但它的量级更 轻(文件更小) 。通过这个库能够生成和解析 JSON 数据。 (8)GWT 处理浏览器 History 的机制 不能很好地处理界面变化是许多 Ajax 应用程序中的常见问题。GWT 为此提供了一 种妥善的解决方案,即组合使用浏览器的历史特性和 HTML 锚。当用户单击链接向前 移动时,应用程序不会刷新界面但能够跟踪自身的状态变化。如果用户单击后退按钮, 应用程序会接受到一个事件并根据锚的记号值确定状态已经变为前一个。然后调整其状 态来反映这一变化。当用户在新窗口中基于一个记号打开 Ajax 应用程序时,应用程序 也可以根据该记号来呈现适当的状态。要实现上述能力,需要考虑好一个应用程序状态 模型,也就是如何使用字符串记号来表示状态。 在确定了与历史记号对应的状态粒度之后, 使用 GWT 的 History 类来管理并从浏览 器的历史堆栈中接受事件。要添加新的历史记号,可以使用 History.addToken 方法,调 用该方法相当于用户单击了一个 Hyperlink 部件。 执行该方法会在当前 URL 的末尾添加 一个“#”符号和相应的记号。在完成了向历史记录中添加记号的操作之后,应用程序接

华东理工大学硕士学位论文
口,并将该接口添加到 History 类中。 (9)GWT 集成了 JUnit

第9页

下来就应该对历史堆栈中的变化做出响应。为此,需要实现 GWT 的 HisrotyListener 接

JUnit 是另外一种优秀的 Java 工具[22],用于为应用程序创建自动化的测试。JUnit 提供了辅助构建和组织测试类,例如测试预期结果的断言,用于建立若干测试的测试用 例基类,以及在一个测试套件中完成联合测试的机制。要为 JUnit 创建一个测试用压力, 需要扩展 TestCase 类。但 GWT 应用程序要求在特殊的环境下开发,因此 GWT 提供了 对应的 GWTTestCase 类。从 1.4 板开始,GWT 就包含了一个基准测试子系统,该系统 可以为开发 Ajax 应用程序提供基于性能改进的辅助。这个基准测试子系统需要与 JUnit 一起工作。要通过 JUnit 对代码进行基准测试,需要使用 GWT 的 Benchmark 测试用例, 而不是 GWTTestCase。 使用这个类导致基准测试子系统的介入,并度量每次测试的时间 长度。在测试完成后,基准测试系统将结果以 XML 文件的形式写入磁盘。虽然直接打 开这个 XML 文件也能查看结果, 但是 GWT 提供的基准测试查看器 (benchmark Viewer) 应用程序中查看则更为方便。

第 10 页

华东理工大学硕士学位论文 第3章 开发框架的总体设计

3.1

开发框架的设计要求 开发框架是将以往的设计和开发经验用以模式相似的应用当中,并提供一种经过验

证、切实可行的方案。 本开发框架应尽可能简化开发 GWT 应用的复杂度,并提供统一的应用开发模式。 保证使用本开发框架开发时,可以使控制、逻辑和表示分离,这样不同角色的开发人员 就可以并行工作,减少相互制约。本开发框架要做的工作如下: (1) 为 GWT 模块的开发提供基本支持。 如应用级控件、 模块框架、 界面框架、 RPC 服务扩展框架、验证框架等。 (2)提供丰富且功能完善的应用级控件,统一界面合格,简化界面开发,减少开发 人员的工作量。 (3)为 GWT 模块提供模块框架,提炼出应用中 GWT 模块的共同特点,形成模块 框架,为 GWT 模块提供基本功能。如模块权限校验功能和模块内界面的切换机制等。 (4)为 GWT 模块提供 RPC 服务扩展框架,该 RPC 服务扩展框架扩展了 GWT 本 身的 RPC 框架,提高了 GWT 应用服务的可扩展性。 (5)为 GWT 界面提供界面框架,使开发人员只需关注与业务相关的界面元素,而 不需要在界面的整体布局、界面的样式和界面的操作等方面花费较大功夫。 (6)为 GWT 模块提供验证框架,通过验证框架完成对数据的验证,开发人员只需 要定义数据字段相关信息,不需要实现验证代码,就可以完成验证功能。 (7)提供大部分 GWT 应用的基础功能,让开发人员只需关心业务模块的实现,而 不需重复开发这些基础功能。如:人员功能、角色功能、权限功能、系统日志功能、菜 单功能等。 3.2 开发框架的设计分析 GWT 应用最终发布到网上其实是 Ajax 的富客户端应用,它可以将服务端的业务逻 辑搬到客户端,客户端与服务端在协同工作时各自需要承担哪些职责和角色,这需要在 工程实践中探索。 下面就 GWT 应用的特点进行分析:首先不管业务逻辑能不能放到客户端,客户端 的职责是基本相同的: ? GWT 客户端是 GWT 应用直接与用户交互的部分, 所以客户端的用户界面需要设计 友好且方便使用。GWT 客户端需要处理用户请求,可以处理业务逻辑,但不是所有 的业务逻辑都适合放到客户端,哪些适合放在客户端,哪些适合放在服务端,下面

华东理工大学硕士学位论文
分析几种情况:

第 11 页

首先,大计算量的工作就不宜放在客户端,因为 JavaScript 计算效率比较低,而且 不具有多线程的能力,所以,很容易导致阻塞用户。例如,一些大规模科学计算的工作 不宜放在客户端。 其次,在多个客户端数据需要同步处理时,虽然各个客户端都可以收到所有数据后 再进行处理,但这样会增加通信流量。如果有 n 个客户端,那么每个客户端的数据需要 转发给 n-1 个客户端,数据需要转发 n(n-1)次,而服务器处理则只需发送 n 次即可;而 且冗余的数据传输和计算可能导致各个客户端处理结果不同。如:在多协同应用和游戏 应用中比较常见。 再次,需要频繁访问服务器数据的工作不易放在客户端处理,因为在一个处理周期 内,如果频繁访问服务器,不但增加通信负担,还会降低处理效率,应该把这样的业务 逻辑放在服务器上处理。例如,数据统计工作放在服务端处理为好。 最后,当对数据的安全性有较高要求时,即使将客户端数据发送到服务器端的开销 大,也应该考虑在服务器端对数据进行安全处理,因为除了采用证书加密的方式外,其 它的 HTTP 方式(包括 HTTPS) 都存在安全隐患,有可能在通信过程中被人窃取机密 数据,而且 JavaScript 是解释执行的语言,可以通过调试工具在客户端查看数据,所以 数据的安全处理需要在服务器端做。 ? GWT 客户端应该缓存部分数据。GWT 应用的通信粒度比传统 Web 应用要小,如果 为了响应用户而频繁向服务器发出请求, 必然会消耗大量带宽, 增加服务器的负担。 应用程序对数据的使用是不均匀的,大部分情况都是集中使用某些数据,这也正是 缓存技术在计算机硬件,操作系统,数据库,应用服务器等领域中得到广泛应用的 原因。为了有效减小通信开销,提高应用效率,客户端提供数据缓存机制是十分必 要的。 ? GWT 客户端应该提供一定的安全机制。 JavaScript 代码是明文解释执行的动态语言, 且程序代码是公开的,所以在程序中比较容易注入恶意代码,因此程序和程序中的 数据安全问题比传统 Web 应用和桌面应用要大,目前的浏览器技术不足以保证 JavaScript 代码的绝对安全(实际上也没有任何安全机制是绝对安全的) ,但良好的 设计可以极大限度得降低安全风险,这是 GWT 客户端设计中必须考虑的问题。 3.3 开发框架的体系结构 开发框架的设计采用典型的多层结构,可分为客户端、Web 服务层、业务逻辑层、 数据持久层、 数据层, 各层之间相对独立且松散耦合, 保证了开发框架具有良好的结构。 开发框架提供了一些常用的可复用基础构件和界面控件,这些构件可以给开发带来很大 的方便。开发框架中包含的模块框架和界面框架使得界面开发遵循统一的界面布局,使

第 12 页

华东理工大学硕士学位论文

用统一的界面交互控制,减少了界面开发的复杂度。开发框架集成了目前多种流行的开 源框架,如 GWT、EJB、Hibernate,使开发人员可以按照开发框架提供的模式充分利用 这些框架提供的功能。开发框架还提供了统一的异常处理和数据传输机制,并实现常用 的基础功能。这样开发框架既利用了现有的优秀技术,又在整合这些技术基础上形成了 一套有效的开发模式,使得 GWT 开发不需要从零开始,而是可以直接在开发框架的基 础上开发业务应用。图 3.1 展示了开发框架的体系结构:
JAVA EE 5 架构 基础功能 人员管理 权限管理 角色管理 菜单管理 日志管理 机构管理 系统配置 升级策略 功能视图

客户层/web层(GWT) 界面控件 用户 界面框架

业务逻辑层 (EJB)

数据持久层 (Hibernate)

数据库

模块框架

图 3.1 开发框架的体系结构 Fig. 3.1 The Architecture of the Development Framework

(1)客户端 GWT 允许用 Java 编写客户端代码, GWT 编译器将 Java 代码编译成 JavaScript 代码, 在客户端浏览器运行,动态生成展示界面。 (2)Web 服务层 GWT 应用程序的 Web 服务层由 Servlet 构成,这些 Servlet 都是继承 GWT 中 com.google.gwt.user.server.rpc 包下的 RemoteServiceServlet 类, Web 服务层负责就收客户 端请求,调用业务逻辑层的业务方法,返回结果给客户端。 (3)业务逻辑层 业务逻辑层主要负责管理业务逻辑层的逻辑对象,包括逻辑对象对于底层的事务管 理,分布式管理,逻辑对象的生命周期管理,同时还维护逻辑对象之间的调用关系,好 的业务逻辑层框架可以使系统易于开发。业务逻辑层构件采用面向接口的设计,降低程 序各部分之间的耦合。 开发框架中采用 EJB 实现业务逻辑层。一个企业 JavaBean (EJB)是一个可重用的, 可移植的 J2EE 组件。EJB 由封装了业务逻辑的多个方法组成,EJB 运行在一个容器里, 允许开发者只关注与 bean 中的业务逻辑而不用考虑象事务支持,安全性和远程对象访 问等复杂和容易出错的事情。EJB 以 POJO 对象的形式开发,开发者可以用元数据注释

华东理工大学硕士学位论文
来定义容器如何管理这些 Bean。

第 13 页

EJB 主要有三种类型:实体 Bean,会话 Bean 和消息驱动 Bean。实体 Bean 是一个 代表存在于数据库中业务对象的复杂业务实体。会话 Bean 完成一个清晰的解耦任务。 消息驱动 Bean 用于接收异步 JMS 消息。 (4)数据持久层 从软件工程的角度来看,数据持久层实际上是为了解决面向对象的编程语言与传统 的关系型数据库之间的矛盾而设计的一种过渡性解决方案,因此数据持久层又称为 O/ R(Object/Relation)Mapping 层[16]。在使用面向对象的编程语言系统中,使用关系数 据库存储和读取对象数据的方式可以分为如下五种:1.JDBC 直接访问数据库 2.主动 域对象模式 3.CMP 模式 4.ORM 模式 5.JDO 模式。设计持久层的目标是对数据库操 作进行屏蔽,而只提供给业务逻辑层相应的数据对象接口。业务类可以通过这些接口实 现对数据库的相关操作。 开发框架中采用 Hibernate 实现数据持久层。在企业环境中,把面向对象的软件和关 系数据库一起使用可能是相当麻烦、浪费时间的。Hibernate 是一个面向 Java 环境的对 对象/关系数据库映射 (object/relational mapping (ORM) 象/关系数据库映射工具[19]。 这个术语表示一种技术,用来把对象模型表示的对象映射到基于 SQL 的关系模型数据 结构中去。Hibernate 不仅仅管理 Java 类到数据库表的映射(包括 Java 数据类型到 SQL 数据类型的映射) ,还提供数据查询和获取数据的方法,可以大幅度减少开发时人工使 用 SQL 和 JDBC 处理数据的时间。 (5)数据层 数据层一般采用关系型数据库存储应用数据。 由于采用了数据访问层隔离数据操作, 保证了开发框架可以容易的获得跨数据库的能力。开发框架支持常用的大型关系型数据 库,如 DB2,MS SQL Server,Oracle,InforMix[21]。 (6)基础功能应用 开发框架提供了应用系统一些通用的基础功能,使得开发应用系统时,只需要实现 应用的业务需求即可, 而对一些基础的系统功能则不需要进行开发或只需要进行简单的 二次开发,并且这些基础功能也是在开发框架的基础上进行应用开发的极佳范例。基础 应用功能和具体的业务应用相对独立,主要包括:用户管理、角色管理、权限管理、机 构管理、员工管理、菜单管理、系统配置、日志管理、功能视图、升级策略等。

第 14 页

华东理工大学硕士学位论文 第4章 开发框架的设计与实现

4.1 MVC 设计模式的应用 MVC(Model-view-Controller)[17]是八十年代为编程语言 Smalltalk 发明的一种软件 设计模式,由模型(Model) 、视图(view) 、控制器(Controller)三部分构成。该模式 使应用程序的输入、处理和输出相互独立,使程序结构更加清晰,从而大大提高代码重 用率。图 4.1 展示了 MVC 设计模式结构:

图 4.1 MVC 模型 Fig. 4.1 MVC Model

(1)模型(Model) :负责业务数据处理,实现业务功能,如业务数据的取得、数 据的处理、事务的处理、状态的变化。 (2)视图(View) :代表与用户交互的界面,对于 web 应用来说,可概括 HTML 界面,但也可能是 XHTML、XML 和 Applet 等。 (3)控制器(Controller) :解释用户的输入并将其映射到模型,同时定义应用程序 的行为,分派用户的请求并选择恰当的视图用于显示。 本开发框架总体设计符合 MVC 设计模式,模型(Model)由 EJB 组件构成,控制 器( Controller )由 Web 容器中的 Servlet 构成,这些 Servlet 都是扩展 GWT 中 com.google.gwt.user.server.rpc 包下的 RemoteServiceServlet 类, 该类是 HttpServlet 的子类, 这些 Servlet 不负责选择视图,只负责将结果返回给客户端。控制界面如何显示是在客 户端浏览器通过 JavaScript 来控制。视图(View)不是由 Web 容器中的 JSP 和 Servlet 模板生成,而是由 GWT 编译器编译出的 JavaScript 在浏览器中动态生成。 GWT 工程结构将客户端代码和服务端代码区分开,客户端代码放在模块下的 client 包下,服务端代码放在模块下的 server 包下。客户端的代码经过 GWT 编译器编译后生

华东理工大学硕士学位论文

第 15 页

成 JavaScript 代码,server 端的代码为客户端提供服务。在 GWT 模块中还有一个 public 文件夹,在该文件夹中放模块的静态资源,如 html、css、图片等,GWT 模块运行时, 编译好的 JavaScript 代码会嵌入到 html 中与 css、图片等静态资源一起在浏览器中发挥 作用。表 4.1 展示了标准 GWT 模块结构:
表 4.1 GWT 模块结构 Table 4.1 The structure of the GWT module 包名 com\..\moduleName\ com\..\moduleName\client\ com\..\moduleName\server\ com\..\moduleName\public\ 作用 模块的根目录,包含模块 XML 文件 存放客户端代码 存放服务端代码 存放静态资源,如.html,.css,图片等

使用标准的 GWT 模块结构可以有效地区分客户端和服务端的代码,给开发带来很 大便利,以免开发中不必要的麻烦。 4.2 系统数据对象的刻画 本开发框架的总体设计符合 MVC 设计模式,模型(Model)由 EJB 组件构成。系 统采用 EJB 组件的 Entity Bean 刻画业务对象(以下简称为 E 对象)类似于 Struts 提供 的 ActionForm,EJB 组件的 Session Bean 实现操作 E 对象的业务方法,类似于 Struts 中 的 Action,但在 GWT 应用程序中客户端不能直接用 E 对象,需要有一个与 E 对象对应 的对象以下简为 B(Browser)对象,该对象在采用 GWT 编写客户端代码时使用,这是 一个可序列化的 POJO 类,同时在 B 对象中也封装了相关的逻辑运算。E 对象和 B 对象 在 Web 服务层进行相互转换。 B 对象的两个重要功能: (1)传递数据 界面展示的数据通常是业务对象的数据,客户端通过 GWT 的 RPC 调用在 Web 服 务层取得 E 对象,E 对象转换成 B 对象后,B 对象携带数据信息,传递给客户端,供客 户端使用。反之,客户端也可以通过 GWT 的 RPC 调用将携带客户端信息 B 对象传递 给 Web 服务层,B 对象转换成 E 对象,调用业务方法,最终保存到数据库。 (2)充当客户端的逻辑层 富客户端应用程序的一个最大特点就是将服务端的部分逻辑运算转化到客户端,在 B 对象中也可以封装逻辑运算,实现了数据可客户端的缓存和运算。可以充分利用客户 端的计算能力,提高响应时间和减轻服务器负载。 E 对象和 B 对象属性名称通常是相同的, 在 Web 服务层可编写工具类 Converter.java, 该类提供 autoAssign(S source, T dest)方法,实现自动转换源和目标中相同名称的属性,

第 16 页

华东理工大学硕士学位论文

这样就不用写大量的 getter 和 setter 方法了。图 4.2 展示了 E 对象和 B 对象的转换过程:

图 4.2 E 对象和 B 对象的转换过程 Fig. 4.2 The Transformation Process of the E objects and B objects

4.3

客户端和 Web 服务层总体设计 本开发框架的设计遵守 JAVA EE 5 规范,采用 GWT 实现客户端框架,Web 服务层

负责接收客户端请求, 调用业务逻辑层的业务方法, 并将结果返回给客户端。 基于 GWT 的 Web 应用程序的客户端和服务层与以往的 Web 应用程序结构不同。图 4.3 展示了基 于 GWT 的客户端和 Web 服务层结构:
客户层(GWT) 业务界面 业务逻辑层(EJB) 业务实现

界面框架 Web层 模块框架 业务调用

应用级控件

工具包

Web层框架

gwt-user.jar

RPC

gwt-servlet.jar

图 4.3 客户端和 Web 服务层的结构 Fig. 4.3 The Structure of the Client Tier and the Web Tier

4.3.1 业务外观模式应用 本开发框架的设计面向企业级 Web 应用,考虑到模块较多,防止模块间紧耦合的情 况,Web 服务层按照业务外观模式设计,这也符合 GWT 模块设计的方式,每个 GWT

华东理工大学硕士学位论文
观,调用业务方法,为客户端提供服务。

第 17 页

模块都有一个相对独立的 Servlet,该 Servlet 则是整个业务层(EJB 层)对该模块的外 业务外观层(Business Facade)[23]的目的,是隔离系统功能的提供者和使用者,更 明确地说,是隔离业务逻辑和软件的用户界面,为子系统中的一组接口提供一个一致的 界面。这一层没有任何需要处理的逻辑,只是作为后台逻辑处理和前端用户界面的缓冲 区,以达到如下目的: (1)将用户界面和系统业务逻辑处理分开,这样,当业务逻辑发生变化时,不用修 改客户端程序,是一种支持变化的设计方法。 (2)使同一个业务逻辑能够处理不同的客户端请求。例如,可以将 Facade 设计成 Web Service, 这样, 可以同时为传统的客户端程序、 Web 程序及其它外部系统提供服务, 同时,也可以实现系统的分布式部署。 (3)作为系统不同模块之间的调用接口。系统通常会包含很多模块,这些模块相对 独立,又可能互相调用。为了减少各个部分之间的耦合度,必须采用一定的设计方法, Facade 设计模式就是非常有效的一种,也是业务外观层的基础。 (4)有利于项目团队的分工协作。业务外观层作为一个访问接口,将界面设计人员 和逻辑设计人员分开,使得系统的开发可以实现纵向的分工,不同的开发人员可以关注 自己的领域而不会受到干扰。 业务外观层的代码框架, 在系统分析和设计完成后就可以确定, 它需要提供的方法, 就相当于在界面设计人员和逻辑设计人员之间签订了一个协议,它虽然没有实现任何逻 辑,但是,它的引入,能使系统的开发更加有条理,更加简明。当然,如果不考虑多种 客户端的情况,也不考虑分布式部署的问题,系统的模块又很少,不会产生模块间紧耦 合的情况,那么可以不使用业务外观层,而让用户界面程序直接访问业务功能。 4.3.2 客户端结构 客户端采用 GWT 实现,可分为以下几个部分: (1)gwt-user.jar:所有 GWT 应用程序要在 Host 模式下运行都需要用到这个 jar 包, 该包是支持 GWT 应用程序的基础包。 (2)应用级控件:该层是在 GWT 控件库基础上再开发应用级控件,因为 GWT 提 供的控件库只是一些基本的控件, 开发企业级应用系统这些控件的样式和功能还是不够 的,而且 GWT 并不能提供开发者想要的所有控件,因此需要再开发,添加这一次层, 可以对整个系统的控件有一个整体控制,而且提供更加完善的功能后可以减少开发人员 的工作量。 (3)工具包:为客户端提供工具类,如模块间跳转功能、数据类型转换等。 (4)模块框架:客户端由许多 GWT 模块组成,这些模块都会纳入模块框架中,模 块框架提供了 GWT 模块加载、显示、布局、界面跳转、安全检查等系列机制。

第 18 页

华东理工大学硕士学位论文

(5)界面框架:GWT 的每个模块中有多个界面构成,界面框架提供了界面的整体 显示、布局、数据加载、安全检查等机制,封装了大量公共方法。这样既简化了业务界 面开发又指定了统一的规范,界面风格统一,代码结构一直,便于开发和维护。 (6)业务界面:业务界面根据具体业务定制不同的控件,安排控件布局展示业务数 据,完成业务操作,该层由各开发人员完成,最终为用户使用。 4.3.3 客户端界面结构 图 4.4 展示了一个 GWT 模块的界面结构, 该结构是应用中最常用的结构, 提供了新 增、编辑、查看、列表界面。可以看到模块框架和界面框架的位置,模块框架和界面框 架在 GWT 模块开发中起到了很大作用,具体设计与实现见 4.6 和 4.7 节。

图 4.4 GWT 模块的界面结构 Fig. 4.4 The Interface Structure of the GWT Module

4.3.4 Web 服务层结构 Web 服 务 层 由 Servlet 构成 ,这 些 Servlet 称 为 服务 类, 都是 扩展 GWT 中 com.google.gwt.user.server.rpc 包下的 RemoteServiceServlet 类。 Web 服务层可以分为以下 几个部分: (1)gwt-servlet.jar:该包是 GWT 应用程序运行在服务端的基础包。 (2)Web 服务层框架:如果让服务类直接继承 RemoteServiceServlet 就失去了对所 有服务类进行全局控制的机会。 Web 服务层框架扩展 RemoteServiceServlet, 在该层可进 行服务器端的权限验证,异常的拦截与信息的改造,验证登录信息,传递操作信息(人 员信息、组织结构、IP 等信息) ,封装大量服务端公用方法。 (3)业务调用层:调用具体的业务方法,返回结果,为客户端提供服务。

华东理工大学硕士学位论文
4.4 RPC 服务扩展框架设计与实现 4.4.1 命令模式应用

第 19 页

Command 模式[29]将一个请求封装为一个对象,从而使开发者可用不同的请求对客 户进行参数化,对请求排队或记录请求日志,以及支持可撤消的操作。 有时必须向某对象提交请求, 但并不知道关于被请求的操作或请求的接收者的任何 信息。 例如, 用户界面工具箱包括按钮和菜单这样的对象, 它们执行请求响应用户输入。 但工具箱不能显式的在按钮或菜单中实现该请求,因为只有使用工具箱的应用知道该由 哪个对象做哪个操作。而工具箱的设计者无法知道请求的接收者或执行的操作。 Command 模式通过将请求本身变成一个对象来使工具箱对象可向未指定的应用对象提 出请求。这个对象可被存储并像其它的对象一样被传递。 Command 模式抽象出待执行的动作以参数化某对象。可用过程语言中的回调 (Callback)函数表达这种参数化机制。所谓回调函数指的是函数先在某处注册,而它 将在稍后某个需要的时候被调用。Command 模式是回调机制的一个面向对象的替代品。 GWT 的 RPC 框架则是 Command 模式的回调机制的一种极好应用。 4.4.2 RPC 服务扩展框架的设计 开发框架采用 GWT 的 RPC 框架实现客户端与 Web 服务层进行通信,如果直接用 GWT 的 RPC 框架不便于系统以后的进一步扩展,而且不能对整个系统的服务进行统一 的控制。开发框架的 RPC 服务扩展框架扩展了 GWT 的 RPC 框架,这样可以统一控制 系统的服务。在该服务框架中封装了系统大多模块要实现的服务功能,如取得登录人员 的相关信息、记录模块的操作日志等,这样减少重复代码,大大提高系统的扩展性,同 时也可以为所有模块统一添加或删减服务。图 4.5 展示了 RPC 服务扩展框架。 其中,RPC 服务扩展框架需要完成的功能: (1)实现客户端服务请求接口中的功能,这些功能是大多数模块在客户端都要使用 的,通过 GWT 的 RPC 框架实现; (2)提供服务端权限检查的机制; (3)截获异常,并重新构造异常信息,开发模式下希望异常信息比较详细,以便于 定位到错误,而在生产模式下,需要异常信息比较友好; (4)进行登录安全检查; (5)提供基本业务方法,如取得当前组织,取得当前登录用户等。 上述服务功能是为系统全局提供的,如果该功能需要供客户端使用则需要将该功能 放在客户端的服务调用接口中,如:取得当前用户信息功能,客户端需要用到用户信息 进行业务判断。如果该功能仅在服务端起作用,为其它服务提供共有功能则不用放在客 户端的服务接口中,如:服务端权限检查。

第 20 页

华东理工大学硕士学位论文

图 4.5 RPC 服务扩展框架 Fig. 4.5 The RPC Services Framework

4.4.3 RPC 服务扩展框架的实现 图 4.6 展示了 RPC 服务扩展框架的实现类图:

图 4.6 扩展 GWT RPC 的框架类图 Fig. 4.6 The Class Diagram of the Extended Framework about GWT RPC

?

服务接口 BaseRemoteService(BaseRemoteServiceAsync 为异步接口) (1)方法 getCurrentSession():取得当前会话信息,这里的会话信息是封装的一个

可序列化的对象,其中含有当前用户、当前组织等信息。具体 GWT 模块的会重写 getCurrentSession()方法,向当前会话中添加该模块需要的信息,如:权限信息等。该方 法放到了客户端服务接口中,因为客户端需要根据取得当前会话信息进行逻辑判断。 (2)方法 saveLog():保存模块的相关信息,如进入什么模块,进入模块后的系列

华东理工大学硕士学位论文
? 服务实现类 BaseRemoteServiceServlet (1)方法 login():登录系统方法,登录成功后设置当前用户的信息。 (2)方法 logout():登出系统方法,登出系统设置当前会话无效。

第 21 页

信息。该方法放到了客户端服务接口中,因为它记录的是客户端模块的操作日志。

(3) 方法 checkLogin(): 检查当前是否已经登录,若当前没有登录将导致抛出异常。 (4)方法 checkPermission(); 检查当前登录用户是否拥有指定的权限。 (5)方法 buildException():Service 标准异常处理。设计用于 Service 最外层调用。 将自动产生错误信息到日志, 并将消息以 SerializableException 的方式将异常信息返回给 客户端。 (6)方法 getSessionUser():取得当前用户。 (7)方法 getSessionOrganization():取得当前组织。 4.5 应用级控件层

4.5.1 构建应用级控件 构建应用级控件的原因:统一界面风格;获得较好的用户体验;提高界面开发人员 的效率;完善功能,如验证功能;业务特殊需求。GWT 本身包含了一套部件,这套部 件不仅全面完善,而且即装即用。当然,GWT 也不可能包含开发人员能想到的任何部 件。GWT 提供的控件在企业级应用中还需要再扩展或再创建以适合应用背景。 尽管 GWT 的第三方控件库目前层出不穷,如:MyGWT,GWT-Ext,Ext-GWT, SmartGWT 等,这些控件不但美观而且提供的强大的功能。本文建议在使用这些控件库 前需要在应用环境下对其提供的控件进行相关性能测试,因为运行在浏览器的 Ajax 应 用程序客户端性能尤为重要。在 4.5.5 节中将在 GWT 基础上开发的控件与 GWT-Ext 的 控件进行了性能测试和比较,前者表现为较好的性能,因此本框架处于性能考虑没有采 用第三方控件库,而采用在 GWT 本身的控件库进行再开发。图 4.7 展示了在 GWT 中 自定义部件有 3 种方式:
Create New Widget

Direct from DOM Elements

Extends an Existing Widget

Create a Composite Widget

图 4.7 定义 GWT 部件的 3 种方式 Fig. 4.7 The Three Kinds of Ways to Define the GWT Components

(1)低级部件,由 DOM 元素构成。低级部件扩展 GWT 的 Widget 类。

第 22 页

华东理工大学硕士学位论文

(2)间接部件,是现有部件的扩展。间接部件要扩展 GWT 的 Widget 类的子类。 (3) 复合部件, 由一或多个现有部件复合而成。 复合部件要扩展 GWT 的 Composite 类。 这 3 种方式在应用级别控件中大量运用。首先在工程当中新建一个 Module,命名 为“widget”,这是一个独立的 Module,其它 Module 通过引用 Widget.gwt.xml 使用其中 的控件。 4.5.2 控件验证功能接口设计 本框架应用级控件设计要添加一个主要的功能就是添加控件的验证功能。控件与数 据字典配合实现验证功能,这样在客户端就可以验证,提高用户体验,减少与服务端交 换的次数,大大提供系统的性能,减少程序开发量。图 4.8 展示了验证功能的接口设计 类图:

图 4.8 验证功能的接口类图 Fig. 4.8 The Interface Class Diagram of the Validation

?

接口 HasRValidator:标记表单域控件具有验证器的功能,普通的字段控件和容器控 件均可实现此接口,从而实现递归的验证。 (1)方法 clearValidResults():清除所有验证结果信息。 (2)方法 boolean isValid():取得当前是否验证通过。 (3)方法 List<MessageRecord> getInvalidMessages():验证非法时的提示信息。 (4)方法:boolean validate():执行验证。

?

接口 RValidator:表单域验证器。 (1)方法 ValidResult validate(Widget sender, String value):验证表单域的值。参数

sender:表单域;参数 value:被验证的值;返回值:返回 null 或者“信息”级别的验证结 果表示验证通过,否则认为不通过。 ? 内部类 ValidResult:验证结果。

华东理工大学硕士学位论文

第 23 页

(1)方法 ValidResult error(String message):创建一个“错误”级别的验证结果。 (2)方法 ValidResult warning(String message):创建一个“警告”级别的验证结果。 (3)方法 ValidResult info(String message):创建一个“信息”级别的验证结果。 ? 内部类 ValidLevel:验证结果级别。 (1)字段 ValidLevel info:标记验证结果级别为“信息”。该级别认为是验证通过。 (2)字段 ValidLevel warning:标记验证结果级别为“警告”。该级别认为是验证不 通过。 (3) 字段 ValidLevel error: 标记验证结果级别为“错误”。 该级别认为是验证不通过。 4.5.3 控件标题功能接口设计 在实际应用当中,大部分控件都需要显示标题,如控件标题“用户名”后面跟一个输 入框,并且如果该控件必填,则要求标题有个红色的“*”,如果程序重新设置标题的值, 则控件标题可以自动变化,应用级控件应该实现自动显示标题的功能,并且根据数据字 典信息自动设置标题的红色“*”号,这样在开发时就不用关心控件的标题显示了,为控 件设置数据字典即可,可以大大简化开发便于维护。数据字典相关见 4.8.3 节。图 4.9 展示了控件标题接口设计类图:

图 4.9 标题功能的接口类图 Fig. 4.9 The Interface Class Diagram of the Title Function

?

接口 HasRFieldCaption:标记一个控件具有可作为表单域标题的功能。 (1)方法 String getFieldCaption():取得表单域标题。 (2)方法 boolean isRequired():取得是否必填。 (3)方法 boolean isEnabled():取得是否可用。 (4)方法 HasFocus getAssociatedWidget():取得关联的界面部件。 (5)方法 void setFieldCaptionListener(RFieldCaptionListener listener):设置侦听器。 (6)方法 void removeFieldCaptionListener():删除当前侦听器对象。 (7)方法 Widget asWidget():返回代表当前控件的 Widget 对象。

?

接口 RFieldCaptionListener:与 HasRFieldCaption 相关的侦听器接口。 (1)方法 void onChange(HasRFieldCaption sender):当表单域标签相关属性被修改

后触发。

第 24 页 4.5.4 基本控件设计与实现

华东理工大学硕士学位论文

基本控件的设计与实现本身就是一个复杂工程,开发框架需要有这层,但在这里不 详细描述每种控件的设计与实现。图 4.10 展示了基本表单控件:文本输入框,口令输入 框、多行文本输入框的设计类图:

图 4.10 文本框类图 Fig. 4.10 The Class Diagram of the TextBox

? ? ? ? ? ? ?

验证功能接口 HasRValidator 和标题功能接口 HasRFieldCaption 在基本控件的设计中 都得到了应用。 类 RLabeledBox:具有标签的界面部件基类。 类 RFieldComposite:表单域的 Composite。 类 RTextBoxBase:文本输入框控件基类。 类 RTextBox:文本输入框控件。 类 RPasswordBox:口令输入框控件基类。 类 RTextArea:多行文本输入框控件基类。

华东理工大学硕士学位论文
4.5.5 控件性能测试

第 25 页

本节对应用级控件进行性能测试,这是非常有必要的,因为 GWT 应用程序最终运 行在浏览器中,对客户端的性能要求比较高。GWT 应用程序支持各种浏览器,但在不 同浏览器中的性能有较大差异,本节测试的浏览器是 IE7 和 Chrome。同时与 GWT-Ext 框架的控件进行比较测试。 采用以下测试方法: (1)关闭浏览器后重新打开; (2)执行要测试的操作,并记录执行时间; (3)重复 1,2 若干次。 测试环境:DELL Optiplex 755,Intel Core 2 Duo E4500 2.2GHz CPU,2G 内存。 以下表格和图表中 Widget 代表 GWT-Ext 的控件,Widget2 代表应用级控件。 (1)包含 100 个文本框的表单
表 4.2 对含有 100 个文本框的表单测试结果 Table 4.2 The test results of the form containing 100 TextBoxs 1 Widget in IE7 Widget2 in IE7 Widget in Chrome 2 3 4 5 平均

2.375 秒 2.391 秒 2.360 秒 2.375 秒 2.375 秒 2.375 秒 0.610 秒 0.609 秒 0.625 秒 0.610 秒 0.609 秒 0.613 秒 1.002 秒 1.024 秒 1.026 秒 1.025 秒 1.039 秒 1.023 秒

Widget2 in Chrome 0.091 秒 0.096 秒 0.094 秒 0.095 秒 0.094 秒 0.094 秒

图 4.11 含有 100 个文本框表单的性能图 Fig. 4.11 The Performance of the form containing 100 TextBoxs

测试结果显示: 在 IE7 浏览器下构建 100 个 GWT-Ext 文本框的平均速度为 2.375 秒, 而构建 100 个基于 GWT 的应用级文本框的平均速度为 0.613 秒。 在 Chrome 浏览器下构 建 100 个 GWT-Ext 文本框的平均速度为 1.023 秒,而构建 100 个基于 GWT 的应用级文 本框的平均速度为 0.094 秒。 (2)包含 100 个组合框(ComboBox)的表单(每个组合框有 5 个选项)

第 26 页

华东理工大学硕士学位论文
表 4.3 对含有 100 个组合框的表单测试结果 Table 4.3 The test results of the form containing 100 ComboBoxs 1 Widget in IE7 Widget2 in IE7 Widget in Chrome 2 3 4 5 平均

3.984 秒 3.969 秒 3.953 秒 4.015 秒 3.985 秒 3.981 秒 0.813 秒 0.828 秒 0.797 秒 0.797 秒 0.812 秒 0.809 秒 1.802 秒 1.808 秒 1.816 秒 1.805 秒 1.804 秒 1.807 秒

Widget2 in Chrome 0.125 秒 0.126 秒 0.118 秒 0.119 秒 0.119 秒 0.121 秒

图 4.12 含有 100 个组合框表单的性能图 Fig. 4.12 The Performance of the form containing 100 TextBoxs

测试结果显示: 在 IE7 浏览器下构建 100 个 GWT-Ext 组合框的平均速度为 3.981 秒, 而构建 100 个基于 GWT 的应用级组合框的平均速度为 0.809 秒。 在 Chrome 浏览器下构 建 100 个 GWT-Ext 组合框的平均速度为 1.807 秒,而构建 100 个基于 GWT 的应用级组 合框的平均速度为 0.121 秒。 (3)包含 100 个日期框的表单
表 4.4 对含有 100 个日期框的表单测试结果 Table 4.4 The test results of the form containing 100 DateBoxs 1 Widget in IE7 Widget2 in IE7 Widget in Chrome 2 3 4 5 平均

2.844 秒 2.844 秒 2.829 秒 2.906 秒 2.844 秒 2.853 秒 0.843 秒 0.828 秒 0.844 秒 0.829 秒 0.828 秒 0.834 秒 1.733 秒 1.720 秒 1.720 秒 1.748 秒 1.728 秒 1.730 秒

Widget2 in Chrome 0.116 秒 0.117 秒 0.116 秒 0.116 秒 0.118 秒 0.117 秒

华东理工大学硕士学位论文

第 27 页

图 4.13 含有 100 个日期框表单的性能图 Fig. 4.13 The Performance of the form containing 100 DateBoxs

在 IE7 浏览器下构建 100 个 GWT-Ext 日期框的平均速度为 2.853 秒, 测试结果显示: 而构建 100 个基于 GWT 的应用级日期框的平均速度为 0.834 秒。 在 Chrome 浏览器下构 建 100 个 GWT-Ext 日期框的平均速度为 1.730 秒,而构建 100 个基于 GWT 的应用级日 期框的平均速度为 0.117 秒。 (4)表格性能数据汇总
表 4.5 在 IE7 下对表格的测试结果 Table 4.5 The test results of the Grid in IE7 IE7 Widget in IE7 20 行 10 列 50 行 10 列 100 行 10 列 500 行 10 列 0.188 秒 0.381 秒 0.219 秒 0.703 秒 0.472 秒 3.513 秒 4.234 秒

Widget2 in IE7 0.091 秒

图 4.14 表格在 IE7 中的性能图 Fig. 4.14 The Performance of the Grid in IE7

第 28 页

华东理工大学硕士学位论文

测试结果显示:在 IE7 浏览器下分别构建 20 行 10 列、50 行 10 列、100 行 10 列、 500 行 10 列的表格,构建 GWT-Ext 的表格的速度和基于 GWT 应用级表格的速度差不 多,当行数超多 100 后,基于 GWT 的应用级表格性能下降,甚至超过了 GWT-Ext 的表 格。
表 4.6 在 Chrome 下对表格的测试结果 Table 4.6 The test results of the Grid in Chrome Chrome Widget in Chrome 20 行 10 列 50 行 10 列 100 行 10 列 500 行 10 列 0.067 秒 0.118 秒 0.030 秒 0.202 秒 0.055 秒 0.882 秒 0.286 秒

Widget2 in Chrome 0.015 秒

图 4.15 表格在 Chrome 中的性能图 Fig. 4.15 The Performance of the Grid in Chrome

测试结果显示:Chrome 浏览器下分别构建 20 行 10 列、50 行 10 列、100 行 10 列、 500 行 10 列的表格,构建 GWT-Ext 的表格的速度比基于 GWT 应用级表格的速度要慢, 而且和在 IE7 浏览器的不同, 基于 GWT 的应用级表格性能一直好于 GWT-Ext 表格的性 能。 从以上的测试结果来看,基本控件在 Chrome 浏览器的性能要好于在 IE7 浏览器, 基于 GWT 基本控件开发的应用级控件性能要好与 GWT-Ext 框架提供的控件, 表格控件 在 IE7 浏览器中当构造列数大于 100 列性能下降的比较厉害,甚至超过了 GWT-Ext 中 的表格,但在 Chrome 浏览器中表现良好。本节的测试工作验证了应用级控件的性能而 且与 GWT-Ext 的控件分别 IE7 和 Chrome 浏览器进行比较。 从结果来看推荐使用 Chrome

华东理工大学硕士学位论文
浏览器,类似于 GWT-Ext 这样的框架需要进行在应用环境下测试后再使用。 4.6 模块框架 4.6.1 模块框架设计

第 29 页

模块框架是整个 GWT 模块的框架,它为开发 GWT 模块提供了以下功能: (1)从服务端取得模块所需的信息,如登录用户、登录组织、用户权限等信息; (2)构建模块的基础面板及模块的整体布局; (3)提供了模块内界面跳转机制; (4)提供了模块权限检查机制; GWT 提供了一个入口点类 EntryPoint.java,这是一个只包含函数 onModuleLoad()的 简单接口,实现这个接口将会是一个模块的入口点,当加载 GWT 模块的时候会自动加 载接口中的 onModuleLoad 方法。 模块的整个框架在这里构建。 图 4.16 展示了模块框架:

图 4.16 GWT 模块框架 Fig. 4.16 The Framework of the GWT Module

第 30 页

华东理工大学硕士学位论文

模块框架为开发 GWT 模块提供了基础功能,首先从服务端为模块加载基本信息, 构建模块的显示位置与整体布局,在本开发框架中模块的整体布局是:根面板是一个垂 直面板,在垂直面板的顶部是一个显示标题面板,该面板显示当前界面的名字,标题面 板下方是工作区域面板,在工作区域面板中展示界面框架下的业务界面,在 4.7 节中会 介绍界面框架。模块中的这些业务界面需要不断进行切换,在模块框架中提供了 GWT 模块的界面跳转机制, 主要通过 GWT 的 History 机制实现了模块内的界面跳转, 具体实 现见 4.6.3 节。 4.6.2 模块框架实现 图 4.17 展示了 GWT 模块框架的设计类图:

图 4.17 GWT 模块框架类图 Fig. 4.17 The Framework Class Diagram of the GWT Module

? ?

接 口 EntryPoint : GWT 提 供 的 程 序 入 口 点 , 程 序 运 行 时 会 先 调 用 接 口 中 的 onModuleLoad()方法。 抽象 EntryPointBase:实现了 EntryPoint 接口,提供了模块公用的基本方法。 (1)方法 onModuleLoad():实现接口 EntryPoint 中的 onModuleLoad()方法,该实现

方法通过 GWT 的 RPC 机制取得当前会话信息,当前会话信息中有权限列表、当前登录 用户、当前登录组织以及在服务端向当前会话中存放的信息。这些信息的生命周期在整 个模块中,可以为供整个模块进行逻辑判断。 (2)抽象方法 getRemoteService():由子类来实现,取得模块实例化的远程服务异 步接口。 (3)方法 getCurrentSession():取得当前会话信息。

华东理工大学硕士学位论文
(4)方法 getCurrentUser():取得当前登录用户。 (5)方法 getCurrentOrganization():取得当前登录组织。 (6)抽象方法 getModuleCaption():要求子类实现,取得模块的标题。 (7)方法 hasPermission(String permCode):判断用户是否用该权限。 (8)方法 getURLQuery():获得 URL 的参数部分,即问号后面的部分。 (9)方法 getURLHash ():获取 URL 的#后面的部分。

第 31 页

(10)方法 getParameters():获得 URL 参数列表,所有参数以(key, value)的形式放 在 HashMap 中。 ? 类 EPTitleModule:界面模块框架,设计作为大部分具体模块的基类。提供基础的界 面布局,提供标准的标题部件,提供模块内界面切换功能。 (1)方法 buildUI():构建了模块的基础面板和布局,并添加标准的标题部件。 (2)抽象方法 dispatch():由子类实现,规定了模块的跳转方式。根据参数分发请 求,在框架中这是一个抽象方法,需要具体模块实现该方法,因为需要具体模块来定什 么参数跳转到什么界面。 进入模块时会调用 onSessionLoad()中的 dispatch()方法, 跳转到 模块指定的界面,进入模块后,可通过触发 GWT 的 History 事件,在该事件中也会调用 dispatch()方法。根据参数跳转到不同的界面。 (3)方法 showContentPanel():显示指定的内容面板。 (4)方法 jump():实现模块内跳转。 4.6.3 模块内界面跳转机制 在一个 GWT 模块中通常有多个界面,模块间这些界面需要进行切换,这样的一种 切换机制是由模块框架指定的:进入模块时,调用入口点的 dispatch()方法,根据指定的 参数跳转到指定界面,在界面中通过触发 History 事件,再次调用 dispatch 方法,根据 参数跳转界面。 ? 进入模块时显示界面 (1)指定URL定位到一个模块。如URL为 http://serverName:port/ModuleName/ModuleName.html?start=view&uuid=****; (2)调用方法HashMap getParameters(); 解析URL地址,取得参数列表。 参数列表 以键值对的形式存在HashMap中,如:<start, view>,<uuid, ****>… (3)调用方法dispatch(Map params); 从参数列表中取得“start”的值,将该值与界面 绑定的值进行比较,相等则进入该界面。 (4)进入界面后,可以继续取得参数列表的其它参数,供界面使用。 ? 进入模块后界面跳转 (1)在界面中调用jump(String startNode, String params); 指定要跳转界面的startNode 和其它相关参数,该方法会根据传入参数构建URL形如:start=startNode&params,然后

第 32 页 调用History.newItem(url);

华东理工大学硕士学位论文

(2)触发History事件处理监听器ModuleHistoryListener,该监听器会解析 historyToken,取得参数列表,参数列表以键值对的形式存在HashMap中,如:<start, view>,<uuid, ****>… (3)调用dispatch(Map params); 进行界面的分发。 4.7 界面框架

4.7.1 模板方法模式应用 模板方法模式[29]:在一个方法定义一个算法的骨架,而将一些步骤延迟到子类中。 模板方法使得子类可以在不改变算法结构的情况下,重新定义算法的某些步骤。模板方 法模式是基于继承的代码复用的基本技术,模板方法模式的结构和用法也是面向对象设 计的核心。模板方法模式需要开发抽象类和具体子类的开发人员之间的协作。一个开发 人员负责给出一个算法的轮廓和骨架,而另一些开发人员则负责给出这个算法的各个逻 辑步骤。代表这些具体逻辑步骤的方法称作基本方法(primitivie method) ;而将这些基 本方法汇总起来的方法叫做模板方法(template method) ,模板方法所代表的行为称为顶 级行为,其逻辑称为顶级逻辑。图 4.18 展示了板方法模式的静态结构:

图 4.18 模板方法模式的静态结构 Fig. 4.18 The Static Structure of the Template Method Pattern

?

抽象模板角色有如下职责: (1)定义了一个或多个抽象操作,以便让子类实现。这些抽象操作叫做基本操作,

它们是一个顶级逻辑的组成步骤。 (2)定义并实现了一个模板方法。这个模板方法一般是具体方法,它给出了一个顶 级逻辑的骨架,而逻辑的组成步骤在相应的抽象操作中,推迟到子类实现。顶级逻辑也 有可能调用一些具体方法。 ? 具体模板角色有如下职责: (1)实现父类所定义的一个或多个抽象方法,它们是一个顶级逻辑的组成步骤。 (2)每一个 抽象模板角色都可以有任意多个具体模板角色与之对应,而每一个具

华东理工大学硕士学位论文

第 33 页

体模板角色都可以给出这些抽象方法的不用实现,从而使得顶级逻辑的实现各不相同。 还有一个设计原则通常与模板方法在一起,就是好莱坞原则:“别调用我们,我们会 调用你”。 好莱坞原则可以防止“依赖腐败”。当高层组件依赖低层组件,而低层组件又依赖高 层组件,而高层组件又依赖边侧组件,而边侧组件又依赖底层组件时,依赖腐败就发生 了。在好莱坞原则之下,我们允许低层组件将自己挂钩到系统上,但是高层组件会决定 什么时候和怎么样使用这些低层组件。好莱坞原则体现了模板模式的关键:子类可以置 换父类可变的部分,但是子类却不可以改变模板方法所代表的顶级逻辑。 本开发框架的界面框架的设计则可以采用该模式,为界面提供标准模板,这样界面 风格统一,代码结构一致,便于开发和维护。 4.7.2 单例模式应用 单例模式[24]:确保一个类只有一个实例,并提供一个全局访问点。

图 4.19 单例模式的静态结构 Fig. 4.19 The Static Structure of the Singleton

下面代码是有单例模式构建界面的代码:
/** 单件实例 */ private static BlackUnitList instance = null; /** 获取单件实例 */ public static BlackUnitList getInstance(BlackUnit owner) { if (instance == null) instance = new BlackUnitList(owner); return instance; }

单例模式是一种常见的设计模式,本开发框架也大量运用该设计模式,界面的构造 就可以用该模式,保证客户端只有一个界面实例存在,较少内存开销,以防内存泄漏。 4.7.3 界面框架设计 界面的职责是用来展示具体业务数据的,其展示方式是有相似性,把这些相似性封 装成界面框架,这样统一了界面开发规范同时极大简化了界面开发。 众所周知,信息系统中大量的基本功能都是对数据库表的增、删、改、查(简称 CRUD) 。这些操作可通过界面操作实现。通用界面归纳为以下几种: (1)列表界面:集中展现业务对象数据的界面,在该界面中提供查询功能,可以找 到想要找的数据,点击列表数据可以进到该数据的查看界面看到数据的全部内容。

第 34 页 (2)新增界面:新增业务数据的界面。

华东理工大学硕士学位论文

(3)查看界面:查看业务数据的界面,大部分业务操作可在该界面进行。 (4)编辑界面:编辑业务数据的界面。 界面框架的职责:1)提供业务界面的基本模板,规定了界面的基本布局,定制了共 有的界面元素如:顶部的工具栏,显示验证信息面板。2)规定数据加载的机制;3)界 面元素的验证以及验证信息的展示。图 4.20 展示了界面框架:
Composite
业务基本界面框架

工具栏(“返回列表”、“新增”、“编辑”、“取消”等操作按钮)

错误信息显示面板(默认隐藏,有错误信息才显示)

工作区域(可滚动)

基面板

图 4.20 界面框架 Fig. 4.20 The Interface Framework

工作区用来展示具体界面,由开发者完成,工具栏的按钮和相应事件处理由开发者 定制。界面之间传的数据可分为两种:1)传对象,在界面之间的切换可以之间传对象, 这样在客户端缓存数据,可以大大减少与服务器的交互,但是只能在同一模块内进行。 2)传参数,通过 url 地址如 uuid=****,界面取得 uuid 的值以后根据 uuid 从服务端取得 数据,可在模块间进行。图 4.21 展示了界面加载数据的过程。 具体过程如下: (1)模块框架根据 url 参数分发界面。 (2)检查进入界面的权限,若没有该权限则抛出没有权限异常。 (3)如果第一次进入该界面,重新构造界面实例,若该界面已经构造则取得该界面 实例,界面采用单例模式实现。 (4)刷新模块的标题。 (5)将之前的旧面板隐藏。 (6)所有构造过的界面都会放在 Map 中缓存起来,供下次现实时直接找到该界面 显示。 (7)异步加载数据。

华东理工大学硕士学位论文
(8)向界面填充数据。 (9)根据数据和业务要求对界面进行调整。

第 35 页

图 4.21 数据加载机制 Fig. 4.21 The Mechanism of Loading Data

4.7.4 界面框架实现 图 4.22 展示了界面框架的设计类图:

图 4.22 界面框架类图 Fig. 4.22 The Class diagram of the Interface Framework

?

接口 IsContentPanel:表明是一个可以作为模块内容的面板。 (1)方法 getStartNode():标记模块内访问链接的 token。

第 36 页

华东理工大学硕士学位论文

(2)方法 getEntryPermission():取得进入当前模块的权限代码,返回 null 表示不进 行权限检查。 该方法将在进入模块前被调用。 此方法仅适合权限的模型比较简单的情况, 对于一些比较复杂的情况则建议将有关代码放在 beforeShowPanel() 或 onShowPanel() 中。 (3)方法 beforeShowPanel(JumpParams params):当面板被显示前被调用。 (4)方法 onShowPanel(JumpParams params):当面板被显示后被调用。 (5)方法 onHidePanel():当面板被隐藏前被调用。 ? ? ? 接口 HasCaption:这是 GWT 提供的一个接口,实现这个接口的 Widget 可是设置标 题和取得标题。 接口 RValidatable():有应用级控件一节介绍过。 抽象类 SPUI:是抽象类 Composite 的子类,这是抽象模板类。 (1)方法 SPUI(EntryPoint owner):是抽象类的构造方法。 (2)方法 buidlTemplate():是一个模板方法,给出了界面实现的框架。 (3)方法 buildToolbar():构建工具栏,放在模板规定的位置,子类可以重写该方 法,构造自己的工具栏,工具栏主要是添加按钮进行业务操作。 (4)方法 buildNav():构建导航栏,放在模板规定的位置,子类可以重写该方法, 构造自己的导航栏,导航栏主要添加超链接链接到其它模块的界面。 (5)方法 buildMessagePanel():构建信息提示面板,放在模板规定的位置,子类通 常不复写该方法,信息面板显示界面信息,信息按级别可分为提示、警告、错误。错误 信息通常是界面控件验证报错信息,信息面板提供点击错误信息,焦点移到报错控件。 (6)方法 buildForm():构建主要界面内容面板。放在模板规定位置,子类复写该 方法实现自己内容面板。 (7)抽象方法 loadDataFromServer():异步加载界面数据,被 onShowPanel()调用。 (8)方法 onDataLoadedFromServer():数据从服务器加载成功后触发。 (9)方法 loadDataToUI():把数据加载到界面。 (10)方法 refreshCommands():根据数据修改界面控件的可见或可用属性,派生类 可重写此方法 (11)方法 clearDataFromUI():清除界面数据,会被 beforeShowPanel(JumpParams params)调用。 4.8 验证框架的设计与实现 本开发框架设计并实现了系统的验证框架,有了验证框架开发者只需要定义持久化 对象的相关数据定义信息,不用关心验证功能的实现。

华东理工大学硕士学位论文
4.8.1 验证框架设计

第 37 页

EJB 3.0 将 Java 持久化模型进行标准化,Hibernate 扮演了至关重要的角色。一套完 整的 Java Annotations[32]被用来定义处理 O-R 映射和不同的对象关系类型。根据 Entity Bean 的持久化信息生成数据字典,将数据字典与控件绑定(应用级控件添加的一个重 要功能就是控件与数据字典绑定实现验证功能) 。界面控件就可以基本完成验证功能, 验证的信息显示在信息面板中,这样可以大大减少与服务端的交互。在服务端对数据的 验证是必须的,在服务端可用 Hibernate 验证框架进行验证,也可以自行开发 Validator, 补充 Hibernate 验证框架。服务端的验证是在业务逻辑层(EJB 层)完成的,以异常的 形式抛出,Web 服务层截获异常后转换成可序列化的异常抛给客户端,最终将错误信息 显示显示在信息面板中。复杂验证需要在客户端和服务端编写复杂的验证逻辑进行验 证。若要修改验证,只要修改 Entity Bean 的持久化信息,用数据字典工具重新生成数据 字典即可,不用修改其它代码。图 2.23 展示了验证框架:

图 4.23 验证框架 Fig. 4.23 The Framework of Verification

4.8.2 Hibernate 验证框架 Annotations[33]是一种为业务对象模型指定不变约束的简洁而幽雅的方法。例如,你 能表示一个属性永远不为 null,一个帐户余额一定是正值,等等。这些业务对象模型约 束通过为 bean 中的属性添加注解来加以声明。随后一个验证器(validator)会读取并检 查这些约束。验证机制可以执行于应用程序中的不同层(表现层、数据访问层) ,而不 必复述任何(前述)这些规则。Hibernate 验证器正为这一目的而设计的。 Hibernate 验证器工作在两个层次上。第一层,它能检查内存中一个类的实例是否违 反约束。第二层,它能将约束应用于 Hibernate 元模型上,并将它们融入生成的数据库 schema 中。 每个约束注解(constraint annotation)和一个验证器实现关联,该验证器负责检查

第 38 页

华东理工大学硕士学位论文

位于实体实例上的约束。一个验证器也能(可选地)将约束应用于 Hibernate 元模型上,让 Hibernate 生成表示这一约束的 DDL。使用合适的事件监听器,你能让 Hibernate 在插入 和更新时执行检查操作。Hibernate 验证器并不局限于同 Hibernate 一起使用。你能在你 应用程序的任何地方方便地使用它。 在运行时检查实例时,Hibernate Validator 返回违反约束的信息,这些信息以一个 InvalidValue 数组的形式返回。除了众多其它信息外,InvalidValue 包含了一个错误描述 消息,该信息可以内嵌与注解相捆绑的参数值(例如长度限制) ,以及能被提取至 ResourceBundle 的消息字串。 4.8.3 数据字典 使用一个自动生成工具(该工具需要自行编写)读取持久化对象的定义,生成数据 字典,数据字典可用于数据完整性检查和界面显示的对象及其属性的标题。 数据字典定义了持久化对象每个属性的名称、标题、长度、是否允许空值、最大值、 最小值等信息。数据字典由两部分组成:标题定义和数据定义。 (1)标题定义 标题定义包含了持久化对象及其属性的标题,用于界面显示或消息提示。标题定义 采用了 GWT 提供的 Static String Internationalization 技术[34],每一个持久化对象都对应 一个常量接口和 properties 文件,这两者总是成对出现,并且在一个包中。 标题定义文件位于 com.hd123.sports.gwt.mres.模块名.client.dd.caption 中,其包结构 和持久化对象的包结构对应。 常量接口和 properties 文件的命名为在持久化对象名前加大写的 C,例如投资人的 标题定义就包含了 CInvestor.java 和 CInvestor.properties 两个文件。 在 properties 文件中名为 tableCaption 的项是整个持久化对象的标题。 CInvestor.java(篇幅原因省略了部分内容) :
package com.hd123.sports.gwt.mres.investor.client.dd.caption;

import com.google.gwt.i18n.client.Constants;

public interface CInvestor extends Constants {

public String tableCaption();

public String abolishMan();

public String abolishMan_code();

华东理工大学硕士学位论文
public String abolishMan_name();

第 39 页

public String abolishMan_uuid();

public String abolishTime();

public String auditFinishTime();

public String auditState(); … }

CInvestor.properties(篇幅原因省略了部分内容) :
tableCaption=投资人 abolishMan=作废人 abolishMan_code=作废人代码 abolishMan_name=作废人姓名 abolishMan_uuid=作废人uuid abolishTime=作废时间 auditFinishTime=多级审核完成时间 auditState=多级审核状态 …

(2)数据定义 每个持久化对象对应一个数据定义类,数据定义包含了对象所有属性的定义。 由于 GWT 的特殊性,数据定义类在 GWT 客户端和服务端各有一个版本。GWT 客 户端版本位于 com.hd123.sports.gwt.mres.模块名.client.dd.def 中, 其包结构和持久化对象 的包结构对应。 对 象 文 件 的 命 名 为 在 持 久 化 对 象 后 加 Def , 例 如 投 资 人 的 数 据 定 义 就 是 InvestorDef.java。 客户端的 InvestorDef.java(篇幅原因省略了部分内容) :
package com.hd123.sports.gwt.mres.investor.client.dd.def;

public class InvestorDef {

第 40 页

华东理工大学硕士学位论文
public static CInvestor constants = (CInvestor) GWT.create(CInvestor.class);

public static String TABLE_CAPTION = constants.tableCaption();

public static EmbeddedFieldDef abolishMan = new EmbeddedFieldDef("abolishMan", constants.abolishMan());

public static StringFieldDef abolishMan_code = new StringFieldDef("abolishMan.code", constants.abolishMan_code(), true, 0, 25);

public static StringFieldDef abolishMan_uuid = new StringFieldDef("abolishMan.uuid", constants.abolishMan_uuid(), true, 0, 19);

public static DateFieldDef abolishTime = new DateFieldDef("abolishTime", constants.abolishTime(), true, null, true, null, true, GWTFormat.fmt_yMd, false);

public

static

StringFieldDef

auditState

=

new

StringFieldDef("auditState",

constants.auditState(), true, 0, 127); …

把数据定义和控件绑定以后,控件会增加以下两个特性: (1)获得字段的标题,对于带标题显示的控件(例如 LabeledTextBox) ,标题会被 自动显示出来,程序员无须再设定控件的标题,当然也无须维护保存字段标题的常量, 因为这些常量已经存在于数据字典中了。 (2)能够自动的对用户输入进行检查。例如当用户修改了一个文本框的内容,焦点 离开时,控件会自动检查输入的内容是否符合数据定义,如果不符合,会提示用户,同 时控件背景变红,但并不强制焦点留在当前文本框。如图 4.24 所示:

图 4.24 具有验证功能的文本框 Fig. 4.24 The Textbox with validation

华东理工大学硕士学位论文 第5章
5.1 系统概述

第 41 页

开发框架的应用

5.1.1 背景 为了提高产权交易机构在组织中央企业产权交易过程中的服务标准化程度,共同建 设统一的交易流程和交易信息系统,促进产权交易行业提升,根据《企业国有产权转让 管理暂行办法》及其配套规范性文件的要求,上海、北京、天津、重庆四家国务院国资 委认定的具有从事中央企业产权转让资质的交易机构,在国务院国资委产权局的具体组 织领导下,共同起草《合作协议》并积极履行协议有关约定,一起研究制定统一的央企 交易流程和信息系统,以便在更大范围内更好地发挥产权市场“发现买主、发现价格”的 功能,努力建设中国特色的产权交易市场,为深化国有企业改革、实现国有资产保值增 值,建立“归属清晰、权责明确、保护严格、流转顺畅”的现代产权制度做出应有贡献。 5.1.2 原则 系统建设和系统设计遵循以下原则: (1)充分利用现有的资源 (2)先进性与发展性 采用成熟的、先进的计算机和通信技术进行系统设计,既要保证当前系统运行的高 可靠性,又要能适应未来技术发展的需要。 (3)标准化与开放性 采用符合国际、国家标准的软件,遵循有关技术规范体制,系统具有良好的可移植 性、可扩展性,保证在将来发展中迅速采用最新出现的技术。 (4)可靠性与安全性 选用高可靠的产品与技术,具有完善的应变能力和容错能力,确保系统安全可靠。 对信息资源的使用要进行权限划分,并对信息系统的运行情况进行实时监控。 5.2 与其它软件的关系 企业产权交易系统需要与国务院国资委监测系统、交易机构网站、交易机构其它系 统对接,图 5.1 展示了系统接口图:

第 42 页

华东理工大学硕士学位论文

图 5.1 系统接口图 Fig. 5.1 The System Interface Diagram

(1)和国务院国资委监测系统接口 按照国务院国资委的要求,从生成转让项目的国资委编号开始,系统会和国资委监 测系统保持实时的数据同步,任何数据的内容和状态一旦发生变化,会立即通知监测系 统。 在数据结构的设计上,以监测系统的数据库设计为基础,与监测系统同构,并对监 测系统开放数据库,便于国资委实时监测与统计; 在系统程序的设计上,完全按照监测要求引入监测系统配套的CA方案相关的应 用,满足监测系统的数据采集要求。 (2)和交易机构网站的接口 在转让申请审核通过后,系统会自动将转让信息发布到交易机构的网站。 中央企业的产权转让信息,还会提供接口发布到其它交易机构的网站。

华东理工大学硕士学位论文
(3)和交易机构其它系统的接口

第 43 页

系统还提供和交易机构的其它系统的接口, 如大屏、 根据每家交易机构的具体情况, 交易机构自己的网络竞价系统等。 5.3 组织结构 图 5.2 展示了组织结构图:

图 5.2 组织结构图 Fig. 5.2 The Organizational Chart

交易系统根据实际需求,将交易机构本身的组织结构分为两层,如图所示:第一层 是交易机构,第二层是分支机构。 交易机构是指由国务院国有资产监督管理委员会选择确定的中央企业国有产权交 易试点机构,它是业务处理的审核者,且一个交易系统只能有一个交易机构的组织。 分支机构是指交易机构下属的分支机构,它是业务的主要处理者,一个交易系统中

第 44 页

华东理工大学硕士学位论文

可以没有或者存在一个或多个分支机构组织,这些分支机构组织直属交易机构组织。 经纪会员是指具有产权交易机构会员资质,在产权交易活动中接受转让方或者意向 受让方的委托,为产权交易提供有偿中介服务的法人组织。它属于外部组织,是业务的 主要发起者。经纪会员组织区别于交易机构本身的组织结构,相对独立,且不与其它组 织直接产生关联,而是在业务过程中与交易机构组织或分支机构组织存在业务联系。 上述三种组织中,都具有各自独立的人员域,即每个组织都具有自身的人员群,这 些人员根据所属组织的业务功能域进行操作。 如经纪会员人员只要业务功能域是发起业 务;分支机构人员主要业务功能域是处理业务(不一定能审核完成) ;交易机构人员主 要业务功能域是所有业务管理及相关信息处理。 5.4 业务过程设计 按照《企业国有产权进场交易操作规则》的要求,产权交易机构应当建立分级审核 责任制度,并提供受理转让申请、发布转让信息、登记受让意向、组织交易签约、结算 交易资金、出具交易凭证等服务。因此,在交易系统流程设计中,为企业国有产权进场 交易设计了六个关键环节点。在实际操作过程中,这六个节点环环相扣,不可跳跃,不 可缺失。图 5.3 展示了业务过程:

图 5.3 业务过程 Fig. 5.3 The Business Process

5.4.1 受理转让申请 根据《受理转让申请操作细则》 ,设计了受理转让申请环节的业务流程。该环节业务 流程设计的核心点为: (1)转让方通过受托经纪会员向产权交易机构提出信息发布申请(第三条) ; (2) 经纪会员应对转让方所提交材料的真实性、 完整性、 有效性进行核实 (第六条) ; (3)产权交易机构应对相关材料的完整齐全性进行初审(第八条) ; (4) 产权交易机构应当在接收材料后 3 个工作日内对相关材料的合法合规性进行审 核(第九条) ; (5)符合信息发布要求的,发布《产权转让公告》 ;不符合信息发布要求的,产权 交易机构应当将审核意见及时告知转让方(第九条) 。 5.4.2 发布转让信息 根据《发布转让信息操作细则》,设计了发布转让信息环节的业务流程。该环节业务 流程设计的核心点为:

华东理工大学硕士学位论文
站公开发布(第三条) ;

第 45 页

信息披露的渠道: 企业国有产权转让信息应当在指定的报刊和产权交易机构网 (1) (2)信息发布期限:信息发布期限由转让方决定,首次信息发布的期限应不少于 20 个工作日。信息发布期限一般不超过 6 个月(第四条) ; (3) 信息发布期起始日: 产权转让信息发布期以报刊的首次刊载信息之日为起始日 (第五条) ; (4)对延长信息发布的条件与延牌期限的约定:信息发布的每一延长周期不少于 5 个工作日(第八条) ; (5)对信息发布截止日的约定(第九条) ; (6)对信息重新发布的约定(第十条) ; (7)对重新挂牌的挂牌价的约定(第十一条) ; (8)对中止信息发布的约定(第十二条) ; (9)对已中止发布的信息进行恢复或终结的约定(第十四条与第十五条) ; 5.4.3 登记受让意向 根据《登记受让意向操作细则》,设计了登记受让意向环节的业务流程。该环节业务 流程设计的核心点为: (1)对《产权受让申请书》应括的主要内容进行约定(第五条) ; (2) 产权交易机构应在收到受让申请之日起 2 个工作日内对材料齐全的意向受让方 进行登记,出具《产权受让申请登记接收单》 ;对材料不齐的,以书面形式明确告知意 向受让方及受托经纪会员需补齐的材料(第八条) ; (3) 产权交易机构应在出具登记接收单后 3 个工作日内对登记的意向受让方提交的 《产权受让申请书》 及其附件材料的合规性进行审核, 对符合受让条件的, 予以受理 (第 九条) ; (4)对产权交易机构应重点审核的内容进行约定(第十条) ; (5) 产权交易机构应在信息发布期满次日起 5 个工作日内通过经纪会员向转让方出 具 《受让资格确认意见函》 , 书面告知对登记的意向受让方资格的确认意见 (第十二条) ; (6)转让方应在收到产权交易机构《受让资格确认意见函》次日起 3 个工作日内予 以书面回复;逾期未予以书面回复的,视为同意产权交易机构作出的资格确认意见;如 认为存在意向受让方不符合公布的受让条件的,应在收到产权交易机构《受让资格确认 意见函》 次日起 3 个工作日内经受托经纪会员核实后向产权交易机构提出要求复核的书 面意见,说明理由并提交相关证明材料(第十三条) ; (7)意向受让方对未获资格确认决定有异议的,可以在接到《受让资格确认意见通 知书》 次日起 2 个工作日内经受托经纪会员核实后向产权交易机构提出要求复核的书面 申请,说明理由并提交相关证明材料。产权交易机构在接到复核申请次日起 5 个工作日

第 46 页

华东理工大学硕士学位论文

内完成复核,并出具资格确认的复核意见(第十六经资格确认的意向受让方,应在收到 《受让资格确认意见通知书》 次日起 3 个工作日内按转让公告的要求向产权交易机构交 纳保证金(以到账时间为准) ,逾期未交纳的视为放弃受让资格(第十七条) 。 5.4.4 组织交易签约 根据《组织交易签约操作细则》,设计了组织交易签约环节的业务流程。该环节业务 流程设计的核心点为: (1) 对交易方式进行定义: 征集产生一家合格的意向受让方的, 采用协议转让方式; 产生两家及以上合格的意向受让方的,按照产权转让公告公布的竞价方式和实施方案组 织实施竞价(第二条) ; (2)明确竞价交易方式包括的内容:竞价交易方式包括拍卖、招投标、网络竞价等 其它方式(第三条) ; (3)明确网络竞价包括的内容:采用网络竞价方式的,可以采取一次报价、动态报 价、 综合竞价等方式进行。 产权交易机构应按照 《企业国有产权转让网络竞价实施办法》 组织实施(第六条) ; (4)转让方和受让方应当在 3 个工作日内,在产权交易机构组织下签订《产权交易 合同》 (第七条) ; (5)明确《产权交易合同》包括的主要内容(第八条) 。 5.4.5 结算交易资金 根据《结算交易资金操作细则》,设计了结算交易资金环节的业务流程。该环节业务 流程设计的核心点为: (1)对退还保证金的约定:确定受让方后,产权交易机构在 2 个工作日内向未被确 定为受让方的意向受让方无息返还其已交纳的交易保证金(第三条) ; (2)对保证金转价款的约定:受让方与转让方签订《产权交易合同》后,产权交易 机构应当按照合同约定将受让方已交纳的交易保证金转为交易价款(第三条) ; (3)对场内价款结算的交易金额的约定: 《产权交易合同》约定付款方式为一次性 付款的,场内结算的交易价款数额为成交金额; 《产权交易合同》约定付款方式为分期 付款的,场内结算的交易价款数额为首付金额(第四条) ; (4)对交易价款以人民币进行结算的操作约定(第八条) ; (5)对交易价款以外币进行结算的操作约定(第九条) ; (6)交易资金不得由产权交易机构外的第三方代为收付(第十二条) ; (7) 对交易资金利息标准的约定: 产权交易机构应按照中国人民银行同期的活期存 款基准利率结算交易资金的利息(第十三条) ; (8)对交易资金利息归属方的约定:交易双方签订《产权交易合同》次日起至《产 权交易合同》生效当日,交易保证金的利息归受让方所有; 《产权交易合同》生效次日

华东理工大学硕士学位论文

第 47 页

。 起至交易价款从产权交易机构划出当日,交易价款的利息归转让方所有(第十三条) 5.5 样例模块实现 本样例模块的开发是在本文论述的开发框架下进行的,展示了在开发框架下开发 GWT 模块的一般过程,同时也验证了开发框架的正确性、实用性。 5.5.1 业务逻辑层设计实现 ? Entity Bean 设计与实现 图 5.5 展示了样例 Entity Bean 的设计类图:

图 5.5 样例实体 Bean 类图 Fig. 5.5 The Entity Bean Class Diagram of the Sample

?

实体 BaseEntity:所有实体的基类,包含最常用的字段。
oca:版本控制 lastModifier:最后修改人 creator:创建人

uuid:数据库表唯一标识 lastModified:最后修改时间 created:创建时间

? ?

实体 UCN:uuid + code + name,设计此类,既可以被嵌入到持久化对象(PO)作 为其一部分,也可以被单独使用(POJO) 。 实体 Sample 代码如下:
@Entity @Table(name = "Sample") public class Sample extends BaseEntity { private static final long serialVersionUID = 300100L; /** 代码 */

第 48 页
private String code; /** 名称 */ private String name; /** 类型 */ private String type; /** 时间 */ private Date date; /** 数量 */ private BigDecimal number; /** 是否选择 */ private Boolean checked; /** 代码名称 */ private UCN ucn; /** 备注 */ private String note; @Column(name = "code", nullable = false, length = 200) public String getCode() { return code; } @Column(name = "code", nullable = false, length = 200) public String getName() { return name; } 篇幅有限...

华东理工大学硕士学位论文

? Session Bean 设计与实现 图 5.6 展示了样例 Session Bean 的设计类图:

图 5.6 样例会话 Bean 类图 Fig. 5.6 The Session Bean Class Diagram of the Sample

? ?

实体 Bean Sample:Sample 实体。 类 OperateContex:操作上下文。设计用于在各种系统操作互相调用之间传递当时的

华东理工大学硕士学位论文
展,调用者可以通过其传递其它附加的操作环境信息。 ? ? 类 BaseMainMgr:EJB 模块管理者对象的基类,提供统一方法。 接口 ISampleMgr:Sample 的管理者接口,对外提供业务接口方法。

第 49 页

操作环境信息,例如当前操作人、操作时间等。该类被定义为是 HashMap 的一个扩

(1)方法 Sample get(String uuid):根据 uuid 查找实体 Sample 返回 Sample 对象。 (2)方法 String save(Sample sample, OperateContext oc):保存实体 Sample,根据操 作上下文 OperateContext 设置实体的最后修改时间和修改人,并记录日志,返回保存后 实体 Sample 的 uuid。 (3)方法 void remove(String uuid, long oca, OperateContext oc):根据 uuid 删除实体 Sample,根据 oca 检查版本控制,根据操作上下为 OperateContext 记录操作日志。 ? 类 SampleMgr:Sample 的管理者实现类。 在实际业务模块中还会有更多复杂的业务方法。 5.5.2 客户端设计实现 ? B 对象设计与实现 图 5.7 展示了样例 B 对象的设计类图:

图 5.7 样例客户端对象类图 Fig. 5.7 The Client Object Class Diagram of the Sample

? ? ? ?

类 BBaseEntity:与实体 Bean BaseEntity 对应的客户端对象。 类 BSample:与实体 Bean Sample 对应的客户端对象。 类 BUCN:与类 UCN 对应的客户端对象。 类 JsBigDecimal:与类 BigDecimal 对应的客户端对象,GWT 中没有提供该对象, 这是因为 JS 不支持 BigDecimal,需要创建该类。 图 5.8 展示了 E 对象和 B 对象的数据转换过程:

第 50 页

华东理工大学硕士学位论文

图 5.8 对象转换类图 Fig. 5.8 The Class Diagram of the Object Conversion

?

类 SampleConvert:实体 bean Sample 和客户端对象 BSample 的转换器,提供了两个 方法,一个是实体对象向客户端对象转换的方法,一个是客户端对象向实体对象转 换的方法。

? 模块 RCP 设计与实现 图 5.9 展出了样例 RPC 的设计类图:

图 5.9 样例模块 RPC 类图 Fig. 5.9 The RPC Class Diagram of the Sample Module

? ? ? ? ? ?

远程服务异步接口 SPRemoteServiceAsync:属开发框架 RPC 框架部分。 远程服务接口 SPRemoteService:属开发框架 RPC 框架部分。 类 SPRemoteServiceServlet:属开发框架 RPC 框架部分。 异步接口 SampleServiceAsync:Sample 模块的远程服务异步接口。 接口 SampleService:Sample 模块的远程服务接口。 类 SampleServiceImpl:Sample 模块服务实现类。

5.5.3 Web 服务层设计实现 ? Sample 入口点设计与实现 图 5.10 展示了样例入口点的设计类图:

华东理工大学硕士学位论文

第 51 页

图 5.10 样例模块入口点类图 Fig. 5.10 The EntryPoint Class Diagram of the Sample Module

? ?

类 EntryPointBase,类 EPTitleModule 属开发框架模块框架部分。 类 Sample:Sample 模块的入口点。 (1)方法 String getModuleIcon():模块框架要求实现的方法,取得模块标题面板上

的图标。 (2)方法 String getModuleCaption():模块框架要求实现的方法,取得模块标题。 (3)方法 SPRemoteServiceAsyncgetRemoteService():模块框架要求实现的方法,取 得当前对应的远程服务。 (4)方法 void dispatch(Map params):模块框架要求实现的方法,根据参数分发请 求。 Sample 的 void dispatch(Map params)方法代码如下:
protected void dispatch(Map params) { String startNode = (String) params.get("start"); startNode = startNode == null ? "" : startNode; try { if (startNode.equals(SampleList.STARTNODE)) { showContentPanel(SampleList.getInstance(this), params); } else if (startNode.equals(SampleCreate.STARTNODE)) { showContentPanel(SampleCreate.getInstance(this), params); } else if (startNode.equals(SampleEdit.STARTNODE)) { showContentPanel(SampleEdit.getInstance(this), params); } else if (startNode.equals(SampleView.STARTNODE)) { showContentPanel(SampleView.getInstance(this), params); } else { showContentPanel(SampleList.getInstance(this), params); } } catch (ClientBizException e) { MsgBox.showError("", e); } }

第 52 页 ? 列表界面设计与实现 图 5.11 展示了样例列表界面的设计类图:

华东理工大学硕士学位论文

图 5.11 样例模块列表界面类图 Fig. 5.11 The List Interface Class Diagram of the Sample Module

? ? ? ?

类 SPListUI:属开发框架界面框架部分。 控件 SPGrid,控件 SPPagingGrid,相关事件 GridClickListener,GridDataProvider 属 应用级控件部分。 内部类 FilterDialog:筛选对话框。 类 SampleList:按照模板 SPListUI 实现需要实现的方法,见 4.7 节。 图 5.12 展示了样例列表界面的实现效果:

图 5.12 样例模块列表界面 Fig. 5.12 The List Interface of the Sample Module

华东理工大学硕士学位论文
? 新增、编辑、查看界面设计与实现 图 5.13 展示了样例新增、编辑、查看界面的设计类图:

第 53 页

图 5.13 样例模块新增、编辑、查看界面类图 Fig. 5.13 The Class Diagram of the Add, Edit, View Interfaces about the Sample Module

? ? ?

抽象类 SPUI:界面框架部分。 抽象类 BaseSampleView:Sample 新增、编辑、查看的基面板。 抽象类 BaseSampleView、类 SampleCreate、类 SampleEdit、类 SampleView 中的方 法都界面框架定制的方法。 图 5.14 展示了样例新增界面的实现效果,新增界面允许客户进行新增操作,界面控

件为可输入状态,控件本身具有验证功能,点击“保存”按钮,会验证整个界面控件数据 的合法性。保存成功后界面跳转到查看界面。 图 5.15 展示了样例查看界面的实现效果,查看界面允许用户查看数据信息,界面控 件为不可输入状态,并可以进行其它业务操作,如:编辑操作、删除操作等。

第 54 页

华东理工大学硕士学位论文

图 5.14 样例模块新增界面 Fig. 5.14 The Create Interface of the Sample Module

图 5.15 样例模块查看界面 Fig. 5.15 The View Interface of the Sample Module

华东理工大学硕士学位论文 第6章
6.1 总结

第 55 页

总结与展望

近几年来,基于 Java 的 Web 应用框架有了充分发展,颇受推崇的 Apache Struts 就 是第一代框架的代表。随后,第二代框架 Tapestry 和 JavaServer Fases 又粉墨登场。这些 框架带来了可喜的进步,尤其是能够直接将输入字段链接到 JavaBean 组件属性。第二 代框架主要以支持组件为核心。通过使用组件,开发人员能够创建自己的组件,并且将 这些组件用于网页中就能看到立竿见影的效果。 如今,以 Google Web Toolkit(GWT)为标志的第三代框架又出现了。同第二代框 架类似,GWT 也提供组件,而且这些组件在 GWT 中被称为 Widget。但是与第二代框 架有所不同,GWT 代表的不是改进,而是一场真正的革命,因为它完全打破了 Web 应 用程序的既有模式。GWT 并不是建立于经典的基于表单的应用程序之上的。当然,如 果要通过 GWT 创建这种应用程序也是没有问题的。确切的讲,GWT 是第一个主流的 基于 Java 的 Web 应用程序框架,通过它能够在浏览器中构建类似桌面应用般的程序。 换句话说,有了 GWT 那些由陈旧网页构成的 Web 应用程序将淡出我们的视野,而进入 我们视野的则是能够在一个浏览器窗口中运行并且与我们使用 AWT、Swing 或 SWT 开 发的桌面程序类似的 Web 应用程序。 本文的目标是设计并实现基于 GWT 和 J2EE 的 Web 开发框架。做了以下工作: (1)研究并分析了 GWT 框架和 J2EE 框架,把 GWT 纳入到 J2EE 架构中,成功将 GWT 应用程序部署在 J2EE 服务器中。 (2)设计开发框架的分层结构,并详述了该分层结构。 (3)详述了开发框架 GWT 客户端的具体设计和实现,主要包括应用级控件、模块 框架、界面框架、RPC 服务扩展框架、验证框架。 (4)详述了用该开发框架开发 GWT 模块的具体过程,验证了开发框架的有效性。 6.2 展望 在现有工作的基础上,我们将在以下几个方面开展进一步的研究工作: (1)GWT 应用系统对客户端性能要求比较高,且不同浏览器性能有较大差别,需 要在不同的浏览器进行测试,对个别速度较慢的模块需要进行优化。 (2)GWT 框架本身发展迅速,新功能,新工具不断出现,需要对其持续跟踪。 (3)伴随 GWT 的第三方框架层出不穷,有的框架很优秀,有的框架只实用于某特 定环境中,不能随便应用,需要对其验证后再使用。 (4)应用层控件还需要进一步开发和完善。


相关文章:
一种基于GWT的Web应用开发框架原理与实现_论文.pdf
一种基于GWT的Web应用开发框架原理与实现 - 作为一种技术发展趋势,GWT凭借其诸多的优势而得到广泛的应用,有着广阔的应用前景。本文在分析GWT技术特点的基础上,提出...
基于SSH+DWR的Web开发框架研究与应用.pdf
基于SSH+DWR的Web开发框架研究与应用 - 使用Web框架能有效提高Web程序的开发效率、增强程序的可维护性和可扩展性等.结合分层设计的思想和目前一些流行开发框架的特点...
GWT.doc
搭建 GWT-Ext 控件演 示平台框架 结束语 下载 参考资料 作者简介 对本文的评价 GWT-Ext 是基于 Google Web Toolkit(GWT) ExtJs 的功 能强大的网页开发控件...
一种基于GWT的Web应用开发框架原理与实现_论文.pdf
一种基于GWT的Web应用开发框架原理与实现 - 作为一种技术发展趋势,GWT凭借其诸多的优势而得到广泛的应用,有着广阔的应用前景。本文在分析GWT技术特点的基础上,提出...
基于Struts框架和Procedure的Web开发模式.pdf
基于Struts框架和Procedure的Web开发模式 - 介绍基于MVC设计模式的Struts框架的组成和实现原理,总结该开发框架的应用特点开发步骤.在分析比较其他基于Struts开发模...
基于EXT-GWT的Web应用开发_论文.pdf
基于EXT-GWT的Web应用开发_信息通信_工程科技_专业资料。文章介绍了ExtJs和GWT的特点和优势,以及基于EXT-GWT开发环境的配置方法,并给出一种基于MVC模式的EXT-GWT...
基于Ajax的富客户端电子商务系统设计.pdf
针对Web 2.0的动态交互性越来越满足不了用户需求的问题,应用Ajax技术,以一个外贸电子商务系统为背景,基于J2EE框架,MVC设计模式,结合使用EXTDWR框架搭建了一个富...
GWT学习笔记.doc
是 Google 开发 AJAX 开发框架, 目前已全部开源。 (本文基于 GWT 提供的...RPC Remote Procedure Call GWT 应用与传统的 HTML Web 应用最基本的区别是...
J2EE系统架构_图文.ppt
J2EE体系架构交流 目录 1 2 J2EE框架简介 Leaf系统...Google Web Toolkit(GWT) ? 浏览器插件技术 ? ...可以 极大地提高开发效率和应用的灵活性 基于Spring...
1ch01Java Web应用开发技术#_图文.ppt
应用框架的发展概述 Java应用开发体系 Java Web...(基于大型主机) 中心计算模型(与分布式计算模型...29.07.2019 18 J2EE体系概述 J2EE(Java2 ...
如何用smartgwt开发页面UI_图文.ppt
6 smartgwt与传统js框架的区别 4、是一个系统级的开发框架,兼容主流浏览器。 ...WeX5的UI部分和传统Web页... 13页 免费 简约网页UI设计怎么制作 暂无评价...
GWT开发者手册.pdf
GWT 开发者手册 格式规范:这种字体表示代码或术语 ...J2EE 开发三层架构软件系统的经验 WEB 应用程序开发 ...GWT 用户界面类是类似于已有的用户界面框架的,例如 ...
基于教学教务的协同办公系统的设计与实现毕业设计_图文.doc
系统以 J2EE 架构为开发平台,采用基于 B/S 的三层结构,利用 Spring MV C框架进行开发,同时针对当前企业应用环境的复杂性本系统的特点,采用了当前流行的 GWT(...
GWT_图文.ppt
GWT的服务端客户端的交互: ? 客户机代码运行在 Web 服务器上的 Service进行通信 ,Java RMI 使用的方 法类似,这意味着只需要编写服务的服务器 端实现和...
第1章 Web设计基础_图文.ppt
与应用服务器 1.4 Web开发工具 1.5 Web开发技术 1.6 Web开发框架 Web程序设计 第一章 随着时间的推移,互联网日渐普及,目前已经渗 透到人们经济、文化和生活的各...
基于J2EE的MVC开发框架探讨_论文.pdf
的发展,产生了许多优秀的基于MVC模式的Java Web框架...本文对J2EE应用中几种流行的MVC开发框架进行了深入...Aogwttedvlhpn fE ehoo,n xeltv bfJgeJasbsdo ...
cmmi5访谈问题-需求、设计、开发、测试以及部分项目经理的_图文_....xls
cmmi5访谈问题-需求、设计开发、测试以及部分项目经理的_信息通信_工程科技_...分别是使用gwt框架 开发和使用struts框架开发,我们用了决策分析的方法进行了选择,...
基于Struts+Spring物流信息交易平台的研究与实现_论文.pdf
论文首先对基于J2EE体系结构的Struts和Spring框架进行...ibatis轻量级Web框架的天润物流信息变易平台设计方案...adSrgwt as()ei edsrtnaotedsno~a . otsnomao ...
基于Vaadin的旋转机械动平衡计算系统开发与应用_图文.pdf
开发框架, 用于创建和设计一个能够在网络上实现高性能数据呈现 的 Web 应用程序...Vaadin 的客户端开发框架包括了 Google Web Toolkit (GWT),GWT 提供了一个编译...
普联架构设计技术方案_图文.ppt
基于灵活开放框架 技术框架应用框架清晰的层次结构 数据层次、软件层次 1、开发...J2EE Adapter EAIServlet Flex Service Convert GWT Service WebService 1、开发...