基于SSH+jQuery框架的餐饮Web App的设计与实现

张佳佳，王 杨，韩力英

（河北工业大学 天津　300401）

基于SSH+jQuery框架的餐饮Web App的设计与实现

张佳佳，王 杨，韩力英

（河北工业大学 天津300401）

针对传统方式开发的餐饮Web App平台难以维护和扩展、用户体验不够好等问题，本文提出一种以Windows为开发环境，Eclipse为开发工具，Oracle为数据库，将SSH和jQuery这两种框架整合应用于系统开发的方案。该方案包括视图层、业务逻辑层和数据持久层，分别由SSH+jQuery框架组合实现相应功能。结果表明，该方案将SSH和jQuery这2个框架整合应用于系统开发中，实现了注册登录、订餐、外卖等主要功能，实现了上述三个层面的完全分离，提高了用户体验度。

Struts；Spring；Hibermate；jQuery；餐饮Web App平台

随着互联网的日益普及和社会服务业的崛起，网络信息呈爆炸式增长，我国餐饮业也得到了迅猛发展。餐饮业传统的管理思想和模式受计算机及通信技术的快速发展，发生了极大地改变。基于餐饮的Web App应用在最近几年中显得越来越重要，未来的发展方向是大量的Web应用逐渐取代PC应用，信息管理系统由C/S（Client/Server，客户端/服务器）模式向B/S（Browser/Server，浏览器/服务器）模式发展，基于B/S结构的Web应用程序将会越来越受到人们的欢迎［1］。目前互联网领域研究的热点课题是如何利用成熟的J2EE平台开发Web应用系统。本文的Web App以某餐饮行业的要求为基础进行设计，实现了注册登录、订座、外卖等功能。架。用户可以采用点滑页面的方法去触发后台程序；利用提高系统性能的连接复用的方法调用数据库中的数据；利用点击操作界面的方法来重置和更换数据库中的表以实现点餐、外卖、支付等功能。

本文的Web应用系统根据餐饮行业的实际需要，大致被分为如下3层：视图层、业务层、数据持久层［2-3］。系统框架结构如图1所示。

1　研究方法

本论文研究的餐饮Web App采用Windows开发环境和Oracle数据库，使用css3、html5、javascript作为前端开发语言，以实现页面信息的结构化和交互化；使用java作为后端开发语言，并使用了SSH（Struts+Spring+Hibemate）+jQuery框

图1　系统框架结构图Fig.1　Structure diagrame of the system

在上图中的基于餐饮行业的Web App系统架构中，利用 JSP+jQuery实现了视图层，JSP用于获取用户的需求，jQuery用于实现和用户的异步交互；Struts+Spring实现业务层，Struts根据JSP从用户级获取到的不同的需求，调用不同Action控制器，为了解决业务之间的逻辑问题，Action再调用Service；Spring+Hibemate实现数据持久层，Service通过调用DAO（Data Access Objects）接口实现对数据库中函数和数据的控制，DAO通过调用Hibermate API对持久化的对象进行控制，Hibeimate将DAO对持久化对象的控制看作是对数据库中数据的控制，最终实现对数据库中数据的重置和更改［3］。其中，业务逻辑层和数据持久层中所有的类对象均由Spring负责创建和维护。

1.1视图层的实现

视图层使用jQuery框架实现注册会员时判断用户名是否已注册、生成验证码、输入性别及联系方式、上传头像和信息自动完成等功能。jQuery可以自动获取用户的需求，并向server发出此异步需求，server端接收用户发来的异步需求后，会对其需求进行相应的解答，并将解决后的结果以应答的形式回传给用户端，用户接收到应答数据后，会调用相应的回调程序对应答数据进行处理，并使其显示在当前页面上。在整个调用回传期间，此过程与其他控制同步进行，不会浪费用户时间。

1.2业务逻辑层的实现

视图层和业务逻辑层之间的无缝连接由Struts框架来实现，核心Action Fileter Dispacher获取Web端的问题后，根据配置文件struts.xml，给对应业务控制器发送来自Web端的不同的问题，由Action来解决Web端的问题。Action会通过调用相应的Service对象来处理业务之间的逻辑问题，以解决来自Web端的需求。解决完Web端的需求后，Service会将此答复返回给Action，Action再将其传给Web端。根据配置文件struts.xml和Action的返回来的结果决定将哪个视图页面返回给用户，或者是把接下来的请求发送给下一个Action业务控制器来进行解答［4］。Spring和Struts整合之后，此款基于餐饮行业的Web App中的Action和Service都由Spring中的IOC容器生成和维护，因此，二者作为Bean实体被配置到Bean工厂配置文件中。struts.xml进行Action配置时class属性应为Bean工厂配置文件中相应Action Bean的ID［5］。

1.3数据持久层的实现

此款餐饮Web App数据库中包括多个表，用来存储系统中所有数据信息；采用提高系统性能的连接复用的方法调用数据库中的数据。Hibemate将数据库中的表映射为相应的POJO（plain object Java object）和映射文件［6］。Spring和Hibemate整合后，Hibemate API对象、DAO都由Spring的IOC容器生成和维护，Hibemate不再有配置文件，Hibemate的数据源信息、Hibemate对象、DAO接口都被整合到Spring的配置文件Bean工厂配置文件中［7］。

2　功能实现及结果

此款餐饮Web App主要实现的功能包括：注册登录模块、个人中心、预订餐位、外卖、活动及游戏模块。系统模块结构图如图2所示。

图2　某餐饮Web App系统模块结构图Fig.2　Module structure diagram of a catering industry Web App

2.1注册登录和个人中心模块

注册登录模块包括快速注册和登录功能，用户登录后可以到个人中心里修改自己的详细信息（密码、昵称、年龄等），上传自己的头像，还可以管理自己发表的说说和照片，查看订单详情和版本信息。

2.2预订餐位模块

通过点击订餐入口，用户可选择就餐的城市、门店，填写订座信息，订座信息包括用户的就餐时间、人数、姓名以及手机号。填写完订座信息后，将进入点菜的环节，在此环节用户可以选择菜品类型，确认订单后即将完成订餐功能。主要详情如图3所示。

图3　订餐原型图Fig.3　The prototype diagram of reservation

2.3外卖模块

用户通过点击外卖入口，将要填写姓名、电话、用餐人数及外卖类型。外卖类型分为外卖派送和上门自取两种，系统根据用户所选择的外卖类型进行判断，引导顾客选择门店，填写外卖送达时间或者用户上门自取的时间以完成外卖订单的下单。主要详情如图4所示。

图4　外卖原型图Fig.4　The prototype diagram of take-out

2.4活动和游戏模块

用户通过手动点击主界面上的游戏按钮，可进入到根据个人的喜好选择各类游戏的界面。点击活动入口，可以查看最近的线上线下活动通知。主要详情如图5所示。

图5　游戏原型图Fig.5　The prototype diagram of game

3　结束语

本文根据此餐饮 Web App系统的需求，将 SSH和jQuery这2个框架整合应用于系统的实现过程中，解决了用传统方式开发的餐饮Web App平台难以维护和扩展、用户体验不够好等问题，事实证明此方案切实有效。另外，此方案具有很好的扩展性，可以进一步开发，满足餐饮企业的需求。

［1］张志峰.Web框架技术（Struts+Hibermate+Spring）教程［M］.北京：清华大学出版社，2013.

［2］郭广军，朱昭君，王剑波.基于SSH架构的课程作业与成绩管理系统［J］.微电子学与计算机，2010，27（8）：157.

［3］张建军，刘虎，倪芳英，等.基于SSH整合架构的研究与应用［J］.湖南师范大学自然科学学报，2012，35（6）：39.

［4］张水芳，张晶.酒店餐饮点餐管理系统初探［J］.贺州学院学报，2010，26（3）：121-123.

［5］王君.基于Struts+Spring+Hibemate的企业级WEB应用框架的研究［D］.合肥：合肥工业大学，2012.

［6］王海涛，贾宗璞.基于Struts和Hibermate的Web应用开发［J］.计算机工程，2011（9）：118-120.

［7］胡凌云.基于SSH框架的销售管理系统的设计与实现［D］.大连：大连理工大学，2013.

Design and implementation of a catering industry Web App based on SSH and jQuery

ZHANG Jia-jia，WANG Yang，HAN Li-ying
（Hebei University Technology，Tianjin 300401，China）

For solving the Web App platform difficult to maintain and extend and promoting the user experience，a system developing scheme based on integrating framework SSH and jQuery has been proposed in this paper.This scheme adopts Windows as development environment，Eclipse as development tool and Oracle as the database.It contains view layer，business logic layer and date persistence layer，implemented by the JSP+jQuery framework，Struts+Spring framework，and Hibermate+Spring frameworkseparately.The results shows that this scheme has achieved the main function of registration，ordering，take-out，and has realized the complete separation of theview layer，business logic layer and date persistence layer，which also will improved the user experience.

struts；spring；hibermate；jQuery；Web App platform of catering industry

TN99

A

1674-6236（2016）03-0020-03

2015-04-19稿件编号：201504213

河北省高等学校科学研究项目（Z2014088）

张佳佳（1988—），女，河北沧州人，硕士研究生。研究方向：多媒体信息处理。