《WEB程序开发》
课程设计报告
课题名称: 网上在线图书商城
院(系): 计算机科学学院
班 级:
姓 名:
学 号:
指导教师:
课程起止时间:
2019.12.30----2020.1.10
目录
一、项目背景... 1
二、设计目的... 1
三、设计任务... 1
四、开发环境... 1
五、系统需求... 1
5.1前台用户需求... 1
5.2后台管理需求... 2
六、系统设计... 2
6.1概念设计阶段... 2
6.2逻辑结构设计阶段... 3
6.2.1 E-R图转换为关系模型... 4
6.2.2 数据字典... 4
6.3数据库设计... 5
6.4数据库的运行和维护... 5
七、SSM框架的搭建... 5
八、系统实现... 15
8.1后端部分类的实现... 15
8.2前端实现部分用户交互... 16
8.2.1 管理员部分(部分界面)... 16
8.2.2 用户部分(部分界面)... 16
九、部分界面展示... 16
9.1前台用户界面展示... 16
9.1.1 登录主页... 16
9.1.2 用户登录界面... 17
9.1.3 用户登录后个人订单界面... 18
9.1.4 图书详情界面... 18
9.1.5 我的购物车界面... 19
9.1.6 个人信息中心... 19
9.2后台管理员界面展示... 20
9.2.1 登录主页... 20
9.2.2 订单管理界面... 20
9.2.3 用户列表界面... 20
9.2.4 添加用户界面... 20
9.2.5 图书列表界面... 21
9.2.6 添加图书界面... 21
9.2.7 分类列表界面... 21
9.2.8 管理员列表界面... 21
9.2.9 添加管理员界面... 22
十、课程设计小结... 22
十一、附录——部分重要源代码... 22
十二、指导老师意见... 42
一、项目背景
随着社会的不断进步,网络的不断发展,越来越多的网上商城相继出现。例如全球知名的亚马逊网上书店,国内的当当网上商城和卓越网等。顾客甚至足不出户就可以买到所需要的商品,从而节约大量时间,将更多的时间应用于其他更有意义的事情上。传统的书店存在着许多弊端,如商品种类太少,经营成本高等。相比之下,电子商城具有以下优势:商品种类多,信息量大;订购快捷方便;书店成本低,商品价格低廉;节约顾客购买时间;为了降低商店的成本,节约顾客的时间,从而开发此电子商城。
二、设计目的
通过对网上在线图书购买系统的系统分析、系统设计、编码和调试等工作的实践,熟悉管理信息系统的开发过程、设计方法及相关编程技术,熟练掌握数据库设计的基本理论及方法。熟悉WEB开发过程中使用的SSM框架以及其中涉及到的技术。
三、设计任务
本网上书店系统主要分为前台和后台。前台包括产品的展示及会员购物等模块,后台是管理界面,主要包括商品信息、人员信息及订单信息的设置。
具体来说就是前台用户可以注册账号或者登陆账号,可以查看书店的首页及简介,当然后台服务会给用户推荐一些精品推荐,也包括书店最新出版的书籍,打折优惠促销的书籍。当用户选择好心仪图书后加入购物车填写好地址、姓名、电话,然后付款即可购买,用户可以提前填好个人信息或者修改个人信息。
后台管理人员可以看到用户的注册信息(但是用户的隐私密码用MD5进行加密了),用户下的订单,其中未处理的需要管理员进行处理,用户管理中可以查看所有的用户,同时也能够添加用户,图书管理中,后台管理员可以对书籍的信息及属性进行修改,包括可以把促销图书改为推荐图书那个推荐栏中。当然管理员还可以查看所有的管理员信息或者添加更多的管理员
四、开发环境
操作系统:Windows 10
数据库系统:MySQL 8.0.18
开发工具:eclipse
jdk版本:1.8.0_131
Tomcat版本:Apache Tomcat v9.0
数据库jar包:mysql-connector-java-8.0.18.jar
五、系统需求
5.1
前台用户需求
1.用户可以在该购书网站上注册账号,同时也可以在注册账号后登陆自己的账号。
2.用户可以查看所有的图书信息,也可以在搜索框中搜索图书。
3.向用户推荐书店的最新出版、精品推荐、优惠促销的书籍,当用户点击心仪的书籍之后便跳转至该图书的详情界面,用户可以将其加入购物车,也可以退出继续浏览其他的书籍。
4.用户将商品加入购物车之后,先填写收货地址,收货人信息,电话等信息,再进行付款。
5.用户登录之后可以查看我的订单,可以去个人中心填写自己的信息或者修改自己的信息。
6.如果用户不想再逛该商场,可以注销登录,之后便返回用户登录界面。
5.2
后台管理需求
1.后台管理员可以查看用户新下的订单,未处理的订单需要及时处理。
2.后台管理员可以管理用户信息,包括查看所有的用户列表,以及可以添加用户。
3.在图书管理这部分,管理员可以查看所有图书信息,可以修改书籍的信息与属性,例如可以把促销图书改为推荐图书那个推荐栏中。
4.管理员可以修改分类列表的属性和添加一些分类的名称,例如计算机科学与技术。
5.任何一个后台管理员可以查看所有的管理员信息,也可以在主管理员的允许下添加其他的系统后台管理员。
六、系统设计
6.1
概念设计阶段
E-R图
6.2
逻辑结构设计阶段
6.2.1 E-R
图转换为关系模型
用户(序号,用户名,密码,姓名,性别,电话,地址)
图书信息(图书序号,图书名,作者,出版社,价格,图书类型,图书简介,图书封面,图书数量)
管理员信息(序号,用户名,密码,电话,邮箱)
购买(序号,图书序号,下单时间,下单数量)
修改信息(图书序号,管理员序号,修改时间,修改属性)
6.2.2
数据字典
admin表
admin |
id |
int(11) |
|
admin |
password |
varchar(255) |
|
admin |
username |
varchar(255) |
book表
book |
auther |
varchar(255) |
作者 |
book |
category_id |
int(11) |
分类 |
book |
count |
int(11) |
库存 |
book |
cover |
varchar(255) |
封面 |
book |
id |
int(11) |
|
book |
intro |
varchar(1024) |
介绍 |
book |
name |
varchar(255) |
名称 |
book |
news |
int(1) |
新书 |
book |
press |
varchar(255) |
出版社 |
book |
price |
float |
价格 |
book |
pubdate |
date |
出版日期 |
book |
sale |
int(1) |
打折 |
book |
special |
int(1) |
特卖 |
category表
category |
id |
int(11) |
|
category |
name |
varchar(20) |
indent表
indent |
address |
varchar(255) |
收货地址 |
indent |
amount |
int(11) |
商品总数 |
indent |
id |
int(11) |
|
indent |
name |
varchar(20) |
收货人姓名 |
indent |
phone |
varchar(20) |
收货人电话 |
indent |
status |
tinyint(4) |
状态(1未处理/2已处理) |
indent |
systime |
datetime |
下单时间 |
indent |
total |
float |
总价 |
indent |
user_id |
int(11) |
下单用户 |
items表
items |
amount |
int(11) |
数量 |
items |
book_id |
int(11) |
|
items |
id |
int(11) |
|
items |
indent_id |
int(11) |
|
items |
price |
float |
购买时价格 |
users表
users |
address |
varchar(255) |
收货地址 |
users |
id |
int(11) |
|
users |
password |
varchar(255) |
密码 |
users |
phone |
varchar(255) |
电话 |
users |
username |
varchar(255) |
用户名 |
6.3
数据库设计
数据库实施阶段,设计人员运营DBMS提供的数据库语言(如sql)及其宿主语言,根据逻辑设计和物理设计的结果建立数据库,编制和调试应用程序,组织数据入库,并进行试运行。
6.4
数据库的运行和维护
数据库维护是指当一个数据库被创建以后的工作都叫做数据库维护。包括备份系统数据、恢复数据库系统、产生用户信息表,并为信息表授权、监视系统运行状况,及时处理系统错误、保证系统数据安全,周期更改用户口令。
七、SSM框架的搭建
1.在poom.xml(位置:项目的根目录下)中引入必要的poom依赖(其中包括了spring、springmvc、jdbc、mysql、druid连接池、mybatis、lombok插件、juni他、其他工具包 )
如果想要自己添加jar包,可以在WEB-INF中新建lib文件夹,然后放入你的jar包(poom依赖下载的jar包编译过后其实也就是在编译包下的lib文件夹中)
2. 配置web.xml文件(位置:webapp下的WEB-INF中) tomcat启动时,会加载此文件,从而扫描加载其他的配置文件
其中包括了编码过滤、监听器、springmvc配置、spring容器中其他配置包括mybatis等、log4j配置、项目访问默认欢迎页,如需添加自定义过滤器,也许在此配置
3. 新建其他配置文mybatis-config.xml、spring-mvc.xml、spring-mybatis.xml、jdbc.properties、日志配置(log4j.properties和log4j.xml二选一,我用的log4j. properties)
jdbc.properties文件:
jdbc.driver=com.mysql.jdbc.Driver jdbc.url=jdbc:mysql://localhost:3306/book jdbc.username=root jdbc.password=sa
log4j. properties文件:
# Set root logger level to WARN and append to stdout log4j.rootLogger=ERROR, stdout ######################## #### ConsoleAppender log4j.appender.stdout=org.apache.log4j.ConsoleAppender log4j.appender.stdout.Target=System.out log4j.appender.stdout.layout=org.apache.log4j.PatternLayout log4j.appender.stdout.layout.ConversionPattern=%d %5p (%c:%L) - %m%n
mybatis-config.xml文件:
<?xml version="1.0" encoding="UTF-8"?> <!DOCTYPE configuration PUBLIC "-//mybatis.org//DTD Config 3.0//EN" "http://mybatis.org/dtd/mybatis-3-config.dtd"> <configuration> <settings> <!-- 开启驼峰命名转换 user_id ==> userId --> <setting name="mapUnderscoreToCamelCase" value="true"/> <!-- 打印sql语句 --> <!-- <setting name="logImpl" value="STDOUT_LOGGING"/> --> </settings> </configuration>
spring-mvc.xml文件:
<?xml version="1.0" encoding="UTF-8"?> <beans xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns:context="http://www.springframework.org/schema/context" xmlns="http://www.springframework.org/schema/beans" xmlns:mvc="http://www.springframework.org/schema/mvc" xsi:schemaLocation="http://www.springframework.org/schema/context http://www.springframework.org/schema/context/spring-context.xsd http://www.springframework.org/schema/beans http://www.springframework.org/schema/beans/spring-beans.xsd http://www.springframework.org/schema/mvc http://www.springframework.org/schema/mvc/spring-mvc.xsd"> <!-- 配置mvc注解扫描范围 --> <context:component-scan base-package="com.controller" /> <!-- 使用mvc注解 --> <mvc:annotation-driven /> <!-- 处理静态资源 --> <mvc:default-servlet-handler /> <!-- 配置拦截器 --> <mvc:interceptors> <mvc:interceptor><!-- 配置登陆拦截器 --> <mvc:mapping path="/admin/**"/> <bean class="com.config.AdminInterceptor"/> </mvc:interceptor> <mvc:interceptor><!-- 配置登陆拦截器 --> <mvc:mapping path="/index/**"/> <bean class="com.config.IndexInterceptor"/> </mvc:interceptor> </mvc:interceptors> <!-- 配置多媒体文件解析器 用于文件上传 --> <bean class="org.springframework.web.multipart.commons.CommonsMultipartResolver"> <!-- 设置上传文件的最大尺寸为5MB --> <property name="maxUploadSize" value="5242880" /> <property name="defaultEncoding" value="utf-8" /> </bean> </beans>
spring-mybatis.xml文件:
<?xml version="1.0" encoding="UTF-8"?> <beans xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns:context="http://www.springframework.org/schema/context" xmlns="http://www.springframework.org/schema/beans" xmlns:tx="http://www.springframework.org/schema/tx" xsi:schemaLocation="http://www.springframework.org/schema/context http://www.springframework.org/schema/context/spring-context.xsd http://www.springframework.org/schema/beans http://www.springframework.org/schema/beans/spring-beans.xsd http://www.springframework.org/schema/tx http://www.springframework.org/schema/tx/spring-tx.xsd"> <!-- 配置spring注解扫描范围 --> <context:component-scan base-package="com.service" /> <!-- 引用数据库配置文件 --> <context:property-placeholder location="classpath:jdbc.properties" /> <!-- 配置数据源 - 使用tomcat连接池 --> <bean class="org.apache.tomcat.jdbc.pool.DataSource" destroy-method="close"> <property name="driverClassName" value="$" /><!-- 数据库驱动 --> <property name="url" value="$?useSSL=false" /> <!-- 连接URL --> <property name="username" value="$" /> <!-- 数据库用户名 --> <property name="password" value="$" /> <!-- 数据库密码 --> <!-- 连接池参数配置 --> <property name="initialSize" value="1" /><!-- 连接器启动时创建的初始连接数。默认为10 --> <property name="maxActive" value="5" /><!-- 同时能分配的活跃连接的最大数目。默认为100 --> <property name="minIdle" value="1" /><!-- 空闲连接的最小数目。默认为 initialSize: 10 --> <property name="maxIdle" value="5" /><!-- 空闲连接的最大数目。默认为 maxActive: 100 --> <property name="testOnBorrow" value="true" /><!-- 从池中借出对象之前,是否对其进行验证。默认值为false。如果对象验证失败,将其从池中清除,再接着去借下一个。注意:为了让 true 值生效,validationQuery参数必须为非空字符串。为了实现更高效的验证,可以采用validationInterval --> <property name="validationQuery" value="select 1" /><!-- 在将池中连接返回给调用者之前,用于验证这些连接的SQL 查询。如果指定该值,则该查询不必返回任何数据,只是不抛出SQLException 异常。默认为 null --> <property name="validationInterval" value="30000" /><!-- 为避免过度验证而设定的频率时间值(以秒计)。最多以这种频率运行验证。如果连接应该进行验证,但却没能在此间隔时间内得到验证,则会重新对其进行验证。默认为30000(30秒) --> </bean> <!-- 配置MyBatis SqlSessionFactory --> <bean class="org.mybatis.spring.SqlSessionFactoryBean"> <property name="dataSource" ref="dataSource" /> <property name="configLocation" value="classpath:mybatis-config.xml"/><!-- 配置mybatis全局配置文件 --> </bean> <!-- 配置Dao所在包 Mybatis会动态创建实现类 --> <bean class="org.mybatis.spring.mapper.MapperScannerConfigurer"> <property name="sqlSessionFactoryBeanName" value="sqlSessionFactory" /> <property name="basePackage" value="com.dao" /><!-- 使用注解方式 --> </bean> <!-- 配置事务管理器 --> <bean class="org.springframework.jdbc.datasource.DataSourceTransactionManager"> <property name="dataSource" ref="dataSource" /> </bean> <!-- 使用注解定义事务 --> <tx:annotation-driven transaction-manager="transactionManager" /> </beans>
以上就是我框架的配置文件,经过不断的调试后终于搭建成功。
八、系统实现
8.1
后端部分类的实现
类名 |
说明 |
|
配置 (config) |
AdminInterceptor |
后台登录验证拦截器 |
IndexIntercepto |
用户登录验证拦截器 |
|
表现层 (controller) |
AdminController |
后台管理相关接口 |
IndexController |
前台相关接口 |
|
UserController |
用户相关接口 |
|
持久层 (dao) |
AdminDao |
管理员相关数据库处理 |
BookDao |
图书相关数据库处理 |
|
CategoryDao |
类目相关数据库处理 |
|
IndentDao |
订单相关数据库处理 |
|
ItemDao |
订单项相关数据库处理 |
|
UserDao |
用户相关数据库处理 |
|
实体类 (entity) |
Admin |
管理员实体 |
Book |
图书实体 |
|
Category |
类目实体 |
|
Indent |
订单实体 |
|
Item |
订单项实体 |
|
User |
用户实体 |
|
服务层 (service) |
AdminService |
管理员相关服务 |
BookService |
图书相关服务 |
|
CategoryService |
类目相关服务 |
|
IndentService |
订单相关服务 |
|
UserService |
用户相关服务 |
|
工具类 (Util) |
DataUtil |
时间格式化工具类 |
PageUtil |
分页工具类 |
|
SafeUtil |
安全工具类 |
|
UploadUtil |
上传工具类 |
其中,实体类、数据访问和业务逻辑模块分别设置了一个抽象类(业务逻辑层为通用类),供模块中其他类继承和扩展。这有利于统一方法接口,便于不同层次之间的调用。
DAO层,Service层这两个层次都可以单独开发,互相的耦合度很低,完全可以独立进行,这样的一种模式在开发大项目的过程中尤其有优势
Controller,View层因为耦合度比较高,因而要结合在一起开发,但是也可以看作一个整体独立于前两个层进行开发。这样,在层与层之前我们只需要知道接口的定义,调用接口即可完成所需要的逻辑单元应用,一切显得非常清晰简单。
Service层是建立在DAO层之上的,建立了DAO层后才可以建立Service层,而Service层又是在Controller层之下的,因而Service层应该既调用DAO层的接口,又要提供接口给Controller层的类来进行调用,它刚好处于一个中间层的位置。每个模型都有一个Service接口,每个接口分别封装各自的业务处理方法。
8.2
前端实现部分用户交互
8.2.1
管理员部分(部分界面)
login.jsp:管理员登录界面
index.jsp:管理员顶部导航
order_list.jsp:订单列表
admin_reset.jsp:管理员重置
down.jsp:底部导航
good_add.jsp:添加商品
good_edit.jsp:删除商品
good_list.jsp:查看商品列表
book-add.jsp:添加图书
book-update.jsp:修改图书信息
8.2.2
用户部分(部分界面)
login.jsp:用户登录界面
index.jsp:用户顶部导航
goods.jsp:书籍查看
order.jsp:订单信息
detail.jsp:商品细节展示
cart.jsp:购物车界面
pay.jsp:支付界面
search.jsp:查找图书界面
new.jsp:最新出版界面
my.jsp:个人信息界面