B - S模式系统开发实训指导书120524 - 图文

《B/S模式系统开发实训》指导书

实训性质：综合实训 适用专业：10级计算机信息管理 指导教师：戴远泉 章锋

《B/S模式系统开发实训》课程是对学生所学知识的一次全面总结和综合训练，是对学生理论知识、应用能力的一次总体测试。 一、实训目的

《B/S模式系统开发实训》是针对计算机信息管理专业培养方案进行的综合性重要实践性环节，是本专业学生的必修教学环节，其目的是对前期所学知识的各个环节进行演练，是学生对所学知识更新的一次全面总结和综合训练，是对学生理论知识、应用能力的一次总体测试，通过本实训使学生能够具备综合性软件开发的能力及文档撰写能力；本实训重点是对巩固、深化和升华学生所学理论知识，培养学生创新能力、独立工作能力、分析和解决问题能力、工程实践能力。 二、实训要求

学生以网上书店为题，通过《B/S模式系统开发实训》，使学生深化课程教学内容，针对软件系统功能的深化和性能的提高，编码主要从界面的美化、友好程度、功能深度、数据库结构设计、软件开发采取的先进工具、实训报告质量等方面进行评价。在确定选题后，按照软件生存周期模型，分问题定义与可行性研究、需求分析、总体设计、详细设计、编码、测试等阶段开展工作，完成各阶段的任务，最终开发、完成一个比较完整的软件系统，撰写完整的实训报告。 三、具体设计

实训时间： 3周 开训学期： 4

3.1 网上书店的总体规化

1．网上书店系统的功能

随着电子商务的普及，网上购物的热潮此起彼伏。网上购物跨越了时 空的限制，给商业流通领域带来了非同寻常的变革， 网上购物的真正受 益者是消费者。与其它电子商务网站类似，网上书店系统由前台系统和后台管理系统组成。

前台系统即客户系统，简称“前台”，是面向用户的网页界面，它是用户直接访问和进行购买活动的地方。用户可以在网上进行注册、登录、 书籍查询、浏览、图书订购、查看订单信息等操作，前台系统还应包括一些其他辅助功能，如书店简介、最新新闻、网站公告等，但这些功能不是网上书店所特有的。

后台管理系统常称为“后台”，是网站所有者利用计算机对电子商务网站各种功能进行管理、控制的系统。由于 Web服务器、数据库服务器多数情况下不在“本地”，所以后台管理系统通常执行的是远程控制管理。该网上书店后台管理的功能主要实现图书、用户、订单的管理。

2．网上书店流程

网上书店的流程贯穿着这样四个流程：前台流程、会员操作流程、后 台管理流程、完整的购书流程。

（1）前台流程

图 3-1 描述了网上商店的前台流程

用户可以直接浏览图书、进行图书查询、查看书店简介、登录和注册、 查看图书详细资料、将图书加入购物车，但只有使用会员身份登录进入网 上书店后才能提交购物车和查询订单。用户在前台首先通过浏览或查询等 手段找到要购买的图书，然后将选定的图书放入购物车中。购物车是一个 图书的临时存放地，用户可以对购物车进行管理，如删除图书或修改购买 的数量。用户完全选定了要购买的图书后，就可以提交购物车并生成订单， 系统会提示提交成功，并显示订单号，前台的用户操作流程就结束了。此 后用户还可以查询订单执行情况。

（2）会员操作流程

图 3-2 会员操作流程

没有在书店进行注册的用户，首先要进行“注册”，以成为书店的会 员，用户注册成功后直接以会员身份登录进入书店。已经注册的会员则可 以输入用户名和密码直接登录进入书店。如果用户没有登

录，当提交购物 车和查询订单时，系统就要求用户首先登录再进行相应的操作。会员登录 成功后，就可以比未登录用户增加修改用户信息、提交购物车、订单查询 等功能。当会员离开书店时，为了安全的考虑，应退出登录。

（3）后台管理流程

图 3-3 后台管理流程

后台各个流程之间的关系相对独立，所以后台管理流程相对简单，不同流程对应的功能模块之间也基本独立，是一种平行关系。

（4）完整的购书流程

如果合并用户的前台购书流程和系统的后台订单处理流程，就会得到 完整的购书流程，如图 6 所示。这个购书流程贯穿系统设计之中，是连接 前、后台的核心流程。用户在前台浏览和查询图书，然后将图书放入购物 车，通过提交购物车，生成图书订单，并实际支付（在线实时支付和汇款 等），网上书店后台系统收到付款后根据订单发货，最后用户收到图书并 确认（回执或签字等），这就完成了整个购书流程。

图 3-4 完整的购书流程

3．系统功能模块划分

图 3-5 系统功能模块图

3.2 数据库设计

本系统采用的技术方案为 JSP +Tomcat+ SQL Server，即使用 JSP 作为 Web服务器端开发语言，采用 Tomcat 作为 Web 服务器和 JSP 引擎，采用 SQL Server作为数据库管理系统。

数据库是信息系统的核心和基础，是信息系统开发和建设的重要组成部分，把信息系统中大量的数据按一定的模型组织起来，提供存储、维护、检索数据的功能，使信息系统可以方便、及时、准确地从数据库中获得所需的信息。在动态网站的设计中，数据库设计的重要性不言而喻。合理地设计数据库结构可以提高数据存储的效率，保证数据的完整和统一。如果设计不当,查询起来就非常吃力，程序的性能也会受到影响。数据库设计一般包括如下几个步骤：

? 数据库需求分析。 ? 数据库概念结构设计。 ? 数据库逻辑结构设计。

1．数据库需求分析

根据网上书店系统功能的要求以及功能模块的划分，针对一般网上书店的需求，数据库的功能主要体现在对各种信息的提供、保存、更新和查询操作上，包括用户信息、图书信息、订单信息，各个部分

的数据内容又有内在联系，因此总结出如下的信息表。（1）图书信息总表。（2）用户分为一般用户和管理员。（3）订单分为单张详细订单和订单总表。（4）一个用户可以购买多本图书，对应一张或多张订单。（5）订单总表。本系统设计了一个数据库，该库包含了 6 个数据表，分别是图书表、图书分类表、管理员表、用户表、订单表、订单明细表。经过上述的功能分析和需求总结，设计如下所示的数据项和数据结构。

（1）图书表，包括图书编号、图书名称、图书分类编号等。 （2）图书分类表，包括图书分类编号、图书分类名称。 （3）管理员表，包括管理员名、管理员密码。 （4）用户表，包括用户名、用户密码等。

（5）订单表，包括订单编号、图书编号、订购数量。

（6）订单明细表，包括订单编号、用户编号、提交订单时间等。

2．数据库概念结构设计

根据以上的数据项和数据结构，就可以设计出满足需求的各种实体。本系统规可以划出的实体有：图书实体、图书分类实体、管理员实体、用户实体，订单实体、订单明细实体。实体以及它们之间的关系可采用实体-关系图，即 E-R图表示出来，图略。

3．数据库逻辑结构设计

将上面的数据库概念结构转化为数据库的逻辑结构。存放各个实体相关信息的表的定义如下。 创建数据库db_shop，并创建九个数据表，图书的分类表两个，表 3-1和表 3-2：

表 3-1 图书的大类tb_ superType

字段 id typeName 用途 类别序号 图书类别名称 int Varchar 数据类型 4 50 长度 注释 主键，自动编号 自动保存 表 3-2 图书的子类tb_ subType

字段 id superType TypeName 用途 类别ID 父类ID 类别名称 int int varchar 数据类型 4 4 50 长度 注释 主键，自动编号 图书的大类编号 子类编号

图书表一个，用来表示图书的详细信息：

表 3-3 图书表tb_goods

字段 ID typeID goodsName introduce price 用途 图书入库序号 图书的子类编号 图书名称 简介 价格 数据类型 bigint int varchar text money 4 4 200 16 8 长度 注释 主键，自动编号

nowPrice picture INTime newGoods sale hit 实际价格 插图 入库时间 新书标记 特价标记 访问量 money varchar datetime int int int 8 100 8 4 4 4

书店的公告信息，例如打折促销等：

表 3-4 公告表tb_ bbs

字段 ID title content intime 用途 订单序号 公告信息标题 公告信息正文 发布公告时间 int varchar varchar datetime 数据类型 4 100 4000 8 长度 注释 主键，自动编号

图书的订购信息表两个, 定购汇总单和定购清单，表 3-5和表 3-6。

表 3-5 定购汇总单tb_order

字段 OrderID bnumber username Truename address postcode tel pay carry rebate OrderDate enforce bz 用途 订单序号 清单数量 定购用户 用户真实姓名 用户地址 用户邮编 用户电话 支付方式 订单支付方式 打折情况 订单生成日起 执行情况 订单注释信息 数据类型 bigint Int varchar varchar varchar varchar varchar varchar varchar int int int varchar 8 2 15 15 100 10 20 20 20 8 4 4 200 长度 注释 主键，自动编号 1执行，0未执行 表 3-6 定购清单tb_ detail

字段 用途 数据类型 长度 注释 id orderID goodsID price number 序号 订单序号 定购的图书序号 图书单价 数量 bigint bigint bigint money int 8 8 8 8 4 主键，自动编号 用户表两个，网站注册的普通用户和管理员，表 3-7和表 3-8：

表 3-7 普通用户tb_ member

字段 id 用途 入库序号 数据类型 bigint varchar varchar varchar varchar varchar varchar varchar varchar In t money varchar varchar int 8 20 20 20 20 100 6 24 20 4 8 20 100 4 长度 注释 主键，自动编号 1冻结 userName 用户注册名 trueName 用户真实姓名 passWord city address postcode cardNO cardType grade Amount tel email freeze 注册密码 城市 地址 邮编 证件编号 证件类型 可享受折扣等级 已购买总额 电话 邮箱 账户冻结情况 表 3-8 管理员表tb_ manager

字段 id Manager Pwd 用途 入库序号 管理员帐号 密码 int Varchar varchar 数据类型 4 20 20 长度 注释 主键，自动编号

网上书店的规定的购书享受折扣表：

表 3-9 折扣情况表tb_ rebate

字段 Grade Amount 用途 折扣级别 折扣要求金额 数据类型 varchar money 20 8 长度 注释 主键,表示级别 rebate 回扣，折扣 float 8

4．数据库连接类（JavaBean）

为了方便访问数据库，可以定义一个数据库连接类，实现数据库的连接。类的定义如下： package com; import java.sql.*; import java.io.*; import java.util.*; public class connDB {

public Connection conn = null; public Statement stmt = null; public ResultSet rs = null;

private static String dbClassName =\ private static String dbUrl =\ private static String dbUser = \ private static String dbPwd = \ //数据库驱动

public static Connection getConnection() { Connection conn = null; loadProperty(); try {

Class.forName(dbClassName).newInstance();

conn = DriverManager.getConnection(dbUrl, dbUser, dbPwd); }

catch (Exception ee) { ee.printStackTrace(); }

if (conn == null) { System.err.println(

\警告: DbConnectionManager.getConnection() 获得数据库链接失败.\\r\\n\\r\\n

链接类型:\链接位置:\用户/密码\ dbUser + \

}

return conn; }

//数据库查询

public ResultSet executeQuery(String sql) { try {

conn = getConnection();

stmt = conn.createStatement(ResultSet.TYPE_SCROLL_INSENSITIVE, ResultSet.CONCUR_READ_ONLY); rs = stmt.executeQuery(sql); }

catch (SQLException ex) {

System.err.println(ex.getMessage());

}

return rs; }

//数据库更新操作

public int executeUpdate(String sql) { int result = 0; try {

conn = getConnection();

stmt = conn.createStatement(ResultSet.TYPE_SCROLL_INSENSITIVE, ResultSet.CONCUR_READ_ONLY); result = stmt.executeUpdate(sql); }

catch (SQLException ex) { result = 0; } try {

stmt.close(); }

catch (SQLException ex1) { }

return result; }

public int executeUpdate_id(String sql) { int result = 0; try {

conn = getConnection();

stmt = conn.createStatement(ResultSet.TYPE_SCROLL_INSENSITIVE, ResultSet.CONCUR_READ_ONLY); result = stmt.executeUpdate(sql);

String ID = \ rs = stmt.executeQuery(ID); if (rs.next()) {

int autoID = rs.getInt(\ result = autoID; } }

catch (SQLException ex) { result = 0; }

return result; }

//关闭数据库的连接 public void close() { try {

if (rs != null) { rs.close();

} }

catch (Exception e) {

e.printStackTrace(System.err); } try {

if (stmt != null) { stmt.close(); } }

catch (Exception e) {

e.printStackTrace(System.err); } try {

if (conn != null) { conn.close(); } }

catch (Exception e) {

e.printStackTrace(System.err); } } }

3.3 网上书店的详细设计与实现

1．系统设计特点

（1）页面模块化

本系统在界面设计上采用了模块化的思想，把很多页面共有部分单独集成一个模块，例如页面的头、尾等，在开发系统时，遇到这些相同的页面部分就不需要重复编写，而只要在相应位置上加上<%@include file=\即可，大大提高了开发效率。

（2）三层结构设计

本系统采用三层结构设计，即程序逻辑结构分为用户界面层、业务逻辑层和数据存储层。由于网上书店系统的功能较强，相应的代码设计比较复杂，JSP 网页文本也会变得庞大，需要大量的嵌入 Java 代码和 HTML语句，其中，Java 代码为逻辑代码，即这些代码用来完成所需要的功能。嵌入 Java 代码、HTML 语句、JavaScript 语句，使编写和维护 JSP 网页变得很困难。使用 JavaBean 可以很好地解决这一问题。将 JSP 和 JavaBean结合起来，业务逻辑处理层采用 JavaBean 实现，然后在 JSP 网页中调用，而 JSP 文本着重是网页界面设计，这会使 JSP 网页变得清晰，可以节省软件开发时间，系统的安全性、可维护性、重用性和可扩展性都大大提高。

（3）面向对象程序设计

在本系统中将图书、用户、订单等都封装成相应的类，同时每个类又都有与其对应的操作类，从而再次提高了对数据库操作的安全性和程序的可扩展性。

（4）人性化设计

本系统导航清晰，操作方便、简单，不管用户位于本“书店”的任何地方，都不会迷路。

2．类的设计

在本系统中，为了实现前台显示和业务逻辑的分离，使系统更加健壮和灵活，将网上书店中的实体都封装在类中，这些类分别是图书类、图书分类类、订单类、订单明细类、用户类、购物车类。根据实体类建立了相应的管理类，实现对实体的管理操作，这些类分别是图书管理类、图书分类管理类、用户管理类、订单和购物车管理类、登录管理类。

（1）图书类的设计

图书类是对图书实体的抽象，它包含了图书实体的所有属性及图书对象的初始化构造的方法。其部分定义如下：

package commerce; public class goods { private long Id; //序列号

private String GoodsName; //书名 ??

//图书实体的其它属性 public book() { Id = 0;

GoodsName = \?? }

public void setId(long newId) {

this.Id = newId; }

public long getId() {

return Id; } ??

//用同样方法设置和获得实体的其他属性值。 }

（2）图书管理类的设计

由于图书实体的存在，需要对图书进行查询、添加等管理操作，为了使用上的方便，将这些方法封装到图书管理类中。 该类的主要方法如下：

book_search( ):完成图书查询 delete( ):负责图书删除 insert( ):负责图书的添加 update( ):负责图书的修改

（3）购物车类的设计

这个类是对购物车实体的抽象，它包含了购物车实体的所有属性及购物车对象的初始化构造方法。主要实现订单和购物车管理。其主要方法如下： addnew( ):负责向购物车中添加图书。

modishopernum( ):负责修改购物车中图书的购买数量。 delshoper( ):负责删除购物车中图书。

shopperwrite( ):负责将购物车数据写入订单和订单明细表。 deleteorder( ):负责删除订单。 searchallorder( ):负责查询订单。

update( ):当用户付款后，负责更新订单明细表中信息。

（4）用户管理类的设计

该类主要实现用户管理。其主要方法如下： add( ):负责添加用户。

delete( ):负责删除指定 ID 的用户。 update( ):负责用户资料的修改。

getalluser( ):负责取出书店的所有用户信息。 getuserinfo( ):负责取得指定用户的详细信息 其他实体类的定义与图书类定义相似。

3．前台用户页面设计

（1）主页面 index.jsp 的设计

主页文件名是 index.jsp，页面主要的 JSP 代码如下： <%@include file=\

<%@include file=\

图 3-6 主页index.jsp效果图

（2）主页面中几个模块的设计

在主页面中最核心的代码其实是几条包含语句：动态include和静态include： <%@include file=\

<%@include file=\

图 3-7 menu.htm效果图

图 3-8

copyright.htm效果图

left.jsp代码如下：

<%@ page contentType=\

desc\

ResultSet rs_sort = conn .executeQuery(\

sumNum from V_order_detail group by GoodsName,GoodsID order by sumNum desc\%>

https://www.bwwdw.com/plus/\

} %>

main.jsp效果见主页的居中部分，显示特价书和新书上架信息，主要代码如下： <%@ page contentType=https://www.bwwdw.com/plus/\ import=https://www.bwwdw.com/plus/\<%@ page import=https://www.bwwdw.com/plus/\<% connDB conn = new connDB(); String username = (String) session.getAttribute(https://www.bwwdw.com/plus/\ ResultSet rs_sale = conn .executeQuery(https://www.bwwdw.com/plus/\

price = rs.getFloat(4); nowprice = rs.getFloat(5); picture = rs.getString(6); %> (元) (元)   <% } %> <%

conn.close(); %>

（5）图书的详细信息页面设计 该页面效果如图 26 所示：

图 3-12图书的详细信息good_detail.jsp的效果图

图书的详细信息页面设计good_detail.jsp 关键代码如下：

<%@ page contentType=\<%@ page import=\<% connDB conn = new connDB(); String username = (String) session.getAttribute(\ int ID = -1; ID = Integer.parseInt(request.getParameter(\ if (ID > 0) { ResultSet rs = conn .executeQuery(\ID,GoodsName,Introduce,nowprice,picture from tb_goods where ID=\+ ID); int goodsID = -1; String goodsName = \ String introduce = \ float nowprice = (float) 0.0; String picture = \ if (rs.next()) { goodsID = rs.getInt(1); goodsName = rs.getString(2); introduce = rs.getString(3); nowprice = rs.getFloat(4); picture = rs.getString(5); }

%>

现价：<%=nowprice%>(元) <%=introduce%>

%>  <% conn.close(); } else { out.println(\您的操作有误'); window.location.href='index.jsp';\ } %>

（6）购物车查看页面的设计

在该模块中，用户可以修改购买数量，可以删除已选购的图书，清空购物车，还可以继续购书。如果用户想提交购物车，就必须以会员身份登录网站后，才拥有权限。该页面效果如图 26 所示：

图 3-13购物车页面cart_see.jsp的效果图

购物车页面cart_see.jsp关键代码如下：

<%@ page contentType=\<%@ page import=\

<%@ page import=\<%@ page import=\<%@ page import=\ <% String username = \ username = (String) session.getAttribute(\ if (username == \ out.println(\请先登录!'); window.location.href='index.jsp';\ } else { chStr chStr = new chStr(); connDB conn = new connDB(); Vector cart = (Vector) session.getAttribute(\ if (cart == null || cart.size() == 0) { response.sendRedirect(\ } else { %>

<% conn.close(); }//if }//if %>

|

| |

（7）会员信息修改页面设计

只有当注册用户即会员登录网站后，会员才可以提交购物车中图书订单和查看自己的订单信息，此外，会员还可以查看个人帐户和注销登录，会员登录后的页面如图 27 所示：

图 3-14会员信息修改modifyMember.jsp的效果图

会员信息修改modifyMember.jsp关键代码如下：

<%@ page contentType=\<%@ page import=\<% connDB conn = new connDB(); String username = (String) session.getAttribute(\

if (username != null && username != \ String sql = \ ResultSet rs = conn.executeQuery(sql); int id = -1; String truename = \ String PWD = \ String city = \ String address = \ String postcode = \ String cardNO = \ String cardType = \ String tel = \ String email = \ if (rs.next()) { id = rs.getInt(1); truename = rs.getString(3); PWD = rs.getString(4); city = rs.getString(5); address = rs.getString(6); postcode = rs.getString(7); cardNO = rs.getString(8); cardType = rs.getString(9); tel = rs.getString(12); email = rs.getString(13); } %>