基于SpringBoot+Vue的电商应用系统的设计与实现

摘 要

现代经济快节奏发展以及不断完善升级的信息化技术，让传统数据信息的管理升级为软件存储，归纳，集中处理数据信息的管理方式。本电商应用系统就是在这样的大环境下诞生，其可以帮助管理者在短时间内处理完毕庞大的数据信息，使用这种软件工具可以帮助管理人员提高事务处理效率，达到事半功倍的效果。此电商应用系统使用跨平台的可开发大型商业网站的HTML技术，以及最受欢迎的RDBMS应用软件之一的MySQL数据库进行程序开发，后台采用Java语言的Spring Boot框架，前台采用VUE框架和layui样式，电商应用系统实现页面基本用HTML文件写作方式。电商应用系统有管理员和用户两个角色。管理员功能有个人中心，管理员管理，公告类型管理，商品类型管理，论坛管理，积分记录管理，公告信息管理，商品信息管理，商品评价管理，商品收藏管理，商品订单管理，用户管理，轮播图管理。用户可以注册登录，查看和购买商品，对商品进行评价和收藏，在论坛发消息等操作。电商应用系统的开发根据操作人员需要设计的界面简洁美观，在功能模块布局上跟同类型网站保持一致，程序在实现基本要求功能时，也为数据信息面临的安全问题提供了一些实用的解决方案。可以说该程序在帮助管理者高效率地处理工作事务的同时，也实现了数据信息的整体化，规范化与自动化。

关键词：电商应用系统；HTML技术；MySQL；VUE；Spring Boot

Abstract

The fast-paced development of the modern economy and the continuous improvement and upgrading of information technology have upgraded the management of traditional data information to a management method of software storage, induction, and centralized processing of data information. This e-commerce application system was born in such a large environment. It can help managers to process huge data information in a short time. Using this software tool can help managers improve transaction processing efficiency and achieve twice the result with half the effort. This e-commerce application system uses cross-platform HTML technology that can develop large-scale commercial websites, and MySQL database, one of the most popular RDBMS application software, for program development. The background uses the Spring Boot framework of Java language, and the front desk uses the VUE framework and layui Style, the e-commerce application system realizes the basic way of writing pages with HTML files. The e-commerce application system has two roles: administrator and user. The administrator functions include personal center, administrator management, announcement type management, commodity type management, forum management, point record management, announcement information management, commodity information management, commodity evaluation management, commodity collection management, commodity order management, user management, wheel Play image management. Users can register and log in, view and purchase products, evaluate and favorite products, and send messages in forums. The development of the e-commerce application system is designed according to the needs of the operator. The interface is simple and beautiful, and the layout of the functional modules is consistent with the same type of website. When the program realizes the basic required functions, it also provides some practical solutions for the security problems faced by the data and information. Program. It can be said that this program not only helps managers deal with work affairs efficiently, but also realizes the integration, standardization and automation of data information.

**Key Words：**E-commerce application system; HTML technology; MySQL; VUE; Spring Boot

目 录

目 录 III

1 绪论 1

1.1 研究背景 1

1.2 目的和意义 1

1.3 论文结构安排 2

2 相关技术 3

2.1 HTML技术介绍 3

2.2 B/S结构介绍 4

2.3 MySQL数据库介绍 5

2.4 Java语言介绍 6

2.5 VUE框架介绍 6

2.6 Tomcat 服务器介绍 7

2.7 layui介绍 7

2.8 Spring Boot框架介绍 8

3 系统分析 9

3.1 系统可行性分析 9

3.1.1 技术可行性分析 9

3.1.2 经济可行性分析 9

3.1.3 运行可行性分析 9

3.2 系统性能分析 10

3.2.1 易用性指标 10

3.2.2 可扩展性指标 10

3.2.3 健壮性指标 10

3.2.4 安全性指标 11

3.3 系统流程分析 11

3.3.1 操作流程分析 11

3.3.2 登录流程分析 12

3.3.3 信息添加流程分析 13

3.3.4 信息删除流程分析 14

4 系统设计 15

4.1 系统设计的原则 15

4.2 系统概要设计 16

4.3 系统功能结构设计 16

4.4 数据库设计 17

4.4.1 数据库E-R图设计 17

4.4.2 数据库表结构设计 19

5 系统实现 25

5.1 管理员功能介绍 25

5.1.1 管理员管理 25

5.1.2 公告类型管理 25

5.1.3 论坛管理 26

5.1.4 商品类型管理 26

5.1.5 商品信息管理 27

5.1.6 轮播图管理 27

5.1.7 公告信息管理 28

5.1.8 用户信息管理 28

5.2 用户功能介绍 29

5.2.1 个人中心 29

5.2.2 公告类型信息 30

5.2.3 商品信息 30

5.2.4 公告信息管理 31

6 系统测试 32

6.1 系统测试的特点 32

6.2 系统测试方法 32

6.3 系统功能测试 33

6.3.1 登录功能测试 33

6.3.2 修改密码功能测试 34

6.4 测试结果分析 35

结 论 36

致 谢 37

参考文献 38

1 绪论

1.1 研究背景

当前社会各行业领域竞争压力非常大，随着当前时代的信息化，科学化发展，让社会各行业领域都争相使用新的信息技术，对行业内的各种相关数据进行科学化，规范化管理。这样的大环境让那些止步不前，不接受信息改革带来的信息技术的企业随时面临被淘汰，被取代的风险。所以当今，各个行业领域，不管是传统的教育行业，餐饮行业，还是旅游行业，医疗行业等领域都将使用新的信息技术进行信息革命，改变传统的纸质化，需要人手工处理工作事务的办公环境。软件信息技术能够覆盖社会各行业领域是时代的发展要求，各种数据以及文件真正实现电子化是信息社会发展的不可逆转的必然趋势。本电商应用系统也是紧跟科学技术的发展，运用当今一流的软件技术实现软件系统的开发，让电商方面的信息完全通过管理系统实现科学化，规范化，程序化管理。从而帮助信息管理者节省事务处理的时间，降低数据处理的错误率，对于基础数据的管理水平可以起到促进作用，也从一定程度上对随意的业务管理工作进行了避免，同时，电商应用系统的数据库里面存储的各种动态信息，也为上层管理人员作出重大决策提供了大量的事实依据。总之，电商应用系统是一款可以真正提升管理者的办公效率的软件系统。

1.2 目的和意义

信息数据的处理完全依赖人工进行操作，会耗费大量的人工成本，特别是面对大量的数据信息时，传统人工操作不仅不能对数据的出错率进行保证，还容易出现各种信息资源的低利用率与低安全性问题。更有甚者，耽误大量的宝贵时间，尤其是对信息的更新，归纳与统计更是耗财耗力的过程。所以电子化信息管理的出现就能缓解以及改变传统人工方式面临的处境，一方面可以确保信息数据在短时间被高效处理，还能节省人力成本，另一方面可以确保信息数据的安全性，可靠性，并可以实现信息数据的快速检索与修改操作，这些优点是之前的旧操作模式无法比拟的。因此电商应用系统为数据信息的管理模式的升级与改革提供了重要的窗口。

此次电商应用系统的开发，需要用到的知识不仅涉及到界面设计与功能设计方面的知识，还需要涉及到数据库与编程语言上面的知识，这些知识点对于一个即将毕业的学生来说，一是为了巩固在校所学相关专业知识；二是为了让学生学会如何将专业理论知识运用于现实软件的开发过程；三是让学生明白知识是无穷无尽的，要时刻明白活到老学到老的真正含义，让学生要养成时刻学习的习惯，同时也要相信通过此次程序的开发，会让学生对于专业知识的理解与软件开发水平的提高有着极大的帮助。

1.3 论文结构安排

为了帮助用户更好的了解和理解程序的开发流程与相关内容，本文将通过六个章节进行内容阐述。

第一章：描述了程序的开发背景，程序运用于现实生活的目的与意义，以及程序文档的结构安排信息；

第二章：描述了程序的开发环境，包括程序开发涉及到的技术，程序开发使用的数据存储工具等信息；

第三章：描述了程序着手进行开发时，会面临的可行性问题，并对程序功能以及性能要求进行描述；

第四章：描述了程序大功能模块下的功能细分信息，以及存储程序数据的数据库表文件结构的设计信息等；

第五章：描述了程序的功能实现界面的内容，也对程序操作人员操作的部分功能进行了描述；

第六章：描述了程序功能的测试内容，并介绍了系统测试的概念与方法。

2 相关技术

2.1 HTML技术介绍

超文本标记语言，标准通用标记语言下的一个应用。 “超文本”就是指页面内可以包含图片、链接，甚至音乐、程序等非文字元素。 超文本标记语言的结构包括“头”部分（英语：Head）、和“主体”部分（英语：Body），其中“头”部提供关于网页的信息，“主体”部分提供网页的具体内容。

语言概述

在WWW上的一个超媒体文档称之为一个页面（page）。作为一个组织或个人在万维网上开始点的页面称为主页Homepage，或首页，主页中通常包括有指向其他相关页面或其他节点的指针（超级链接）。在逻辑上将视为一个整体的一系列页面的有机集合称为网站（Website或Web）。

Web页面也就是通常所说的网页，在这里不作区分。

折叠规范标准

HTML是一种规范，一种标准，它通过标记符号来标记要显示的网页中的各个部分。网页文件本身是一种文本文件，通过在文本文件中添加标记符，可以告诉浏览器如何显示其中的内容（如：文字如何处理，画面如何安排，图片如何显示等）。浏览器按顺序阅读网页文件，然后根据标记符解释和显示其标记的内容，对书写出错的标记将不指出其错误，且不停止其解释执行过程，编制者只能通过显示效果来分析出错原因和出错部位。但需要注意的是，对于不同的浏览器，对同一标记符可能会有不完全相同的解释，因而可能会有不同的显示效果。

折叠标记语言

HTML之所以称为超文本标记语言，是因为文本中包含了所谓“超级链接”点------就是一种URL指针，通过激活（点击）它，可使浏览器方便地获取新的网页。这也是HTML获得广泛应用的最重要的原因之一。

由此可见，网页的本质就是HTML，通过结合使用其他的Web技术（如：脚本语言、CGI、组件等），可以创造出功能强大的网页。因而，HTML是Web编程的基础，也就是说万维网是建立在超文本基础之上的。

2.2 B/S结构介绍

在早期，一些使用HTML语言编写的文件，再集合一些其它资源文件就可以组成一个最简单的Web程序，了解了Web程序也需要了解Web站点，它们之间的关系就是一个或者多个Web程序可以放在Internet上的一个Web站点（Web服务器）中进行使用。可以说Web应用程序的开发也带动了B/S这种网络结构模式的兴起。B是Brower（浏览器）的首字母，S是Server（服务器）的首字母，两个首字母进行组合就成了网络结构模式的简称B/S。由于这种结构模式通过安装在客户端的浏览器进行服务器的访问，可以把程序的核心功能安排在服务器中进行处理，给程序的开发，后期使用和维护省去了许多工作。

（1）浏览器

它主要安装于用户客户端，可以把操作指令传达给服务器，也可以接收服务器返回的操作指令的操作结果，并把Web信息显示于浏览器的界面让用户阅读和浏览，前提是程序是用B/S方式进行开发的。

（2）服务器

服务器这个名称有时也运用于对计算机硬件设备进行称呼，有时也运用于计算机服务端的软件进行称呼，这二者的区别还需要从语境的方式进行区分。硬件意义的服务器是一个性能突出的计算机，是网络的灵魂，作为网络节点对于网络上的数据信息进行存储并处理。软件意义的服务器也要区分Web服务器和应用程序服务器，Web服务器常用的软件就有IIS服务器和Apache，通过Internet的连接处理Web浏览器提交的请求。应用程序服务器常见的软件有Java服务器，用于.NET程序开发的.NET服务器以及PHP服务器等。

对浏览器和服务器进行了简要说明，也就明白其工作原理了，用户先要在客户端安装浏览器，服务器上需要安装数据库，比如MySQL或者SQL Server等数据库都可以，浏览器与数据库的交互主要就是通过Web Server进行实现。

2.3 MySQL数据库介绍

开发的程序面向用户的只是程序的功能界面，让用户操作程序界面的各个功能，那么很多人就会问，用户使用程序功能生成的数据信息放在哪里的？这个就需要涉及到数据库的知识了，一般来说，程序开发通常就会对常用数据存储工具的特点进行分析比对，比如MySQL数据库的特点与优势，Access数据库的特点与优势，Sqlserver数据库的特点与优势等，最终看哪个数据库与需要开发的程序比较匹配，也符合程序功能运行需要的数据存储要求，比如，需要开发商业级别的程序，存储的数据对数据库要求较高，可以选用Oracle，如果只是比较简单的程序，对数据存储没有过多要求，可以选用微软旗下的Access，当开发程序要求数据库占用空间小，并能满足程序数据存储要求时，就可以考虑Oracle公司从瑞典MySQL AB公司在很早之前就收购过一个关系型数据库，它是现在的MySQL数据库。在数据库工具里面它是最受认可的其中一个应用软件。需要说明的信息就是，本程序的开发就运用到了此数据库。它将程序数据通过使用不同的数据表格进行保存，在增加了程序数据的存储速度的时候，也提高了数据库的灵活性。

为了更容易理解MySQL数据库，接下来就对其具备的主要特征进行描述。

（1）首选MySQL数据库也是为了节省开发资金，因为网络上对MySQL的源码都已进行了公开展示，开发者根据程序开发需要可以进行下载，并做一些改动就可以使用在程序中，可以推动开发者开发此程序的开发进度。

（2）SQL数据语言在MySQL里面也同样适用

（3）MySQL不仅可以支持多种编程语言，比如在校期间学到的C语言，Java语言，以及课后接触的PHP语言，C++语言等编程语言，它都能很好的支持，而且MySQL的安装与使用还不挑剔使用平台。

（4）MySQL可以支持具有千万条数据记录的数据库，电脑操作系统在进行首次安装或者是重装时，可以根据需要选择安装32位或64位操作系统，这两种操作系统对表文件的支持力度不一样，32位的操作系统最多可以存放4GB的表文件，64位操作系统最多可以存放8TB的表文件。

（5）MySQL数据库可以通过GPL协议进行个性化定制，需要开发者自己对数据库的源代码进行修改，以此开发出属于自己的MySQL。

2.4 Java语言介绍

程序开发语言有很多，但是截至目前，Java语言在IT领域内，仍然是最被认可，以及被广泛运用的编写语言之一，因此在选择此程序的编写语言上，果断选择这门编程语言进行程序开发。可以说经过了这么多年的发展，Java语言不仅在Web开发领域有了突出性贡献，而且在大数据开发领域以及Android开发领域都得到了广泛运用。由于Java语言拥有较强的扩展性能，并且表现出的稳定性能，让其成为大型后端系统开发语言首选，现如今，Java语言也成为了一种常用的互联网平台的解决方案。

作为一种源码在网络上开源的面向对象的程序开发Java语言，由它开发完成的程序是不可能直接运行在各大平台的，Java程序的运行，需要在操作平台上配置其运行的环境，包括数据库软件与Java程序开发软件等工具的安装与配置。在Win7，Win10或其它操作平台上配置Java程序运行环境，只要环境配置成功，Java程序都可以运行起来。

2.5 VUE框架介绍

Vue.js是当下很火的一个JavaScript MVVM库，它是以数据驱动和组件化的思想构建的。相比于Angular.js，Vue.js提供了更加简洁、更易于理解的API，使得我们能够快速地上手并使用Vue.js。

学习Vue.js时请先抛开手动操作DOM的思维，因为Vue.js是数据驱动的，你无需手动操作DOM。它通过一些特殊的HTML语法，将DOM和数据绑定起来。一旦你创建了绑定，DOM将和数据保持同步，每当变更了数据，DOM也会相应地更新。

ViewModel是Vue.js的核心，它是一个Vue实例。Vue实例是作用于某一个HTML元素上的，这个元素可以是HTML的body元素，也可以是指定了id的某个元素。

当创建了ViewModel后，双向绑定是如何达成的呢？

首先，我们将上图中的DOM Listeners和Data Bindings看作两个工具，它们是实现双向绑定的关键。

从View侧看，ViewModel中的DOM Listeners工具会帮我们监测页面上DOM元素的变化，如果有变化，则更改Model中的数据；

从Model侧看，当我们更新Model中的数据时，Data Bindings工具会帮我们更新页面中的DOM元素。

2.6 Tomcat 服务器介绍

对于开发Java程序的人员来讲，Tomcat服务器一般都是第一次接触，之所以不使用其他的诸如IIS服务器或者Apache服务器，是因为IIS对微软的开发语言比较友好，而Apache服务器对静态的HTML有很好的优势，只有Tomcat服务器属于小巧玲珑形，比较适合Java开发时使用。Tomcat对于Java项目用到的Servlet和HTML技术可以很好的匹配。再说，Tomcat是开源的，开源免费就是王道，能够很好的支持Javaweb项目，如果没有太多的要求的话，Tomcat就是首选。Tomcat跟随Java的成长一起发展，目前有很多版本，Tomcat对JRE环境也有对应的版本支持需求。

一般情况下，Tomcat服务器是Javaweb程序开发首选，tomcat服务器是Apache服务器的扩展，myeclise就集成的有Tomcat服务器，如果Tomcat服务器版本无法满足需求，也可以另外配置相应的Tomcat服务器，目前Tomcat版本已经发展到了tomcat9这个版本了。

2.7 layui介绍

layui 是一套开源的 Web UI 解决方案，采用自身经典的模块化规范，并遵循原生 HTML/CSS/JS 的开发方式，极易上手，拿来即用。其风格简约轻盈，而组件优雅丰盈，从源代码到使用方法的每一处细节都经过精心雕琢，非常适合网页界面的快速开发。layui 区别于那些基于 MVVM 底层的前端框架，却并非逆道而行，而是信奉返璞归真之道。准确地说，它更多是面向后端开发者，你无需涉足前端的各种工具，只需面对浏览器本身，让一切你所需要的元素与交互，从这里信手拈来。

layui 定义为「经典模块化」，并非是自吹她自身有多优秀，而是有意避开当下 JS 社区的主流方案，试图以最简单的方式去诠释高效！她的所谓经典，是在于对返璞归真的执念，她以当前浏览器普通认可的方式去组织模块！我们认为，这恰是符合当下国内绝大多数程序员从旧时代过渡到未来新标准的最佳指引。所以 layui 本身也并不是完全遵循于 AMD 时代，准确地说，她试图建立自己的模式。

2.8 Spring Boot框架介绍

Spring Boot是由Pivotal团队提供的全新框架，其设计目的是用来简化新Spring应用的初始搭建以及开发过程。该框架使用了特定的方式来进行配置，从而使开发人员不再需要定义样板化的配置。通过这种方式，Spring Boot致力于在蓬勃发展的快速应用开发领域(rapid application development)成为维修人员者。

SpringBoot可以与经典的Java开发工具一起使用或者作为命令行工具安装。无论如何，需要JavaSDK1.6或者更高版本，本项目用到的是JDK1.8版本。

3 系统分析

当用户确定开发一款程序时，是需要遵循下面的顺序进行工作，概括为：系统分析–>系统设计–>系统开发–>系统测试，无论这个过程是否有变更或者迭代，都是按照这样的顺序开展工作的。系统分析就是分析系统需要做什么的问题，主要目的就是确定系统的功能，这也为接下来的工作做了一个好的开端。

3.1 系统可行性分析

开发一款程序软件不仅需要时间，也需要人力，物力资源。而进行可行性分析这个环节就是解决用户这方面的疑问，看看程序在当前的条件下是否可以进行开发。

3.1.1 技术可行性分析

此程序选用的开发语言是Java，这种编程语言有着丰富的数据类型，在指令控制语句上也比较完善，更重要的就是对类与对象的大力支持，这些优点为程序开发者提供了技术保障，尤其是现在代码都逐渐模块化，有关系统功能开发的源码在网络上都公开展示了，所以让具备一定计算机开发基础的开发人员独立开发系统在技术上也逐渐容易。

3.1.2 经济可行性分析

开发此程序最关键的设备就是一台电脑，无论是学校计算机室配备的电脑，还是自己入学以来购置的笔记本，都是可以符合开发要求的设备，另外在网络上，学校本已完全覆盖了校园网，所以在设备以及网络上无须考虑经济问题。

3.1.3 运行可行性分析

随着电脑软件以及配套硬件的完善升级，当下的计算机环境是一片大好，尤其是计算机已经广泛普及到家家户户，所以计算机设备现在是随处可见，由于本次开发的程序占有的资源耗费较小，在一般的电脑或笔记本上都能轻松运转起来。

通过上面的可行性描述，可以从经济，技术，运行方面解决程序开发是否可行的问题。因此可以认为该程序软件是可以进行开发的。

3.2 系统性能分析

系统性能分析也是比较重要的内容，进行系统性能分析就是为了确保系统的功能要能够在生活中运行使用时，达到规定的指标，因此一个完整的系统软件，是需要进行系统的性能分析这个步骤的。本次进行性能分析主要从易用性指标，可扩展性指标，系统健壮性指标，系统安全性指标这几个方面进行分析。

3.2.1 易用性指标

本次程序软件的开发的目的就是让使用者可以通过使用该软件提高信息数据的管理效率，同时该程序软件也需要针对不同的操作用户设置对应的功能，因此，此程序的操作流程应该尽量与用户日常操作软件的行为习惯相贴合，另外，程序软件的设计与开发也应考虑非计算机专业用户的计算机操作水平，要让大部分使用者都可以轻松操作程序提供的各个功能。

3.2.2 可扩展性指标

当前需要开发的程序软件是根据当下的用户需求进行设计开发的，但是随着时间的推移，社会大环境的改变，开发出的程序也是需要与时俱进的，需要根据用户不断变换的需求进行相应的功能内容的扩展，需要注意的就是，当对成型的程序进行功能模块新增时，仍然需要保证程序原有架构以及功能不能受到影响，新增的功能模块在系统中也能够运行正常，该指标达标也就可以保证此程序是可以在满足信息管理要求下，从容应对市场环境的变化。

3.2.3 健壮性指标

程序软件的开发就是为了投入使用时，可以一直稳定的处理各种数据信息，程序软件一旦不稳定，也会给使用者带来干扰。因此从性能分析的角度，就要要求程序软件在应对使用者的误操作，或者是使用者因为各种原因，填写有误的数据等情况时，程序要一直保持稳定，并能够正常让使用者进行使用。当程序的某个功能模块出现异常时，程序的其它功能模块也要能够确保正常使用。程序的健壮性指标达标可以让使用者产生良好的用户体验。

3.2.4 安全性指标

程序软件的安全问题是首要问题，毕竟程序对应数据库里面存放的数据信息是庞大的，里面也包括了许多重要的个人信息，这就对程序要具备一个完善的安全机制提出了要求。因此程序必须要设置登录功能用以进行用户身份的检查，以及身份和权限的匹配，通过对不同用户身份进行功能约束，绝不容忍用户越权操作程序。另外，也需要时刻防范计算机病毒，还有黑客，通过采取针对性的办法进行安全应对，确保程序时刻处于安全的环境，让使用者放心使用。

3.3 系统流程分析

3.3.1 操作流程分析

程序上交给用户进行使用时，需要提供程序的操作流程图（如图3.1所示），这样便于用户容易理解程序的具体工作步骤，现如今程序的操作流程都有一个大致的标准，即先通过登录页面提交登录数据，通过程序验证正确之后，用户才能在程序功能操作区页面操作对应的功能。

图3.1 程序操作流程图

3.3.2 登录流程分析

在这个部分，需要对程序的登录功能模块的运行流程（如图3.2所示），进行单独说明。程序设置登录模块也是为了安全起见，让用户使用放心，登录模块主要就是让用户提交登录信息，程序进行数据验证，验证通过的用户才能够成功登录程序。

图3.2 程序登录流程图

3.3.3 信息添加流程分析

程序的添加功能就是提供给操作者录入信息的功能，不管是涉及到用户信息添加，还是其它功能模块涉及到的信息添加，程序的信息添加流程（如图3.3所示）都是一致的。程序都是先对操作者录入的数据进行判定，这个判定规则是一段提前编写完成的程序代码，当程序判定数据符合要求时，才会把操作者录入的数据登记在数据表里面，比如添加的用户信息，就会把新添加的用户信息写入用户信息的数据表文件里面。

图3.3 信息添加流程图

3.3.4 信息删除流程分析

当从程序里面删除某种无效数据时，遵循程序的信息删除流程（如图3.4所示），先要选中操作者需要删除的数据，程序为了预防操作者误删信息，也会进行提示，当操作者真正确定要删选中的信息时，该信息就会从数据库中被永久删除。

图3.4 信息删除流程图

4 系统设计

电商应用系统的设计方案比如功能框架的设计，比如数据库的设计的好坏也就决定了该系统在开发层面是否高效，以及在系统维护层面是否容易维护和升级，因为在系统实现阶段是需要考虑用户的所有需求，要是在设计阶段没有经过全方位考虑，那么系统实现的部分也就无从下手，所以系统设计部分也是至关重要的一个环节，只有根据用户需求进行细致全面的考虑，才有希望开发出功能健全稳定的程序软件。

4.1 系统设计的原则

在系统设计过程中，也需要遵循相应的设计原则，这些设计原则可以帮助设计者在短时间内设计出符合设计规范的设计方案。设计原则主要有可靠性，安全性，可定制化，可扩展性，可维护性，可升级性以及客户体验等原则。下面就对这些原则进行简要阐述。

可靠性：一个软件是否可靠决定了其是否被用户使用，设计不可靠的软件，用户很容易就遗弃；

安全性：程序软件承担了信息的保存与管理等事务，安全性不足的软件会导致使用者承担巨大的损失；所以系统安全也是需要考虑进入的；

可定制化：市场环境从来都不是一直固定不变，面对客户群体的改变，以及使用环境的改变，市场需求的改变等因素，程序软件也要易于调整以适应各种变化；

可扩展性：程序软件在运行使用期间，也需要及时引进当下的新技术来进行系统优化，主要就是在系统功能层面，系统性能层面上进行相应的扩展，只有这样才能让系统在实际生活中继续占有市场；

可维护性：程序软件的维护需要一定量的资金，不管是排除现有程序错误，还是变更软件的现有需求，都需要在软件技术上投入一定资金，所以易于维护的软件程序就可以降低技术层面的资金消耗；

可升级性：程序软件的投入使用，会面临用户数量增多的情况，用户对软件的使用率也会提升，所以系统面临这种情况，仍然需要通过升级保持性能的合理，这样才能够适应市场；

客户体验：设计出来的程序软件在界面上不能够太复杂，要遵循界面设计的原理设计出简单，方便操作的功能操作界面，让用户易于接受软件，并乐于使用软件提供的功能。

4.2 系统概要设计

本次拟开发的系统为了节约开发成本，也为了后期在维护和升级上的便利性，打算通过浏览器来实现系统功能界面的展示，让程序软件的主要事务集中在后台的服务器端处理，前端部分只用处理少量的事务逻辑。下面使用一张图（如图4.1所示）来说明程序的工作原理。

图4.1 程序工作的原理图

4.3 系统功能结构设计

在分析并得出使用者对程序的功能要求时，就可以进行程序设计了。如图4.2展示的就是管理员功能结构图，管理员功能有个人中心，管理员管理，公告类型管理，商品类型管理，论坛管理，积分记录管理，公告信息管理，商品信息管理，商品评价管理，商品收藏管理，商品订单管理，用户管理，轮播图管理。用户可以注册登录，查看和购买商品，对商品进行评价和收藏，在论坛发消息等操作。

图4.2 管理员功能结构图

4.4 数据库设计

程序功能操作不管是添加，修改，还是删除等功能产生的数据都是经由数据库进行数据保存和更新的，所以一个数据库设计的好坏也是程序是否好坏的判定标准，因为程序的成功，有一半的功劳都是靠数据库的优秀设计。数据库一旦设计得良好是可以减轻开发人员的开发负担的。

4.4.1 数据库E-R图设计

这个部分的设计需要使用到E-R图绘制工具，常用的工具就是Visio工具来绘制E-R模型图，这款工具不仅可以快速创建需要的E-R模型图，而且该工具提供的操作界面很简单，可以短时间内修改绘图界面的图形或者是文字的属性。在绘制E-R模型图时，要分清楚各个图形代表的含义，以免绘制出错，E-R模型图由长方形（实体），椭圆形（属性），菱形（关系）这三部分图形符号组成，绘制期间要区分开来，用准确的图形符号代表相应的数据元素。

1. 管理员实体中的属性有姓名，密码等信息。以此绘制的实体属性图见图4.4。

图4.4 管理员实体属性图

（2）用户实体中的属性有账户，密码，姓名等信息。以此绘制的实体属性图见图4.5。

图4.5 车主实体属性图

（3）公告实体中的属性有编号，标题，内容等。以此绘制的实体属性图见图4.6。

图4.6 公告实体属性图

1. 商品实体中的属性有商品名称，价格等信息。以此绘制的实体属性图见图4.7。

图4.7 公告类型实体属性图

1. 各个实体之间的联系用下图的E-R图表示。绘制的系统E-R图见图4.8。

图4.8 系统E-R图

4.4.2 数据库表结构设计

数据库系统一旦选定之后，需要根据程序要求在数据库中建立数据库文件，并在已经完成创建的数据库文件里面，为程序运行中产生的数据建立对应的数据表格，数据表结构设计就是对创建的数据表格进行字段设计，字段长度设计，字段类型设计等，当数据表格合理设计完成之后，才能正常存储相关程序运行产生的数据信息。

1公告信息表

序号	列名	数据类型	说明	允许空
1	Id	Int	id	否
2	news_name	String	公告标题	是
3	news_types	Integer	公告类型	是
4	news_photo	String	公告图片	是
5	insert_time	Date	添加时间	是
6	news_content	String	公告详情	是
7	create_time	Date	创建时间	是

2商品评价表

序号	列名	数据类型	说明	允许空
1	Id	Int	id	否
2	shangpin_id	Integer	商品	是
3	yonghu_id	Integer	用户	是
4	shangpin_commentback_text	String	评价内容	是
5	insert_time	Date	评价时间	是
6	reply_text	String	回复内容	是
7	update_time	Date	回复时间	是
8	create_time	Date	创建时间	是

3收货地址表

序号	列名	数据类型	说明	允许空
1	Id	Int	id	否
2	yonghu_id	Integer	创建用户	是
3	address_name	String	收货人	是
4	address_phone	String	电话	是
5	address_dizhi	String	地址	是
6	isdefault_types	Integer	是否默认地址	是
7	insert_time	Date	添加时间	是
8	update_time	Date	修改时间	是
9	create_time	Date	创建时间	是

4商品表

序号	列名	数据类型	说明	允许空
1	Id	Int	id	否
2	shangpin_uuid_number	String	商品编号	是
3	shangpin_name	String	商品名称	是
4	shangpin_photo	String	商品照片	是
5	shangpin_types	Integer	商品类型	是
6	shangpin_kucun_number	Integer	商品库存	是
7	shangpin_price	Integer	购买获得积分	是
8	shangpin_old_money	BigDecimal	商品原价	是
9	shangpin_new_money	BigDecimal	现价/积分	是
10	shangpin_clicknum	Integer	点击次数	是
11	shangpin_content	String	商品介绍	是
12	shangxia_types	Integer	是否上架	是
13	shangpin_delete	Integer	逻辑删除	是
14	create_time	Date	创建时间	是

5商品收藏表

序号	列名	数据类型	说明	允许空
1	Id	Int	id	否
2	shangpin_id	Integer	商品	是
3	yonghu_id	Integer	用户	是
4	shangpin_collection_types	Integer	类型	是
5	insert_time	Date	收藏时间	是
6	create_time	Date	创建时间	是

6购物车表

序号	列名	数据类型	说明	允许空
1	Id	Int	id	否
2	yonghu_id	Integer	所属用户	是
3	shangpin_id	Integer	商品	是
4	buy_number	Integer	购买数量	是
5	create_time	Date	添加时间	是
6	update_time	Date	更新时间	是
7	insert_time	Date	创建时间	是

7用户表

序号	列名	数据类型	说明	允许空
1	Id	Int	id	否
2	username	String	用户名	是
3	password	String	密码	是
4	role	String	角色	是
5	addtime	Date	新增时间	是

8token表

序号	列名	数据类型	说明	允许空
1	Id	Int	id	否
2	userid	Integer	用户id	是
3	username	String	用户名	是
4	tablename	String	表名	是
5	role	String	角色	是
6	token	String	密码	是
7	addtime	Date	新增时间	是
8	expiratedtime	Date	过期时间	是

9论坛表

序号	列名	数据类型	说明	允许空
1	Id	Int	id	否
2	forum_name	String	帖子标题	是
3	yonghu_id	Integer	用户	是
4	users_id	Integer	管理员	是
5	forum_content	String	发布内容	是
6	super_ids	Integer	父id	是
7	forum_state_types	Integer	帖子状态	是
8	insert_time	Date	发帖时间	是
9	update_time	Date	修改时间	是
10	create_time	Date	创建时间	是

10字典表

序号	列名	数据类型	说明	允许空
1	Id	Int	id	否
2	dic_code	String	字段	是
3	dic_name	String	字段名	是
4	code_index	Integer	编码	是
5	index_name	String	编码名字	是
6	super_id	Integer	父字段id	是
7	beizhu	String	备注	是
8	create_time	Date	创建时间	是

11用户表

序号	列名	数据类型	说明	允许空
1	Id	Int	id	否
2	username	String	账户	是
3	password	String	密码	是
4	yonghu_name	String	用户姓名	是
5	yonghu_phone	String	用户手机号	是
6	yonghu_id_number	String	用户身份证号	是
7	yonghu_photo	String	用户头像	是
8	sex_types	Integer	性别	是
9	yonghu_email	String	电子邮箱	是
10	new_money	BigDecimal	余额	是
11	yonghu_sum_jifen	BigDecimal	总积分	是
12	yonghu_new_jifen	BigDecimal	现积分	是
13	huiyuandengji_types	Integer	会员等级	是
14	create_time	Date	创建时间	是

12商品订单表

序号	列名	数据类型	说明	允许空
1	Id	Int	id	否
2	shangpin_order_uuid_number	String	订单号	是
3	address_id	Integer	收货地址	是
4	shangpin_id	Integer	商品	是
5	yonghu_id	Integer	用户	是
6	buy_number	Integer	购买数量	是
7	shangpin_order_true_price	BigDecimal	实付价格	是
8	shangpin_order_courier_name	String	快递公司	是
9	shangpin_order_courier_number	String	订单快递单号	是
10	shangpin_order_types	Integer	订单类型	是
11	shangpin_order_payment_types	Integer	支付类型	是
12	insert_time	Date	订单创建时间	是
13	create_time	Date	创建时间	是

13配置文件表

序号	列名	数据类型	说明	允许空
1	Id	Int	id	否
2	name	String	配置参数名称	是
3	value	String	配置参数值	是

14积分记录表

序号	列名	数据类型	说明	允许空
1	Id	Int	id	否
2	yonghu_id	Integer	用户姓名	是
3	jifenjilu_name	String	原因	是
4	jifenjilu_number	BigDecimal	积分数量	是
5	jifen_types	Integer	类型	是
6	insert_time	Date	插入时间	是
7	create_time	Date	创建时间	是

5 系统实现

系统实现部分就是将系统分析，系统设计部分的内容通过编码进行功能实现，以一个实际应用系统的形式展示系统分析与系统设计的结果。前面提到的系统分析，系统设计最主要还是进行功能，系统操作逻辑的设计，也包括了存储数据的数据库方面的设计等内容，系统实现就是一个最终的实施阶段，将前面的设计成果进行物理转化，最终出具可以运用于实际的软件系统。

5.1 管理员功能介绍

5.1.1 管理员管理

如图5.1显示的就是管理员管理页面，管理员可以对管理员信息进行添加，修改，删除，查询操作。

图5.1 管理员管理页面

5.1.2 公告类型管理

如图5.2显示的就是公告类型管理页面，管理员可以对公告类型信息进行添加，修改，删除，查询操作。

图5.2 公告类型管理页面

5.1.3 论坛管理

如图5.3显示的就是论坛管理页面，管理员可以对论坛信息进行添加，修改，删除，查询操作。

图5.3 论坛管理页面

5.1.4 商品类型管理

如图5.4显示的就是商品类型管理页面，管理员可以对商品类型信息进行添加，修改，删除，查询操作。

图5.4 商品类型管理页面

5.1.5 商品信息管理

如图5.5显示的就是商品信息页面，管理员可以对商品信息进行添加，修改，删除，查询操作。

图5.5 商品信息管理页面

5.1.6 轮播图管理

如图5.6显示的就是轮播图管理页面，管理员可以对轮播图信息进行添加，修改，删除，查询操作。

图5.6 轮播图管理页面

5.1.7 公告信息管理

如图5.7显示的就是公告信息管理页面，管理员可以对公告信息进行添加，修改，删除，查询操作。

图5.7 公告信息管理页面

5.1.8 用户信息管理

如图5.8显示的就是用户信息页面，管理员可以对用户信息进行添加，修改，删除，查询操作。

图5.8 用户信息管理页面

5.2 用户功能介绍

5.2.1 个人中心

如图5.9显示的就是个人中心页面，用户注册登录后点击个人中心可以修改个人资料和查看自己的收藏信息。

图5.9 个人中心页面

5.2.2 公告信息

如图5.10显示的就是公告信息页面，用户可以在公告信息界面查看公告信息。

图5.10 公告信息页面

5.2.3 商品信息

如图5.11显示的就是商品信息页面，用户点击商品信息可以查看商品信息，可以添加到购物车和立即购买。

图5.11 商品信息页面

5.2.4 购物车

如图5.12显示的就是购物车页面，用户登录后可以点击购物车，可以看到已经加入购物车的商品，可以对这些商品进行删除和修改数量以及点击购买操作。

图5.12 购物车页面

5.2.5 我的订单

如图5.13显示的就是我的订单页面，用户登录后可以点击我的订单，可以看到自己的订单状态。

图5.13 我的订单页面

6 系统测试

程序软件一旦被开发完成之后，在真正投入日常生活中进行运行使用之前，是必须要经历测试这一个重要的操作环节，因为开发期间注重的是每个单独功能模块的开发，尽管每次开发完成一个单独功能模块时，会通过单元测试进行检验，检验合格才会让程序员继续开发下一个子功能模块，以此类推，当程序员完成所有的系统子功能模块的开发时，这个时候就需要引进系统测试，系统测试就是把所有的子功能模块集成到一起，构建成整个系统，在指定的运行环境下进行运行，主要就是测试系统的所有功能模块在一起是否良好运行，一旦程序软件通过了系统测试这一环节，就意味着它可以进行最终的验收测试了，这个测试步骤的操作用户是程序面向的客户或者是最终用户了。

6.1 系统测试的特点

系统测试也是为了保证系统正式上线后，可以稳定正常运行，给使用者带来便利。系统测试也有其对应的特点：

（1）系统测试它包括了端到端的完整测试；

（2）系统测试也对程序软件的架构方面，程序软件的业务需求等方面进行了测试；

（3）系统测试一旦采用正确的方法进行，这将减少程序正式上线之后产生的各种错误；

系统测试一般都是在跟生产环境相似的环境当中运行，程序的功能比如添加功能，删除功能，修改功能等都会使用同样的数据在新系统和现有系统中进行比较，这样做让用户对新系统中的添加，修改，删除等功能能够更好地理解，也能提升用户对新系统的满意度。

6.2 系统测试方法

程序软件进入到系统测试这一个环节时，也需要根据测试的方法进行规范化测试操作，测试方法以及使用顺序分别是：首先是单元测试，接着是集成测试和系统测试，最后才是验收测试，下面将描述系统测试方法。

单元测试：这个部分需要涉及到程序的代码方面的知识，这个操作环节是程序的开发者进行的，当程序开发者通过代码编写程序的子功能模块时，就会进行单元级别的测试，通常这个环节的测试也会被称作是白盒测试。

集成测试：这个步骤的前提是程序的所有功能模块都已完成开发，这个时候需要把程序所有的子功能模块集成到一起，形成一个完整的系统，此测试的主要目的就是检查这些功能模块集成在一起时的兼容性，也就是检测它们是否按照预期正常运行。

系统测试：当程序测试进入到这个环节时，就意味着程序测试工作已经进行到一半了，这个部分的测试也有另外一个名字，称作是黑盒测试，主要用于测试系统的功能是否按照预期进行运行。

验收测试：开发的程序已经通过了前面的单元测试，集成测试，以及系统测试环节时，就需要进行验收了，这个环节的操作用户就是程序面临的最终用户或者是客户。测试主要目的就是验证开发完成的程序是不是能够符合用户对其的期望，以及程序的所有功能是否符合用户的真正需求。

6.3 系统功能测试

6.3.1 登录功能测试

要保障程序安全，首先就要从入门门槛抓起，所以程序的登录模块也是很重要的程序入门门槛，务必要保证此功能可以安全运行使用。此次对程序登录模块测试选择管理员角色进行测试（如表6.1所示）。

表6.1 登录功能测试数据表

登录账号	登录密码	操作人	最终结果
abc	abc	管理员	登录进入程序
123	abc	管理员	弹出错误登录提示
abc	123	管理员	弹出错误登录提示

下面就选取登录账号正确填写，密码填写有误的测试结果进行展示（如图6.1所示）。

图6.1 登录报错页面

6.3.2 修改密码功能测试

一般来说，程序都会设置密码修改功能，目的是为了让操作者在固定时间内更新原密码，这也是对数据安全性提出的一个解决方案。在进行密码修改功能的测试时（如表6.2所示），也需要检验此功能能否正常使用。

表6.2 修改密码功能测试数据表

原来的密码	需要设置的新密码	密码修改结果
abc	cde	成功
123	cde	失败
abc		失败

下面选取原来的密码错误填写，新的密码正常设置时，程序的反馈结果进行展示（如图6.2所示）。

图6.2 原密码有误提示页面

6.4 测试结果分析

程序经过了上述的测试环节，可以得出的测试结论有：

第一点，可以确定开发出来的电商应用系统是符合同类型系统的要求；

第二点，用户要求电商应用系统需要具备的功能都已开发完成并能够正常使用；

第三点，电商应用系统界面简洁美观，操作流程清晰明了；

第四点，电商应用系统的安全性，以及运行性能符合开发要求。

至此，电商应用系统可以确保所有功能能够按照预期目标进行运行，可以正式投入生活中运行使用！

结 论

通过对电商应用系统的开发，让我深刻明白开发一个程序软件需要经历的流程，当确定要开发一个电商应用系统的程序时，我在开发期间，对其功能进行合理的需求分析，然后才是程序软件的功能的框架设计，数据库的实体与数据表设计，程序软件的功能详细界面实现，以及程序的功能测试等进行全方位的细致考虑，虽然在此过程中，各个环节都遇到了大大小小的困难，但是通过对这些问题进行反复的分析，深入的思考，借助各种相关文献资料提供的方法与解决思路成功解决面临的各个问题，最后成功的让我开发的电商应用系统得以正常运行。

电商应用系统在功能上面是基本可以满足用户对系统的操作，但是这个程序软件也有许多方面是不足的，因此，在下一个时间阶段，有几点需要改进的地方需要提出来，它们分别是：

（1）操作页面可以满足用户简易操作的要求，但是在页面多样化设计层面上需要把一些比较丰富的设计结构考虑进来。

（2）程序软件的总体安全性能需要优化，例如程序的退出安全性，以及程序的并发性等问题都需要进行安全性升级，让开发的电商应用系统与现实中的相关网站更贴合。

（3）需要对程序的数据结构方面，程序的代码方面等进行优化，让运行起来的程序可以保持稳定运行，也让程序能够保证短时间内处理相关事务，节省处理事务的时间，提高事务处理的效率，同时对服务器上资源占用的比例进行降低。

电商应用系统的开发一方面是对自身专业知识技能进行最终考核，另一方面也是让自己学会独立解决程序开发过程中所遇到的问题，掌握将理论知识运用于程序开发实践的方法。电商应用系统的开发最终目标就是让系统更具人性化，同时在逻辑设计上，让系统能够更加的严谨。

致 谢

大学期间的学习时光对于我来说是美好而短暂的，在这期间我也接触了许多可爱的大学同学们，以及兢兢业业教学的老师们，在我的毕业论文即将完成之际，我想对那些曾经给予我支持，帮助，还有鼓励的同学和老师以及家人们表达我内心的无比感激之情。

首先，感谢给予我论文指导的指导老师，从开题报告，任务书，论文大纲的编写与系统的功能框架设计，到最终的毕业论文，都是指导老师全程参与的悉心指导和帮忙，才能够让我的毕业论文可以符合学院要求编写完成。我的指导老师一丝不苟的教学精神以及在学术上的严谨作风，这些优点是值得我不断去努力学习的。

其次，感谢大学同学的陪伴与帮助，在我独立编写毕业论文期间，大学同学的鼓励与耐心的帮助使得我少走很多弯路，节省毕业论文的编写时间，也让我有更多精力去完善我开发的系统。

最后，感谢我最亲密的家人带给我的包容和关爱，我能够安心学习也是来源于家人们对我的无微不至的照顾，这样我才可以顺顺利利完成我的大学学业。

毕业倒计时之际，希望在今后的工作中，在今后的生活中，我会一直谨记老师们带给我的孜孜不倦的教诲，并通过不懈的努力和追求来改变自己，以此报答那些曾支持过以及帮助过我的人！

参考文献

[1]任利军.电商场管理系统的开发与设计[J].计算机光盘软件与应用,2017,16(04):226-227.

[2]郑均辉,郭俊晓.基于Asp.Net的电商场管理系统设计与实现[J].科学技术创新,2018(35):86-87.

[3]宋丽娜.基于HTML的Web开发中文乱码问题的研究与解决[J].电子技术,2015,42(11):5-7.

[4]汪君宇.基于HTML的Web应用软件开发技术分析[J].科技创新与应用,2018(16):158-160.

[5]赵钢.HTML Servlet+EJB的Web模式应用研究[J].电子设计工程,2016,21(13):47-49.

[6]肖英.解决HTML/Servlet开发中的中文乱码问题[J].科技传播,2017,(1)11-25.

[7]朱钧.基于角色的HTML通用权限系统设计与实现[D].山东大学,2014.

[8]康牧.HTML动态网站开发实用教程[M].清华大学出版社,2014.

[9]王建国.数据库设计在网站开发中的应用[J].山东农业工程学院学报,2017,34(04):158-159+164.

[10]张知青.基于关系数据库的查询方法及优化技术分析[J].煤炭技术,2015,31(05):218-220.

[11]陈志誉.Java工具及其调度方法研究[D].华南理工大学,2018.

[12]张孝祥,徐明华.JAVA基础与案例开发详解[M].清华大学出版社,2014.

[13]刘亚宾.精通Eclipse–JAVA技术大系[M].电子工业出版社,2015.

[14]曾志明.网站开发技术的比较研究[J].电脑知识与技术,2015,6(05):1075-1078.

[15]卫红春.信息系统分析与设计[M].北京：清华大学出版社,2014.

[16]于万波.网站开发与应用案例教程[M].清华大学出版社，2013.

[17]黎连业,王华,李淑春.软件测试与测试技术[M].清华大学出版社，2014.

[18]Xin-hua YOU. Brief Discuss the Application of Object-oriented in Java Language Programming Course[A]. Advanced Science and Industry Research Center.Proceedings of 2018 3rd International Conference on Automation, Mechanical and Electrical Engineering (AMEE 2018)[C].Advanced Science and Industry Research Center:Science and Engineering Research Center,2018:5.

[19]Menglin Liu. Design and Research of Batch Query System Based on Java[A]. Research Institute of Management Science and Industrial Engineering.Proceedings of 2018 4th World Conference on Control, Electronics and Computer Engineering (WCCECE 2018)[C].Research Institute of Management Science and Industrial Engineering:计算机科学与电子技术国际学会(Computer Science and Electronic Technology International Society),2018:5.