【基于BS架构的万物购商城系统的设计与实现14000字（论文）】

基于BS架构的万物购商城系统的设计与实现近些年，随着移动互联网的快速发展、智能手机的普及，人们从以往传统现实商店购物方式逐渐转变为足不出户的线上购物。越来越受到消费者喜爱的线上购物方式，促使商家去建立属于自己的网上商店，而万物购商城系统融合了各种商家商品，供消费者自由选购。万物购商城系统采用B/S（Browser/Server）架构、Java语言进行编写、SSM（Spring+SpringMVC+MyBatis）整合框架、MySQL数据库存储数据，实现用户管理、商品管理、线上支付等功能，简洁方便，可供各种年龄段消费人群使用。万物购商城系统进行实现与设计时，充分考虑到消费人群线上购物习惯，整合了热门购物网站特点，具有更好的灵活性与适应性。目录289761绪论 1258241.1课题研究背景 1204531.2国内外研究现状 1172881.3研究内容和意义 1301391.4论文组织结构 2302691.5本章小结 2133372相关技术介绍 3282352.1B/S架构 337352.2Node.js技术 36372.3SSM框架 392422.4Ajax技术 351902.5JQuery技术 476532.6本章小结 4100033需求分析 5153893.1可行性分析 5171983.1.1技术可行性 550183.1.2经济可行性 522833.1.3操作可行性 5284003.2功能性需求 5158473.3非功能性需求 654023.4本章小结 6116904系统设计 726084.1平台开发环境 7163624.1.1IntelliJIDEA平台开发环境 7171614.1.2MySQL数据库搭建 7312884.2系统功能概要设计 7191324.3系统功能详细设计 840744.3.1用户注册登录功能 944454.3.2商品管理功能 10313564.3.3购物车管理功能 1154814.3.4订单管理功能 1296554.3.5线上支付功能 14260404.4系统数据库设计 14221184.4.1数据库E-R关系图 15102324.4.2数据库表设计 16264664.5本章小结 18286625系统设计与实现 1961955.1用户功能实现 19220855.1.1用户登录注册功能 19168025.1.2购物车管理功能 21289295.1.3订单管理功能 22102205.1.4线上支付功能 23101765.2管理员功能实现 2480545.2.1管理员登录功能 24255815.2.2商品管理功能 2482405.2.3订单管理功能 25269135.3本章小结 2612926系统测试 27156816.1系统测试目的 27246286.2系统测试环境部署 2716246.3系统功能测试用例 27209626.4系统测试结果 28134586.5本章小结 2832520结束语 2916579参考文献 3028203致谢 31PAGE45绪论网络时代发展迅速，极大的提高了人们生活水平，同时给与人们生活方式的改善。人们以往去现实实体店排队购物，现在只需要智能手机或者电脑就能在网上进行购物。这种新型购物方式，为人们的生活提供了便捷、减少了传统购物方式造成的排队拥挤、缩短了商家与消费者之间的距离、更好地为消费人群提供服务。课题研究背景随着5G网络的建立，人们生活质量突飞猛进。各种无处不在的智能产品，开始改变人们的传统生活方式。各大公司开始发展自己的在线销售系统。互联网购物正在成为主流的购物方式，人们可以通过手机或电脑在网上购买商品。而传统商店也不再能够满足消费者的需求。线下的商店受限于天气条件、商店与消费者的距离。但是网上购物可以解决这些问题。如今，许多商店都不在局限于传统实体店模式，而是创建线上商店。在信息平台上发布产品信息，以吸引客户和提高网上产品的流行性和知名度。因此，建立小型电子交易系统至关重要。通过创建这样一个系统，可以通过提供分销渠道来解决产品流通问题，让消费者和商户的生活更轻松。国内外研究现状国内由于庞大消费者群体所产生的购物需求，单靠传统购物方式是满足不了的，而且快节奏的生活方式不允许我们将时间浪费在排队购物上，所以电子商务在国内发展是必然的。查阅资料得知，国内政策对电子商务采取大力支持，鼓励并希望大批传统产业进行转型升级。淘宝、京东等大型购物网站的建立，使得电子商务的发展进入到全新阶段。资料表明国内电子商务在各方面都走向成熟，但还存在法律法规不健全、支付环境未完全完善、专业型人才缺乏等问题。大型电子商务系统的成立，使得大型企业在网络时代取得优先成绩，而许许多多中小型企业的建立与发展，则为轻量型电子商务系统提供了发展和进步的空间。国外电子商务起步早、发展较快，因没有庞大的消费者群体，近些年发展速度和份额并不理想，产生的购物需求远低于中国，网络购物的发展基本达到饱和期，如亚马逊、e-Bay等，但随着网络时代的进步，促使各行业都在向电子商务方面进行发展。研究内容和意义万物购系统主要是解决了传统购物方式满足不了现代消费者的购物需求问题，采取线上购物的方式，让商品进行更好流通。系统采用MySQL数据库进行存取数据，底层框架采用B/S架构，SSM框架进行搭建，前端使用了JQuery、Node.js、Ajax等技术，服务器采用Tomcat服务器，实现了网上购物。系统分为由DAO(DataAccessObject)层控制的底层数据库、服务层进行的业务功能、控制层控制的业务功能向显示层传递、显示层向用户展示图像化的互动功能，总共四层。用户使用该系统时，通过登录注册成为用户，登录进入系统，用户可以浏览商品、检索商品、将喜爱的商品加入购物车、进行线上扫码支付购买。后台管理员通过后台登录页面进入到管理页面，对商品进行增加、下架、修改其详细描述，对商品品类进行修改、添加、将用户已经支付商品进行发货处理。整个系统的操作流程及功能模块与当前主流电商系统保持一致。万物购系统主要是对当前主流电商系统架构的设计和分析，将主流电商架构进行拆解分析、对其进行需求分析，在学习的过程中，逐渐去熟悉了解并掌握系统架构、熟练使用软件工程方法进行系统设计，不断的去解决开发系统中遇到的问题。另外此系统的研究与设计可以更好地节省消费者传统购物所花费的时间，同时为商品的流通增加了更多的渠道、大大提高商品的流通性，销售业的发展借此也能提高。与传统购物方式相比，系统本身极大改善了消费者的购物体验，同时绿色环保。论文组织结构第一章绪论，简述课题国内外研究现状、课题研究内容和意义，对课题概括性讲解。第二章相关技术介绍，系统开发相关技术，结合系统功能进行简述。第三章需求分析，结合社会需求，分析系统开发需求。第四章系统设计，从系统需求中分析系统功能，介绍设计步骤。第五章系统设计与实现，在系统设计基础上，详述系统功能详细设计与实现。第六章系统测试，介绍系统完成后测试结果。本章小结本章从课题研究背景出发，简述当代社会购物方式转变以及网上购物出现原因，结合国内外研究现状、研究内容和意义，介绍购物系统开发可行性和价值，将课题主要内容和研究意义进行简要概括。相关技术介绍系统的开发有着相对应的技术提供支持，了解并熟练使用技术才是开发完善系统的前提，下面结合系统功能，简述相关技术特点。B/S架构B/S架构是指浏览器和服务器，简称B/S，是Web兴起之后的一种流行的网络结构模式REF_Ref19140\r\h[1]。B/S架构成本低，维护方便、分布性强、开发方便，系统运行时向浏览器发送请求，服务器响应处理，将结果返回浏览器，浏览器向用户呈现结果REF_Ref19212\r\h[2]。系统采用B/S架构进行浏览器请求，服务器响应，这样用户不需要下载客户端，就能与商户进行交流。Node.js技术Node.js作为一个新兴的前端技术框架后台语言，它为基于ChromeV8引擎的JavaScript执行平台的快速构建网络服务及相关应用做出很大贡献，它让JavaScript成为与PHP、Python等服务器端语言平起平坐的脚本语言REF_Ref24289\r\h[3]。由于V8引擎性能优越，Node.js由此集合了许多体量轻效率高的技术，在计算机工程师中非常受欢迎，常作为开发首选技术之一REF_Ref13839\r\h[4]。系统采用Node.js技术在服务器上运行前端JavaScript语言，主要为数据库和文件资源提供相对应的接口。SSM框架SSM（Spring+SpringMVC+MyBatis）作为数据源较为简单的Web框架。Spring开发框架减少了系统项目开发复杂性，其中两种设计模式的建立，AOP（AspectOrientedProgramming面向切面编程）将与业务无关的功能逻辑代码进行封装，从而减少代码冗余量，IOC(InversionofControl反转控制)将对象间依赖关系全交于Spring控制，从而减少程序过度耦合REF_Ref17203\r\h[5]。SpringMVC轻量级框架，采用注解方式，将系统耦合性降低，采取“请求--响应”的方式，将java类变成处理请求的控制器。从而实现Web层业务解耦。MyBatis轻量级开源框架，一种持久层框架，内部封存JDBC（JavaDatabaseConnectivity），采取JPA（JavaPersistenceAPI）规范连接数据库，安装和配置都很简单，用dao层将业务逻辑代码和数据数据访问分开，通过构建一个个的Mapper将代码冗余度降低，将业务代码与SQL语句耦合度降低，用户操作数据库，对数据库进行封装的同时具有部分透明度，可以了解自己使用的数据库的程度REF_Ref17212\r\h[6]。系统采用SSM框架进行搭建底层结构，将项目进行分层拆解，每层有自己任务，方便出现错误及时查询和改正。Ajax技术Ajax是一种将网页开发变得更加快捷，附加创建交互性，动态性的网页开发技术。系统使用Ajax技术，可以做到在不刷新页面的情况下进行服务器数据的传输和读写REF_Ref1706\r\h[7]。Ajxa技术通过JavaScript向服务器提出请求并处理响应而不阻塞用户核心对象XMLHttpRequestREF_Ref6689\r\h[8]。Ajax独立于服务器，在请求服务器时所产生的信息量较小，而且在所有主流浏览器中都支持使用。系统前端页面在执行删除、修改等操作时采用Ajax技术，防止再次刷新页面需要重新提交表单等操作。JQuery技术JQuery技术是一个优秀的JavaScript框架，用更少的代码去做更多的事情，简单的来说JQuery就是一个JavaScript类库，属于轻量级JavaScript类库，它兼容大部分的主流浏览器，使用JQuery技术，用户能更加方便快速的处理HTML,documents,events，将网页动画效果实现变得简单，使得网站与Ajax交互更加方便REF_Ref9536\r\h[9]。有着强大的选择器，文档说明全面，事件处理机制的可靠，成熟的插件应用，完善的Ajax交互接口，受到许多前端开发技术人员的追捧。JQuery能够使用户的页面保持代码与页面内容分离，只需要定义id，就能实现客户端的快速响应，有效提高数据流转速度REF_Ref31676\r\h[10]。系统在前端主页面图片滑动使用了JQuery技术，方便了用户与前端交互，页面更简洁优美。本章小结本部分通过对系统相关技术方面阐述，结合相关技术在系统开发功能中使用过程和原因，将技术特点与实用性一一展示出来，为后面系统开发打好基础。系统相关技术介绍，阐明了技术成熟性和系统研究可执行性。需求分析在开发系统时，了解系统开发需求，对其进行分析，是完成系统开发第一步。对系统进行需求分析，可以极大的减少我们设计系统需要的时间、提高开发效率，将加快设计系统速度。进行需求分析时，一般会从可行性分析、功能需求、非功能需求三大方面对系统做全面调查分析，以保证系统的完整性。可行性分析可行性分析在系统开发前，能够尽可能减少开发过程中的风险，从而减少造成的损失。可行性分析不是单从系统一方面进行分析，而是从系统技术、经济、操作三方面进行详细分析，将开发过程中风险降至最低，避免不必要的经济损失。技术可行性本系统分为前台和后台。前台采用Node.js，Ajax动态网页开发等技术进行开发，后台使用SSM框架，免费开源的MySQL数据库提供数据存储，整体使用B/S架构。系统采用JDBC技术实现功能类与数据库连接，完成数据的增删改查；成熟的JQuery和Ajax技术实现前台页面动态化。硬件方面需要一台普通电脑即可，一般学校的电脑就能满足其开发条件。经济可行性在成本上，系统不需要购买服务器，使用免费的Tomcat服务器即可，自己本身就是学软件开发的，其他的软件早准备好，内网穿透使用的也是免费渠道。唯一支出是在系统开发过程中所产生的费用，系统本身节省了大量资源，完成之后，可以在系统上进行招租广告，也可供其他人借鉴学习，收益是远远大于消费。操作可行性本系统采用的是具有跨平台特性的Java语言，在大多数计算机上都可以安装，调试，运行。系统本身前端页面简洁，采用的是动态网页开发，操作起来会更加的快捷，有很好的操作可行性。功能性需求该系统访问主体对象分为管理员和用户。管理员主要操作商品信息、商品品类、订单状态，用户操作前台显示的商品对其进行搜索，添加购物车，支付购买等。用户管理功能包括管理用户、普通用户、各类用户信息的添加以及验证，保证用户安全登录，使用系统。商品管理功能普通用户按类搜索喜爱商品，将喜欢的商品加入购物车。商家对商品进行增删改查，方便商家分类管理。购物车管理功能消费者用户喜爱的商品能够加入其中，方便用户对不同商家，同类商品进行性价比比较（用户好评，销售订单数量等）后进行购买。订单管理功能商家能够进行订单的处理、操作，如新订单的提醒、订单状态的修改、线下发货等。线上支付功能对接支付宝接口，方便用户进行线上扫描二维码进行支付购买商品。非功能性需求简洁性该系统是面向各年龄段的消费者，网络时代的快速发展会导致一些老年人跟不上节奏，考虑到每个人都能使用该系统，系统界面需要做到简洁、便捷、页面不需要过于花哨，保证每个功能模块在界面上尽可能的直接表示，将常用功能放在界面显眼位置，让用户感到方便明了，易于操作。安全性该系统涉及到线上支付问题，因此在设计系统时要充分考虑安全性原则，确保系统安全性及保密性，要防止用户信息泄露、盗用、篡改、伪造及信息破坏REF_Ref32453\r\h[11]。在系统上建立用户验证，以及信息安全保护墙，将用户账号和密码进行安全加密，系统安全性影响着用户使用率，支付环境采取官方第三方接口，保证其安全性。响应速度该系统是小型的电商交易平台，主要是用户进行购物，商家进行商品流通，为了保证用户购物体验，和商家商品流通度，系统的响应速度需要做到快速迅捷，防止出现用户在购买时出现商品下架，商品正在修改等后台更新速度与前台响应速度不一致而造成的问题。可扩展性考虑到系统需要时不时的进行更新维护，该系统需要做到扩展性强、易于移植、需要使用具有可移植性，独立性强的java语言进行代码编写，java编程语言体系结构具有中立性，同时可以较好的适用于各类平台、站点、系统等REF_Ref32152\r\h[12]，在系统进行扩展时能提供更好的基础。本章小结本章主要对系统需求进行分析。从可行性分析、功能性和非功能性需求三方面，简述系统可开发性，同时为下一步系统设计提供思路，引导开发方向。系统设计系统设计是开发过程中的重要一环，搭建开发环境、设计开发平台，通过需求分析进行系统结构设计，搭建系统框架；对数据库、系统功能分析设计，为系统功能实现打好基础，起到承上启下的作用，是系统开发不可缺少的一环。系统设计将会从开发平台环境搭建开始，进一步开展系统功能概要设计、系统功能详细设计、数据库设计，从而保证系统的完整性。平台开发环境系统的开发和运行都需要一个好的开发平台，只有将开发平台搭建完成，后续系统开发才能正常进行，一个完整且灵活性高的开发平台能够大大加快我们代码书写速度，一些平台特有的错误检查机制，能很好避免我们系统开发过程中出现错误，减少不必要麻烦。不同系统开发时所用的开发平台不同，以下开发平台为本系统所使用。IntelliJIDEA平台开发环境首先保证Java语言的运行环境，需要分别去JDK（JavaDevelopmentKit）、Tomcat服务器官网查询下载合适安装包，安装包下载解压完成安装后，在本地电脑高级环境变量中配置环境，保证Java语言正常编译执行。去官网下载所需要的IntelliJIDEA版本（本系统使用的是2018版本），版本选择下载完成后，进行安装，安装时注意自己电脑是64位或32位，按照自己电脑格式进行选择，随后安装完成后进行配置IntelliJIDEA，将自己安装的jdk与IntelliJIDEA关联，运行一个测试类，在IntelliJIDEA配置Tomcat，需要找到自己解压后的Tomcat包，选择其路径。最后完成maven配置，使用maven能将项目之间的依赖进行合理整合,系统所使用jar包存储在本地仓库中，pom文件配置将本地仓库中jar包与项目相关类连接，保证项目正常运行。MySQL数据库搭建官网下载MySQL文件，去官网下载时，按照自己电脑本身格式去下载32位或64位，解压文件后，双击setup.exe进行安装，在选择安装类型时，选择适合自己开发系统所需，填上安装目录，安装完成后。进入mysql配置，选择服务器类型，保证系统运行正常，最后要对MySQL进行编码配置，选择utf-8编码，大多数软件开发平台常用都是这一编码格式，设置完自己超级管理用户的账号和密码后安装完成，正常使用。系统功能概要设计该系统主要是分为用户和管理员两大用户。在设计主要功能时，对两个用户功能进行分析设计，首先对管理员用户需要设计的功能如下图4.1所示：图4.1管理员功能如图4.1所示管理员用户可以操作系统进行商品管理、订单管理、商品分类管理，用户管理操作。四个功能模块可以将商品后台信息更好的展示给客户，在客户遇到不能自行解决的麻烦（忘记用户名，忘记密码）时，更好的为客户提供帮助，也方便系统的维护和后续开发。对普通用户需要设计的功能如图4.2所示：图4.2普通用户功能如上图所示，普通用户使用系统功能有用户信息操作、商品操作、购物车管理、订单管理及支付操作。这些功能模仿当前主流电商功能模块，使该系统更符合当代用户的操作习惯，系统功能更加完善。系统功能详细设计结合系统功能性需求分析，系统功能可分为五大类：用户登录注册功能、商品管理功能、购物车管理功能、订单管理功能，线上支付功能。系统功能详细设计结合流程图与设计步骤，将功能设计进行详述。用户注册登录功能1、用户分为管理员和普通用户两个，但设计两者的操作流程及功能是完全一致的，只有登录网址和登录页面不一致。执行登录操作，输入前台页面所需用户信息登录系统，用户或管理员登录操作流程如图4.3所示：图4.3用户或管理员登录功能2、在注册时，需要输入用户信息，后台判断信息格式。用户或管理员注册功能流程图如图4.4所示：图4.4用户或管理员注册功能商品管理功能1、商品管理功能属于管理员特有功能，普通用户只能在前台进行查看商品信息，搜索自己喜爱的商品，而修改商品信息不属于普通用户功能。管理员操作商品管理，对其进行商品上架、下架及信息修改。商品添加，根据前端页面信息输入框内容提示，填入对应商品信息格式，对其进行上架操作。商品上架功能流程图如图4.5所示：图4.5商品上架功能2、管理员对商品下架需要在商品列表中，选中商品下架，前台页面弹出提示框询问该操作是否执行，执行操作。下架功能流程图如图4.6所示：图4.6商品下架功能3、修改商品信息，从后台中进入商品列表，管理员选中商品修改，按照提示填写信息，确定后提交。修改商品信息流程图如图4.7所示：图4.7商品信息修改功能购物车管理功能1、该系统中购物车管理功能是属于用户功能，用户可以在购物车中进行添加商品，删除商品。购物车管理功能还有一键全选和一键全不选额外功能。执行购物车添加操作，前台选中商品选择加入购物车。购物车添加功能流程图如图4.8所示：图4.8购物车添加商品功能2、在购物车中删除已收藏的商品，首先选中该商品，点击删除，系统会提示删除结果，重新进入该页面，该商品不再显示即操作成功。购物车中删除商品功能流程图如图4.9所示：图4.9购物车删除商品功能订单管理功能1、该系统中订单管理功能分为普通用户和管理员操作。在管理员进行订单管理操作时，可以查看用户的所有生成订单并对其已经付款过的订单进行发货处理；在普通用户进行操作时，用户可以对自己的订单进行支付或取消操作。普通用户对订单进行支付或取消操作功能流程图如图4.10所示：图4.10订单取消或付款功能2、用户生成的所有订单由管理员进行查看，并修改支付过订单状态，线下执行发货。订单查看及发货处理功能流程图如图4.11所示：图4.11订单查看及发货处理功能线上支付功能线上支付功能是该系统中设计较为复杂的模块，里面包含用户收货地址，收货电话等信息的填写，是用户在使用该系统最为关键的一环，具体流程是用户登录系统后，在购物车中选中要购买的产品，点击购买后，让用户进行填写收货信息，填写完成后，确认购买，扫描系统页面中出现的二维码，即可完成线上支付。线上支付功能流程图如图4.12所示：图4.12用户线上支付功能系统数据库设计数据库是开发系统过程中最重要的一环，只有将底层数据库设计完成，后端代码的设计才能得心应手。系统的成熟性与完整性，需要系统数据库的设计提供各方面支持，数据库设计需要做到对系统业务需求的满足，在此基础上通过主外键，非空，限制，索引等来保证数据的健壮性，通过合理的表结构，物理分区存储等实现对数据的读取速度和查找效率的提高REF_Ref17212\r\h[6]。该系统使用的是具有多线程，提供服务速率快，轻巧灵活性强的MySQL数据库REF_Ref4547\r\h[13]。根据系统需求分析，本系统设计了用户表（wwg_user），产品表(wwg_product)，分类表（产品分类表wwg_category），购物车表(wwg_cart)，订单表(wwg_order)，订单子表(wwg_order_item)，支付地址确认表(wwg_shipping)共7个表结构。数据库E-R关系图数据库表总共有8个表，各个表之前都具有一定的关联性，其中主要表关联关系如下：1、用户表与商品表、订单表之间有关联性，用户使用系统生成订单，订单中包含商品。用户和商品两个实体之间关系为M:N，当用户不存在时，订单就不存在，商品不存在订单也就不存在，故订单为弱实体，E-R关系图如图4.13所示：图4.13用户与商品、订单E-R关系图用户表与商品表、购物车表之间有关联性，用户使用系统将商品加入购物车中。用户与购物车两个实体之间的关系为1:1，用户不存在时，购物车就不存在，商品不存在，购物车也就不存在，故购物车为弱实体，E-R关系图如图4.14所示：图4.14用户与商品、购物车E-R关系图用户表与支付表、订单表之间有关联性，用户使用系统生成订单进行商品支付。用户与订单两个实体之间的关系为1:1，用户不存在时，支付过程就不存在。订单不存在，支付也就不存在，故支付为弱实体。E-R关系图如图4.15所示：图4.15用户与支付、订单E-R关系图数据库表设计1、用户表主要用来存储用户的详细信息，当用户使用该系统时，系统验证用户信息需要用到该表，用户密码在存储时采用MD5加密对用户的信息进行了保护。4.1用户表（wwg_user）字段类型长度注释备注idint11用户唯一标识主键u_namevarchar100名称u_passwordvarchar100密码u_emailvarchar25邮箱地址u_phonevarchar25手机号码u_questionvarchar200问题u_answervarchar200答案u_roleint10权限2、产品表主要用来存储产品的详细信息，用户在进行商品搜索时和管理员进行商品信息修改时，都会用到该表。4.2产品表（wwg_product）字段类型长度注释备注idint11商品唯一标识主键cg_idint11分类标识pd_namevarchar50产品名称pd_sub_titlevarchar300产品标题pd_imagevarchar600产品图片地址pd_detailtext产品详情内容pd_pricedecimal(20,2)价格pd_stockint11产品总数量pd_statusint6产品状态3、产品分类表主要存储产品分类主要信息，用户进行分类查找商品和管理员给商品定义商品类别标签时使用此表。4.3产品分类表（wwg_category）字段类型长度注释备注idint11产品类别唯一标识主键cg_namevarchar100产品分类名称cg_statusint6分类状态cg_sort_orderint10产品排序编号4、购物车表主要用来存储用户喜爱商品的商品id，在用户进行购买此商品时，系统根据存储的商品id进行查找商品表中该商品的相关信息，当用户使用购物车功能时会使用此表，主要是对商品id进行操作。4.4购物车表(wwg_cart)字段类型长度注释备注idint11购物车唯一标识主键u_idint11用户唯一标识pd_idint11产品唯一标识pd_stockint11产品数量pd_pricedecimal(20,2)产品总数量5、订单表（也是订单主表）主要对用户准备支付商品或已支付商品而形成的订单信息的整理存储，其中订单表中订单id是唯一的，订单id用来与用户id关联，用户进行购买商品和管理员对订单状态操作时会用到此表。4.5订单表(wwg_order)字段类型长度注释备注idint11订单唯一标识主键or_novarchar20订单号u_idint11用户唯一标识or_paymentdecimal（20,2）支付订单金额or_pay_typeint4支付类型or_statusint10订单状态or_pay_timdatetime记录订单支付or_send_timedatetime记录订单发货or_end_timedatetime订单交易完成时间6、订单子表（也可称订单详情表）主要是订单详细信息的整合归纳，属于订单表子表，订单子表id为唯一主键。主要包含订单中商品各种信息，用户查看订单明细进行支付和管理员查看订单明细时会用到此表。4.6订单子表(wwg_order_item)字段类型长度注释备注idint11订单子表唯一标识主键u_idint11用户唯一标识or_nobigint20订单号pd_idint11产品唯一标识pd_namevarchar50产品名称pd_imagevarchar500产品图片地址pd_pricedecimal（20,2）产品单价pd_quantityint10产品数量pd_t_pricedecimal（20,2）产品总价7、支付地址表（也可简称支付表）主要是用户收货姓名，地址，电话等详细信息的接收。用户购买商品添加收货地址信息时使用此表。4.7支付地址表(wwg_shipping)字段类型长度注释备注idint11表唯一标识主键user_idint11用户唯一标识accept_namvarchar50接收者姓名accept_phovarchar50接收者手机号accept_provarchar50省份accept_cyvarchar50城市accept_disvarchar200区/县accept_advarchar300详细地址accept_zipvarchar10邮编本章小结本章从平台开发环境搭建设计出发，打好系统开发基础；将系统功能概要进行简述，为系统功能设计提供思路；系统功能详细设计用流程图简述功能实现步骤；数据库设计用数据库表和E-R关系图阐述数据库如何搭建。系统设计进一步将系统框架搭建完成，为具体功能设计和实现提供支持。系统设计与实现本系统主要分为管理员和用户使用，在实现功能时，也是分为两大模块进行设计分析实现，将其分为用户功能和管理员功能。对每个功能模块分析设计，结合系统功能开发步骤和代码实现详述系统设计与实现。用户功能实现用户功能实现是系统中主要功能，能简单实现出来主要是用户登录注册管理功能和购物车管理功能，较复杂的为订单管理功能和线上支付功能的实现，前两个功能所涉及到的表关系简单，而后两个功能牵扯到的表关系复杂。用户管理主要功能的实现如下。用户登录注册功能1、当用户想要使用该系统时，用户需要进行使用网址进入该系统首页，在首页中点击注册按钮（不进行注册的用户无法进行正常购买商品），这时需要用户在注册页面，填写本人的各种信息，填写信息完成之后，系统校验信息格式是否正确，格式正确，注册完成。用户注册功能实现如图5.1所示：图5.1用户注册功能实现使用注册功能时，信息填写格式正确且完整，系统验证该用户是否已经存在，用户不存在，提示注册成功，用户选择是否进行登录。用户注册功能前台部分实现代码为：//用户注册register:function(userInfo,resolve,reject){ _mm.request({ url:_mm.getServerUrl('/user/register.do'), data:userInfo, method:'POST', success:resolve, error:reject });},//检查登录状态checkLogin:function(resolve,reject){ _mm.request({ url:_mm.getServerUrl('/user/getUserInfo.do'), method:'POST', success:resolve, error:reject });},2、完成用户注册之后，用户进行登录使用该系统，在该系统首页找到登录按钮，填写密码和用户名称，格式校验成功，用户是否存在由系统验证后得出结果，不存在用户需要在系统中注册信息，存在用户，校验密码与该用户在数据库中存储密码是否一致，一致会成功登录，不一致系统会建议用户重新输入密码，或者进行找回密码。用户登录功能实现如图5.2所示：图5.2用户登录功能实现用户登录系统，从前台输入的信息从控制器传入服务层，服务层调用数据层，从数据库中验证用户输入信息的正确性，再向控制器返回信息。用户登录系统前台部分实现代码如下：//用户登录login:function(userInfo,resolve,reject){ _mm.request({ url:_mm.getServerUrl('/user/login.do'),//获取服务器地址 data:userInfo, method:'POST', success:resolve, error:reject });},//检查用户名checkUsername:function(username,resolve,reject){ _mm.request({ url:_mm.getServerUrl('/user/checkValid.do'), data:{ type:'username', str:username }, method:'POST', success:resolve, error:reject });},购物车管理功能使用系统的购物车管理功能，用户登录后在系统首页找到我的购物车模块，在购物车模块中，删除按钮的点击，会将购物车中的商品删除；也可以在系统首页查找自己喜欢的商品后，将其加入我的购物车，购物车管理功能中，可以进行一键全选或者反选操作。购物车管理实现功能如图5.3所示：图5.3购物车管理功能实现用户从前台点击加入我的购物车，服务层接受控制器传来的用户id和商品id、加入购物车中的商品数量，服务层判断产品是否在购物车中，在购物车中，只需添加该产品在购物车中的数量，如不在，需要增加该产品记录，根据判断结果向数据层执行对应的SQL语句，最后返回结果值。用户将喜爱商品加入购物车前台部分实现代码为：<divclass="crumb"> <divclass="w"> <divclass="crumb-con"> <aclass="link"href="./index.html">WWG</a> <span>></span> <spanclass="link-text">购物车</span> </div> </div></div><divclass="wrapw">//添加到购物车addToCart:function(productInfo,resolve,reject){ _mm.request({ url:_mm.getServerUrl('/cart/add.do'), data:productInfo, success:resolve, error:reject }); },购物车中删除商品，从前台传出产品id，服务层接受用户id、产品id，将其传入数据层，执行删除操作后，向控制器返回结果值。购物车中商品被用户删除前台部分实现代码为：//删除指定商品deleteProduct:function(productIds,resolve,reject){ _mm.request({ url:_mm.getServerUrl('/cart/delete_product.do'), data:{ productIds:productIds }, success:resolve, error:reject });},订单管理功能用户使用系统的订单管理功能，需要从系统首页登录系统，在我的订单模块中查看订单列表，在列表里面去查看订单详情，在订单详情里面，用户可以对该订单进行取消操作或者进行支付该订单操作，完成以上任意操作，系统会告知用户操作成功。用户在订单详情进行取消或支付操作功能实现如图5.4所示：图5.4订单管理功能实现从前台获取订单号，由控制器传入服务层，服务层根据条件判断，判断订单是否存在，不存在直接传回结果值；该订单存在，存在进行判断该订单状态，进入数据层获取订单状态，已付款订单不可被取消，如不是付款订单，传入数据层执行取消订单，再返回结果值。用户进行订单取消操作前台部分实现代码为：//取消订单cancelOrder:function(orderNumber,resolve,reject){ _mm.request({ url:_mm.getServerUrl('/order/cancel.do'), data:{ orderNo:orderNumber, }, success:resolve, error:reject });}订单支付，从前台获取该用户信息、订单号，传入服务层判断用户是否存在，不存在返回支付失败结果，存在执行支付操作。用户进行订单支付操作前台部分实现代码为：<divclass="crumb-con"> <aclass="link"href="./index.html">WWG</a> <span>></span> <spanclass="link-text">订单支付</span></div>//提交订单createOrder:function(orderInfo,resolve,reject){ _mm.request({ url:_mm.getServerUrl('/order/create.do'), data:orderInfo, success:resolve, error:reject });},线上支付功能线上支付功能在使用时，要求用户必须登录系统，用户从订单管理模块中查看订单详情，从中进行去支付该订单，在订单提交成功后，刷新页面，出现支付宝二维码，这时，只需要用户进行扫描二维码进行支付即可，用户支付成功后，系统会提醒用户支付是否成功。生成支付二维码，将订单号、用户id传入服务层，判断用户存在，进行线上支付操作。线上支付功能前台部分实现代码为：//线上支付getPaymentInfo:function(orderNumber,resolve,reject){ _mm.request({ url:_mm.getServerUrl('/order/pay.do'), data:{ orderNo:orderNumber, }, success:resolve, error:reject });},管理员功能实现管理功能需要完整性和安全性，需要直接操作到底层数据库中数据，对其安全性的要求极高，但在书写代码时，却不那么复杂，大部分是直接的增删改查，和用户功能的复杂度不同，不要求系统界面的完美性，只要求操作数据库功能的安全性。管理员主要功能实现如下：管理员登录功能管理员登录功能与用户登录功能的实现相差不多。管理员登录后台系统，需要特定的后台网址，进入系统登录页面，输入账号和密码，系统从数据库中搜索查询该账号是否存在，不存在，系统警告提醒，存在则会校验密码正确性，有无错误，系统都会进行提醒，管理员无注册页面，因为管理员与用户只是权限上的不同，用户成为管理员只需要在底层数据库中进行修改权限。管理员实现登录功能如图5.6所示：图5.6管理员登录功能实现服务层获取从控制器传来的用户信息，判断用户存在，向底层数据库验证用户信息，信息成功执行的登录操作，返回结果值。管理登录功能前台部分实现代码为：//管理员登录login:function(userInfo,resolve,reject){ _mm.request({ url:_mm.getServerUrl('/user/login.do'),//获取服务器地址 data:userInfo, method:'POST', success:resolve, error:reject });},商品管理功能当管理员登录后台系统后，在系统首页中的商品管理模块中，可以进行对商品下架，上架，商品信息重新编辑等操作。管理员只需要点击那些功能性按钮，就可以对商品进行相应操作，在对商品进行修改编辑时，用户可以上传商品图片，并对其进行详细描述，这些修改后，前台系统进行刷新，显示最新商品信息。商品管理功能实现如图5.7所示：图5.7商品管理功能实现执行添加商品操作，服务层接受控制器传来的商品信息对象，判断接受信息是否为空，为空不传入数据层，直接返回结果值。不为空传入数据层，商品信息添加到数据，返回结果值，返回添加是否成功的结果值。商品管理功能前台部分实现代码为：//获取商品列表getProductList:function(listParam,resolve,reject){ _mm.request({ url:_mm.getServerUrl('/product/list.do'), data:listParam, success:resolve, error:reject });},订单管理功能管理员操作订单管理功能。管理员在订单管理模块中，在其订单列表中，找寻你需要进行操作的订单，点击查看，在订单详情中对其进行发货处理。进行发货处理的前提是用户使用系统购买商品，进行线上支付，这时后台会显示订单状态为已支付，管理员可以进行发货处理。订单管理功能实现如图5.8所示：图5.8订单管理功能实现服务层接受来自控制层传来的订单号，判断订单号是否存在，不存在，向控制层返回结果值，订单存在，在数据层执行订单状态修改操作，控制层接受结果值。订单管理功能前台部分实现代码为：//获取订单列表getOrderList:function(listParam,resolve,reject){ _mm.request({ url:_mm.getServerUrl('/order/list.do'), data:listParam, success:resolve, error:reject });},本章小结本部分对系统功能进行拆分，从用户和管理员两部分，对系统详细功能进行设计与实现。主要对登录注册、购物车管理、订单管理、商品管理、线上支付功能讲述，详述了系统功能实现过程和代码编写，将实现结果进行了展示。系统测试系统测试将系统看做一个整体，测试所有相关功能，以方便检测系统分析和设计中出现的错误，将整个系统再次进行优化，从而保证系统使用可行性。系统测试目的软件测试主要是通过计算机应用软件测试当做实际探究对象,进一步分析软件测试的关键作用,探究各个软件测试手段的优缺点,制定了完善软件测试手段的详细措施REF_Ref15847\r\h[14]。采用系统测试就是为了提高系统的完整性和安全性，将系统中设计时未发现的bug进行排除，将系统功能更加完善。本系统采用黑盒测试，将程序中每个功能和界面都进行测试一遍，从用户角度来测试系统是否可用，以及使用的方便度，页面简洁度，可使用性REF_Ref17525\r\h[15]。系统测试环境部署系统开始进行测试之前，开始部署系统环境，使用系统，需要将系统部署到web上，需要用到Tomcat服务器，NATAPP内网穿透，FTPserver本地文件仓库，Nginx反向代理。首先启动IntelliJIDEA开发平台，进行Tomcat服务器部署，将服务器url设置为http://localhost:8080/dist/view/index.html系统主页面网址，端口号为8080。再进行部署NATAPP内网穿透，打开NATAPP.exe，在弹出的cmd窗口中输入natapp-authtoken=0fc7e4d8e3a16b12，获得返回网址，将其填入到项目配置文件中，获取阿里返回值。配置FTPserver本地文件仓库和Nginx反向代理，直接点击FTP启动，将设置的账号和密码填入项目配置文件中，部署Nginx反向代理，找到包含nginx.exe文件路径，打开cmd窗口，输入nginx.exe-sreload进行启动更新配置，这时系统环境部署完成，在开发平台中启动Tomcat服务器，项目执行后，浏览器会自动跳出系统页面。系统功能测试用例为了保证系统可使用性、安全性和完整性，对系统的用户登录注册、商品管理、购物车管理、订单管理和线上支付功能进行测试，系统的具体测试用例表如6.1所示：系统功能测试用例表6.1测试功能测试步骤测试结果1、用户功能（1）管理员和用户分别进行使用后台和前台登录功能，输入各自的账号和密码。（2）测试系统注册功能，信息输入，系校验信息成功后，注册测试。（1）系统提示登录成功（2）系统提示注册成功2、商品管理功能（1）管理员通过登录后台系统，操作商品管理模块，对某一商品进行上架或下架操作。（2）对商品信息进行修改，点击提交按钮。（1）系统提示下架或上架成功，前台显示成功。（2）前台系统显示该商品与修改后保持一致。3、购物车管理功能（1）用户在前台页面操作购物车，进行删除商品操作。（2）用户选择喜爱商品，加入我的购物车中。（1）系统自动刷新页面，我的购物车中的商品已被删除。（2）系统提示添加成功。我的购物车模块中商品已添加上。4、订单管理功能（1）测试订单管理功能，测试订单取消操作。（2）测试用户对生成的订单进行去支付操作。（3）管理员对已支付订单进行发货处理。（1）系统刷新页面，订单不存在