乐优购物商城设计与实现

文末获取源码和万字论文，制作不易，感谢点赞支持。

乐优购物商城设计与实现

摘  要

现如今先进科学技术高速发展，计算机技术已经被社会的各个领域广泛应用。随着计算机技术和通信技术的迅猛发展，互联网的规模也逐步增大，互联网的元素也随之逐渐增加，可以利用其发展通信，也可以利用其进行商业用途，可以在互联网上进行出售、收购、宣传等操作，从而使得互联网逐渐成为当今社会上必不可少的元素，而网站就是这个里很庞大的元素之一。

现如今,乐优购物商城是商业贸易中的一条非常重要的道路，可以把其从传统的实体模式中解放中来，网上购物可以为消费者提供巨大的便利。通过乐优购物商城这个平台，可以使用户足不出户就可以了解现今的流行趋势和丰富的商品信息，为用户提供了极大的方便，乐优购物商城的主要功能包含：商品类别管理、商品的信息管理、订单管理、用户的管理等。网站分为管理员、会员用户这二种用户平台。乐优购物商城主要使用MySQL作为数据库管理系统，开发环境是Java，这是一个基于Web技术的B/S结构的乐优购物商城。实现了一个乐优购物商城网站。能够让广大消费者体验到网上平台购物的乐趣，为网上购物提供了一个管理高效的、决策科学化、安全有效的电子商务平台。

关键词：乐优购物商城，MySQL，MyEclipse ，商业贸易

Abstract

目  录

第1章 绪论

1.1 背景和研究意义

随着21世纪以来，人们经济高速的发展，人们的生活发生了日新月异的变化，特别是计算机相关的应用已经普及到社会和经济社会的各个领域，为了让消费者的购物过程变得简单，方便，简洁，方便，网上商城购物已经成为一种新型而且热门·的购物方式，而商品无疑是顾客的选购的热点，这样来说网上销售成为新兴而热门的行业，网上销售是24个小时，只要把商品信息放到网上，就可以24小时营业了，开门市的费用低，房租和水电不用过多考虑，还有一个小仓库就可以解决问题，没有地区限制，只要是上网的用户都可以成为顾客。

1.2 论文研究的主要内容  

随着我国计算机互联网技术的飞速发展,，乐优购物商城系统的实施与建设，在技术与能力上已经日渐成熟。网络购物这一消费方式给人们生活带来了巨大的变化，除了购物场所的改变以外，更重要的是大大改变了传统的消费行为习惯，无论是否在网上购物，上网查看商品的相关信息，已经成为购物决策环节的重要组成部分，这一环节对购物行为的实际发生起到了至关重要的指导作用。

乐优购物商城系统是一个不断发展的新型项目，本课题的研究目的开发一个集商品管理，在线购物等功能于一体的乐优购物商城。乐优购物商城是现在商业贸易中的一条非常重要的道路，它能够让全球范围内的人在同一平台上发布自己的销售信息，同时购买到自己钟意的商品。本网站从符合界面友好、操作简单、安全、方便等前提出发充分考虑用户体验，让用户在网购体验上能达到一个较高的水平。为网上购物提供了一个管理高效的、决策科学化、安全有效的商务平台。

1.3 国内外现状

1.4 论文结构

论文的第1章主要阐述了课题的背景和研究意义以及主要内容和国内外的现状。第2章介绍了制作本网站所采用的关键性技术。第3章分析了网站的功能需求、数据需求以及可行性。第4章介绍了系统的体系结构、功能模块、数据库和页面样式的设计。第5章展示了本网站的前后台以及数据库的功能实现。第6章对网站进行了系统测试并对测试结果进行分析。最后一章为进行为期半年的毕业设计过程进行总结。

第2章 关键技术介绍

本项目是通过MVC框架技术来进行设计和实现的。项目主要用到的技术有JSP，javascript，html/css等。数据库使用的是MySQL。

2.1 JSP语言介绍

JSP，超文本预处理器（Hypertext Preprocessor ）,是一种通用的开源脚本语言。编程范型为面向对象和命令式编程语言，同时JSP可以在windows/Mac/linux跨平台中操作，它几乎支持所有流行的数据库。 JSP语言容纳了Java、C语言和Perl的特点，是众多开发语言中较为简单的一种开发语言，在Web开发领域中使用广泛，利于学习。

JSP拥有很多其他语言的语法特点，当然也有自己自创新的语法。JSP将程序嵌入到HTML文档中，可以将HTML写的静态网页与数据库联系在一起，形成动态网页。

2.2 ssm简介

ssm是一个轻量级组合框架，能更好的实现MVC模式，充分发挥了各自的优势。其中通过Struts在表示层中处理页面请求和转发工作；通过Spring的依赖注入（Inversion of Control，IoC）技术降低了程序之间的耦合性，也使程序员养成用接口编程的好习惯；通过Hibernate完成在持久层与数据库的交互工作。三层框架的整合形成一个结构良好、功能强大，层次清晰的框架体系。

1.Struts

Struts是一个独立的MVC模式框架，很好的实现了显示处理和业务处理逻辑之间的低耦合性。但Struts主要是针对表示层设计的，对业务逻辑方面的支持不是很强，比如事务管理、安全检查等本属于系统层面的，实现代码也穿插在整个业务逻辑中，降低了代码的可维护性，而Spring则可以很好地解决这些问题。

2.Spring

Spring也是独立的MVC模式框架，通过IoC技术，降低各组件之间的依赖，而Spring提供的面向切面编程（Aspect Oriented Programming，AOP）技术，在事务管理上具有独特优势。Spring框架不仅能有效地服务中间层对象，而且易于同其他层框架进行无缝集成，使各层之间相互独立，实现了在架构上各框架间的低耦合性。

3.MyBatis

MyBatis 是集合多种操作型关系数据库的概念和方法，它是一个强大的数据访问工具和解决方法[5]。对比 Hibernate，MyBatis 是一个半自动框架，Hibernate 则是一个全自动框架，无法直接维护 MyMySQL  。MyBatis在书写 MyMySQL   的灵活性很好，Hibernate 就不行，会比较麻烦。本文使用 MyBatis 作为海田在线商城这种多变性的项目，Hibernate 比较适合稳定的项目。而且 MyBatis 速度相对于 Hibernate 的速度要快些。

2.3 html/CSS简介

HTML全称为Hyper Text Markup Language，是一种超文本标记语言或超文本链接语言，被用来制作万维网页面的简单标记语言，它消除了计算机之间信息交流的障碍，是万维网浏览器通用的一种标准语言。它可以用很多浏览器打开。

在目前，它在网络上被广泛应用，是大众普遍接受的一种通用制作网页的语言。HTML主要用于制作静态页面，HTML命令可以说明图形信息、表格信息、文字信息、链接信息等。HTML作为制作网站最基础的语言，它主要由头部（head）和主体（body）组成，头部可以加标题，展示浏览器所需信息，主体则是包含网页显示的内容。作为最基础的语言，在HTML文件中可以插入JSP语言形成JSP文件，也可以插入JavaScript语言形成不同风格的功能特效。

2.4 MySQL介绍

MySQL是一种关联数据库管理系统，关联数据库将数据保存在不同的表中，而不是将所有数据放在一个大仓库内。这样就增加了速度并提高了灵活性。MySQL的MySQL“结构化查询语言”。由于其体积小、速度快、总体拥有成本低，尤其是开放源码这一特点，许多中小型网站为了降低网站总体拥有成本而选择了MySQL作为网站数据库。

第3章 系统分析

3.1 功能需求分析

3.商品购买用例：

商品购买功能，主要完成用户对商品进行购买、生成订单，付款，管理员管理用户的订单信息等。

商品购买模块添加购买功能用例描述详见下表。

表3.5 商品购买模块功能的分解用例描述

3.2数据流程分析 

对本系统的数据流进行分析，得到系统数据流程图0层图，1层图，2层图，如下所示。

图3.5数据流程图（0层）

图3.5数据流程图（1层）

商品管理数据流图

图3.5数据流程图（2层）

3.3可行性分析

本网站将在经济、功能、技术这三个角度上进行可行性分析。

3.3.1 经济可行性 

3.3.2 功能可行性 

功能可行性分析主要分析网站的功能是否可以满足用户的需求，从实际使用情况来分析，整体网站功能完整，运行速度良好，符合了浏览者的浏览习惯。为用户提供了更为方便简单的浏览环境。

3.3.3 技术可行性 

技术可行性分析的目的是确认使用现有的技术能否实现系统以及对开发效率和完成情况的评估。

系统基于MVC框架开发，具有简单易学，灵活，良好的可扩展性，执行效率高，易于配置和部署等优点。使用MySQL数据库管理系统进行数据存储，具有体积小、速度快、总体拥有成本低，尤其是开放源码这一优点。

采用以上技术可以有效的保证系统成功及高效地开发。

第4章 系统设计

本章将对乐优购物商城系统进行系统设计。包括体系结构设计、功能模块设计、数据库设计和页面设计。首先确定系统的实现将采用B/S架构，根据需求分析阶段的结果设计功能模块，最后设计数据库概念模型和逻辑模型。

4.1体系结构设计

4.2功能模块设计

通过软件的需求分析已经获得了系统的基本功能需求。根据面向对象的不同系统分为前台普通用户界面和后台管理界面。系统功能结构如下图所示。

图3.1 乐优购物商城功能层次图

前台子系统为用户提供注册、登陆的功能，以及浏览商品，购买商品，提交订单后采用模拟的金额支付，实现商品的购买流程。后台子系统供网站内部管理人员使用，可以添加新的商品、商品修改和调整，商品种类维护，可以对用户进行管理。对用户的订单进行管理发货等等。

1. 前台模块设计：

• 注册功能。用户首先要进行注册成为网站的用户，注册时需填写用户名、邮箱号、密码3项信息，然后点击“注册”按钮。如果注册成功，则提示注册成功并转到用户登录界面，同时用户信息会被写进数据库中的用户表中。如果注册失败，则会提示失败原因。用户注册成功后就可以登陆了。
• 登陆功能。如果用户是网站的已注册用户，在购买商品前需要填写邮箱号和密码，之后点击“登陆”按钮，之后系统会将用户填入的信息与数据库中用户注册时填写的信息进行比对，如果一致的话网站将会跳转到首页用户即可享受到网站的购买商品。如果用户填写的信息有误，网站将会提示用户输入的信息有误。
• 商品展示功能。网站将所有商品信息从数据库中提取出来显示在网站中，用户可以浏览网站，将自己心怡的商品放入购物车中，这是系统会提取该商品的信息并将信息加入购物车表中。
• 购物车功能。当用户选择完商品后可以进入购物车页面，系统会从购物车表中提取用户的购物车信息并显示出来，用户可以在这里查看自己要购买的商品，也可以取消购买某商品，这时该商品的信息会从购物车表中删除。
• 订单生成功能。在购物车模块，当用户确定所买的商品后，单击“订单生成”的功能，进入订单的界面。在结账界面，系统会将购物车表中的商品信息显示在订单中并根据用户购买的数量和商品的单价计算出用户购买的商品的总价，接下来只需要用户填写收货信息选择付款和发货方式并点击“确认提交订单”按钮。确认后产生将订单，系统会将订单信息插入数据库中的订单表和订单商品表中，并进入支付页面。

2.后台模块设计：

• 用户管理功能。管理员在后台首页点击用户管理就会进入用户列表页面，系统会将数据库中的用户信息以列表的形式显示出来，管理员可以在这个页面进行用户的更新和删除操作，系统可以将最新更新的信息重新写入用户表中并替换原信息，也可以将用户的信息从数据表中删除。
• 商品类别管理功能。管理员在后台点击商品分类按钮会进入商品分类界面，系统会将数据库中的商品分类信息以列表的形式展现出来，管理员可以对商品的分类进行排序，也可以在该页面点击添加新分类、编辑和删除按钮，同时系统会在数据库中对商品分类表中的数据进行相应的新增，更新和删除。
• 商品信息管理功能。管理员在后台点击商品管理就会进入商品管理界面，系统会将数据库中的商品信息以列表的形式显示出来，管理员可以在该界面对商品进行添加、更新和删除的操作。在新增时，如果添加成功系统会提示新增成功同时将新商品信息添加进数据库中的商品表，如果添加失败，系统会提示失败的原因。当管理员对商品信息进行更新时，数据表中的商品信息也会随之更新。管理员删除商品，数据表中相应的商品信息也会随之删除。
• 客户购物管理功能。管理员在后台点击订单管理就会进入订单管理界面，系统会从数据库中将订单信息提取出来，依列表的形式展现出来。管理员可以在该界面对订单的发货状态进行更改也可以删除订单，同时数据库中订单表中的订单状态也会更新，或者删除订单数据。
• 新闻管理功能。网站会不定时的更新一些有关于时尚潮流趋势的新闻，用户也可以浏览这些新闻从中了解近期的时尚资讯。管理员在后台点击编辑新闻就会进入编辑新闻界面，系统会将新闻数据表中的数据提取出来显示在页面上，管理员可以在这里修改新闻，然后点击“保存修改”按钮进行保存，然后系统会同步更新新闻表中的内容并提示更新成功。
• 商品资讯管理：管理员发布商品资讯后，普通用户便可以查询到该商品资讯，用户选择某个商品资讯，查询商品资讯，管理员审核添加，或删除商品资讯。
• 购买须知管理功能。网站会不定时的更新一些有关于时尚潮流趋势的新闻，用户也可以浏览这些新闻从中了解近期的购买须知。管理员在后台点击编辑新闻就会进入编辑新闻界面，系统会将新闻数据表中的数据提取出来显示在页面上，管理员可以在这里修改新闻，然后点击“保存修改”按钮进行保存，然后系统会同步更新新闻表中的内容并提示更新成功。

4.3数据库设计

4.3.1 概念模型设计 

本小节将设计数据库的逻辑结构，包括所需的实体和关系，实体规范化等工作，主要反映业务逻辑。

根据需求分析可以得到的实体有：用户、商品、商品类别、购物车、订单。系统E-R图如下图所示。

图3.5系统E-R图

4.3.2 数据库表设计 

将概念模型转换成数据库表，得到如下几张表。

allusers表:

dingdanxinxi表:

dx表:

goumaijilu表:

liuyanban表:

pinglun表:

shangpinleibie表:

shangpinxinxi表:

shoucangjilu表:

xinwentongzhi表:

yonghuzhuce表:

youqinglianjie表:

第5章 系统实现

乐优购物商城分为前台用户购物子系统和后台管理系统。本章节只要详细分析了该系统的数据库连接和系统各功能模块的实现过程和实现方法。在网站前台，用户通过操作表示层页面，页面调用业务逻辑层的对象方法，来操作数据库，实现相应的功能。

5.1数据库连接实现 

目前的数据库包括MySQL、SQL、PgSQL、Oracle、Ibase以及PDO的支持，如果应用需要使用数据库，必须配置数据库连接信息。

在项目的配置文件Config/config.JSP 文件里，增加以下数据库配置选项即可达到数据库连接目的：

<? JSP

return array(

//'配置项'=>'配置值'

    'DB_TYPE'   => 'MySQL', // 数据库类型

    'DB_HOST'   => '127.0.0.1', // 服务器地址

    'DB_NAME'   => dzswwz', // 数据库名

    'DB_USER'   => 'root', // 用户名

    'DB_PWD'    => '123456', // 密码

    'DB_PORT'   => 3306, // 端口

    'DB_PREFIX' => 'tp_', // 数据库表前缀

    'DB_CHARSET'=> 'utf8', // 字符集

    'DB_DEBUG'  =>  TRUE, // 数据库调试模式 开启后可以记录MySQL日志 3.2.3新增

5.2系统前台主要功能实现 

5.2.1 首页实现 

首页是网站的入口，主要包含了：LOGO、导航、Banner、以及热卖商品推荐等功能。首页页面，如下图所示。

图5.1 首页页面图

首页主要代码如下：

title>易买得乐优购物商城</title>

<LINK href="images/style.css" type=text/css rel=stylesheet>

<meta http-equiv="Content-Type" content="text/html; charset=gb2312"><style type="text/css">

<!--

body,td,th {

font-size: 12px;

}

-->

</style></head>

 <BODY leftMargin=5 topMargin=5 rightMargin=5>

<table width="100%" height="210" border="1" align="center" cellpadding="3" cellspacing="1" bordercolor="#D9E9FF" style="border-collapse:collapse">  

  <TBODY>

    <TR

  align=middle bgColor=#ffffff>

      <td colspan="4" bgColor=#CADCEA><strong>系统基本信息</strong></td>

首页热卖商品推荐部分主要是显示被网站推荐的商品，可以让用户刚进入网站便可以了解网站近期主推的商品，实现功能的部分代码如下：

商品信息</title>

<LINK href="css.css" type=text/css rel=stylesheet>

<script type="text/javascript" src="js/My97DatePicker/WdatePicker.js" charset="gb2312"></script>

  </head>

<script language = "JavaScript">

var onecount;

onecount=0;

subcat = new Array();

 <%

 int count = 0;

 for(HashMap map:new CommDAO().select("select id,fid,fname from hsgwuxianfenlei order by id asc"))

 {

%>

subcat[<%=count%>] = new Array("<%=map.get("fname")%>","<%=map.get("fid")%>","<%=map.get("id")%>");//产生数组

<%

count = count + 1;

  }

%>

5.2.2商品分类展示实现 

商品分类展示页是根据分类展示网站商品的页面，当用户在导航上选择一种商品分类时，系统会将被选中的分类项的id，然后用MySQL语句拼接，从数据库选出该分类id下的所有商品，只会遍历出来，放入<td>中MySQL语句="select shangpinmingcheng,id,tupian,jiage,addtime from shangpinxinxi order by addtime desc"。

商品分类展示页面，如下图所示。

图5.2 商品分类展示页面图

商品分类展示主要代码如下：

商品类别</title>

<LINK href="css.css" type=text/css rel=stylesheet>

    <script type="text/javascript" src="js/My97DatePicker/WdatePicker.js" charset="gb2312"></script>

<script type="text/javascript" src="js/popup.js"></script>

  </head>

<%

  String id="";

   %>

5.2.3商品详情实现

商品详情页向用户展示商品详细信息的页面，用户可以在商品分类展示页或者在网站任意一个商品类别的页面中选择一件商品，系统将商品的id通过GET方法传递到shangpinxinxidetail.JSP中的detail方法中，然后通过M方法实例化模型，传入到shangpin表中连接信息，获取到该id的商品信息，最后将信息反馈到Goods类的shangpinxinxidetail.html界面上。

商品详情页面，如下图所示。

图5.3商品详情页面图

商品详情主要代码如下：

商品信息</title>

<link rel="stylesheet" href="kindeditor_a5/themes/default/default.css" />

<link rel="stylesheet" href="kindeditor_a5/plugins/code/prettify.css" />

<script charset="utf-8" src="kindeditor_a5/kindeditor.js"></script>

<script charset="utf-8" src="kindeditor_a5/lang/zh_CN.js"></script>

<script charset="utf-8" src="kindeditor_a5/plugins/code/prettify.js"></script>

<script>

KindEditor.ready(function(K) {

var editor1 = K.create('textarea[name="xiangqing"]', {

cssPath : 'kindeditor_a5/plugins/code/prettify.css',

uploadJson : 'kindeditor_a5/jsp/upload_json.jsp',

fileManagerJson : 'kindeditor_a5/jsp/file_manager_json.jsp',

allowFileManager : true,

afterCreate : function() {

var self = this;

K.ctrl(document, 13, function() {

self.sync();

document.forms['example'].submit();

});

K.ctrl(self.edit.doc, 13, function() {

self.sync();

document.forms['example'].submit();

})

5.2.4购物车实现

购物车是用户用于暂时存放所选心怡商品的页面，当用户对某一件商品产生购买欲望的时候，用户可以进入该商品的商品详情页面选择想要购买的数量颜色等属性，然后点击“加入购物车”按钮，用户选择的该商品的信息就会通过POST方法传递到goumaijilu_add_post.JSP中的addCar方法中，然后系统根据用户登陆时保存到Session的用户id迅速为该用户在数据库中的cart表中添加一条购物车信息，并将该信息反馈到前台的index.html页面上。用户可以通过点击页面右上角的购物车图标来进入购物车页面查看购物车中的商品。

购物车页面，如下图所示。

图5.4 购物车页面图

购物车主要代码如下：

购买记录</title>

<LINK href="css.css" type=text/css rel=stylesheet>

    <script type="text/javascript" src="js/My97DatePicker/WdatePicker.js" charset="gb2312"></script>

<script type="text/javascript" src="js/popup.js"></script>

  </head>

<%

  String id="";

  id=request.getParameter("id");

 HashMap mlbdq = new CommDAO().getmap(id,"shangpinxinxi");

 String bianhao="";

   String mingcheng="";

   String leibie="";

   String jiage="";

   String faburen="";

 bianhao=(String)mlbdq.get("bianhao");

   mingcheng=(String)mlbdq.get("mingcheng");

   leibie=(String)mlbdq.get("leibie");

   jiage=(String)mlbdq.get("jiage");

   faburen=(String)mlbdq.get("faburen");

   %>

5.3系统后台主要功能实现 

5.3.1管理员登陆实现

管理员登陆页是后台管理员进入后台管理各项数据必经的页面。管理员输入的账号密码经过后台的Login.JSP的login方法中通过M方法实例化模型，传入到allusers表中连接信息，通过与表中的信息进行比对确定管理员能否登陆。

管理员登陆页面，如下图所示。

图5.5 管理员页面图

登录系统主要代码如下：

易买得乐优购物商城</title>

<meta http-equiv="Content-Type" content="text/html; charset=gb2312">

<style type="text/css">

<!--

*{overflow:hidden; font-size:9pt;}

body {

margin-left: 0px;

margin-top: 0px;

margin-right: 0px;

margin-bottom: 0px;

background-repeat: repeat-x;

background-color: #D4D8E3;

}

.STYLE8 {color: #A1A8D2}

.STYLE7 {color: #FFFFFF}

.STYLE9 {color: #000000; font-size:12px}

-->

</style>

</head>

<script type="text/javascript">

 <%

String error = (String)request.getAttribute("error");

if(error!=null)

{

 %>

 alert("用户名或密码错误");

 <%}%>

5.3.2商品管理实现

用户在网站后台点击添加商品，跳转至shangpin_add.jsp页面，填写好表单参数，提交至shangpin_add_post.jsp页面，然后又shangpin_add_post.jsp操作数据库，完成商品的添加。首先管理员点击进入普通商品列表shangpinxinxi_list.jsp，可以选择删除、或者修改，如果管理员点击删除，则将通过js提示管理员是否删除onClick="return confirm('真的要删除？')"，如果删除后将请求sh.jsp进行数据库数据删除，如果管理员选择修改商品信息，将跳转至shangpinxinxi_updt2.jsp，然后管理员修改后，页面请求shangpinxinxi_updt2_post.jsp来操作数据库完成商品信息的修改。

商品管理页是管理员管理商品的页面，管理员在这里可以对网站中的商品进行添加、删除、更新以及查看操作。

商品管理页面，如下图所示。

图5.6 商品管理页面图

商品管理主要代码如下：

商品信息</title>

<LINK href="css.css" type=text/css rel=stylesheet>

<script type="text/javascript" src="js/My97DatePicker/WdatePicker.js" charset="gb2312"></script>

  </head>

<script language = "JavaScript">

var onecount;

onecount=0;

subcat = new Array();

 <%

 int count = 0;

 for(HashMap map:new CommDAO().select("select id,fid,fname from hsgwuxianfenlei order by id asc"))

 {

%>

subcat[<%=count%>] = new Array("<%=map.get("fname")%>","<%=map.get("fid")%>","<%=map.get("id")%>");//产生数组

<%

count = count + 1;

  }

%>

5.3.3订单管理实现

第6章 系统测试

软件需要按照测试方案和测试流程对软件的性能和功能进行测试。系统测试是通过执行程序来发现系统中的错误。测试和开发需要同步进行。

6.1 测试用例 

6.2 测试结果分析

在网站完成后，及时的对网站进行一系列的测试，通过一次次的测试来去发现程序中的问题。首先对各个功能模块进行了独立的测试。然后再对整个网站进行测试。测试用户的登陆和注册功能，商品的显示、购买，以及管理员在网站后台对网站的各部分进行管理，根据测试结果得知各个功能模块都达到了设计的要求。各个模块在整个系统中都能完成各自的功能，相互之间的连接也很顺利。对数据库的增加、删除、更新、查看操作也都能够顺利的完成。经过测试整个网站的功能都达到了预期的要求。在测试过程中发现的程序错误等也得到了及时的解决，从而保证了后期系统的稳定运行。

第7章 结　论

参考文献

致 谢