网上商城系统课程设计报告书

《Web开发技术》课程设计报告题目：网上商城系统目录1 任务与要求 (3)1.1需求分析 (3)1.2需求规定 (3)1.3模拟需求图 (4)2 系统总体设计 (5)2.1设计目标及完成功能 (5)2.2 系统结构设计 (6)3 系统详细设计 (8)3.1普通用户界面的详细设计 (8)3.2管理员界面的详细设计 (12)3.3数据库表的详细设计 (14)3.4代码详细设计 (16)4测试和维护 (36)5总结 (39)6参考文献 (40)1. 任务与要求1.1 需求分析互联网的快速发展为人们的购物提供了多种方式，网上购物就是目前主流的网上购物方式之一。

网上商城将现实中的购物行为虚拟到网上进行，人们可以足不出户，即可获得自己需要的商品。

于是，我们为提高自己在JSP以及相关一系列中的编程能力，通过这几个星期的努力，来实现网上商城购物的一系列功能，了解用户的需要和管理员的功能来实现对购物系统的管理功能。

明确所要开发软件的功能、性能与界面，使得软件人员更能清楚的了解用户的需求，并在一定基础上进一步提出概要说明书让使用者能更容易应用我们的系统。

1.2 需求规定1.3 模拟需求图2系统总体设计2．1 系统设计目标及完成功能网上购物商城是基于B/S 模式的电子商务网站，用于满足不同人群的购物需求，本课程设计主要从普通用户界面和管理员界面的角度出发，以高效管理、满足消费者需求为原则，做出了以下的系统设计目标：●统一友好的操作界面，具有良好的用户体验。

●商品信息完备，让用户可以更加清楚商品的性能。

●用户可通过购物车一次购买多件商品。

●实现支付功能，用户选择商品后可在线提交订单。

●提供简单的安全模式，用户必须先登录，才允许购买物品。

●用户可以查看自己订单信息。

●设计网站后台，管理网站的各项基本数据。

2．2 系统结构设计2.2.1系统流程图2.2.2 系统结构网上商城系统中有两类用户，分别是普通用户和管理员，他们分别对应着普通用户模板和管理员模板。

普通应户模板是网上商城系统的主体模板，它具有以下功能：●用户注册。

●用户登录。

●查看商品信息。

●发表留言。

●搜索商品信息。

●将商品加入购物车。

●对个人购物车进行管理。

●修改个人资料。

管理员模板负责网上商城系统的管理和维护工作，它具有以下功能：●管理商品类别信息（包括修改和删除商品类别信息）。

●添加商品类别信息。

●管理商品信息（包括修改和删除商品类别信息）。

●添加商品信息。

●管理普通用户。

●管理订单信息。

●修改个人资料。

3 系统详细设计3.1普通用户界面的详细设计3.1.1 查看商品信息普通用户主界面（Usermain.jsp）为主页面，它是一个框架页，它将整个界面分为上下两个框架，这两个框架分别是topFrame和usermainFrame他们所对应默认的页面分别是普通用户功能选择界面topuser.jsp和商品信息列表界面warelist.jsp效果图如图所示：Topuser.jsp效果图普通用户功能选择界面（topuser.jsp）提供了普通用户的所有功能连接，所显示欢迎信息是通过获取保存在session中的用户名来实现的。

warelist.jsp效果图3.1.2购物车管理，包括查看购物车、添加商品到购物车、从购物车中删除商品查看购物车信息：为用户提供管理自己购物车中信息的功能，这个模块中用户同时可以删除购物信息。

添加商品到购物车：在商品信息列表界面中提供了将某个商品添加到购物车的链接，包括填写购物信息界面和添加成功界面。

完成添加后将跳转到购物车信息管理界面。

从购物车中删除商品：点击删除的图标，用户可以将某商品从购物车中删除。

3.1.3 用户资料管理用户可自行修改用户的密码，电话号码，邮箱。

3.1.4留言界面的详细设计用户可就商品进行评论，可以添加留言以及表情。

addmsg.jsp效果图3.2管理员界面的详细设计3.2.1、管理员主界面管理员界面（Adminmain．jsp）与普通用户主界面（Usermain.jsp）一样，它也是一个包含页，它将整个界面分为上下两个页面，这两个页面分别是topFrame和usermainFrame他们所对应默认的页面分别是管理员功能选择界面topadmin.jsp和商品信息列表界面adminlist.jsp效果图如图所示：Topadmin.jsp效果图管理员功能选择界面（topuser.jsp）提供了普通用户的所有功能连接，所显示欢迎信息是通过获取保存在session中的用户名来实现的。

Adminlist.jsp效果图商品信息管理界面显示了网上商城系统中的左右商品信息，在这个页面上采用的方法来显示商品信息，它还提供了添加、修改和删除商品信息的借口。

3.2.2.管理用户界面，包含查看用户信息功能和删除用户信息功能3.2.3.订单管理界面，可以实现查看用户添加的订单信息功能3.3数据库表的详细设计网上商城系统中所创建的数据库的名称是shop，这个数据库包括以下5个数据表：●Goods数据库——保存订单信息●Users数据库——保存所有用户信息●Wares数据库——保存商品信息●Words数据库——保存留言信息3.3.1 Goods数据库3.3.2 Users数据库3.3.3Wares数据库3.3.4 Words数据库3.4代码详细设计3.4.1、数据库连接package dbconn;import java.sql.Connection;import java.sql.DriverManager;import java.sql.PreparedStatement;import java.sql.ResultSet;import java.sql.SQLException;public class DB {private final String DRIVER="com.microsoft.jdbc.sqlserver.SQLServerDriver";private final String URL="jdbc:microsoft:sqlserver://localhost:1433;databasename=dbj_bl og";private final String USERNAME="sa";private final String PWD="sa";/*** 连接数据库驱动，驱动名称及URL.* 从Statement继承，用于提供可以查询信息一起预编译的语句.* ResultSet 类可用来接受执行SQL查询语句后得到的记录集.*/private Connection conn=null;private PreparedStatement pstat=null;private ResultSet rs=null;public DB(){}/**** @return Connection 返回生成的连接对象*/public Connection getConn(){try {Class.forName(DRIVER);conn=DriverManager.getConnection(URL,USERNAME,PWD); } catch (ClassNotFoundException e) {// TODO Auto-generated catch blockSystem.out.println("注册驱动失败"+e.toString());} catch (SQLException e) {// TODO Auto-generated catch blockSystem.out.println("数据库连接失败"+e.toString()); }return conn;}/**** @param sql待查询的sql语句* @return 返回查询结果记录集*/public ResultSet executeQuery(String sql){try {pstat=conn.prepareStatement(sql);rs=pstat.executeQuery();return rs;} catch (SQLException e) {// TODO Auto-generated catch blockSystem.out.println("数据库操作失败");return rs;}}/**** @param sql 待操作的sql语句* @return 返回整型值*/public int executeUpdate(String sql){int flag=0;try {pstat=conn.prepareStatement(sql);flag=pstat.executeUpdate();} catch (SQLException e) {// TODO Auto-generated catch blocke.printStackTrace();}return flag;}/*** 对数据库关闭的操作*/public void close(){try {if(rs!=null){rs.close();}if(pstat!=null){pstat.close();}if(conn!=null){conn.close();}}catch (SQLException e) {// TODO Auto-generated catch blocke.printStackTrace();}}}3.4.2、乱码的处理问题public class EncodeFilter implements Filter {String code="GBK";public void destroy() {}public void doFilter(ServletRequest arg0, ServletResponse arg1, FilterChain arg2) throws IOException, ServletException { // TODO Auto-generated method stubHttpServletRequest request=(HttpServletRequest)arg0;request.setCharacterEncoding(code);arg2.doFilter(request, arg1);}public void init(FilterConfig arg0) throws ServletException {// TODO Auto-generated method stub}}3.4.3、获取系统时间package util;import java.util.Date;public class MyDate {Date d=null;public MyDate(){d=new Date();}public String getDate(){return (d.getYear()+1900)+"年"+(d.getMonth()+1)+"月"+d.getDate()+"日"+d.getHours()+"时";}3.4.4、图片上传<%String realpath=request.getRealPath("");String uploadPath=realpath+"\\upload\\";// 上传文件的目录String tempPath = "D:\\temp\\"; // 临时文件目录String filename="";Date dd=new Date();filename="upload"+dd.getTime();boolean isMultipart=FileUpload.isMultipartContent(request);if(!isMultipart){response.sendRedirect("index.jsp");}try{DiskFileItemFactory factory=new DiskFileItemFactory();factory.setSizeThreshold(1024000);File temp=new File(tempPath);if(!temp.exists()){temp.mkdir();}factory.setRepository(temp);FileUpload fileupload=new FileUpload(factory);fileupload.setSizeMax(100*1024*1024);List items=fileupload.parseRequest(request);Iterator itr=items.iterator();while(itr.hasNext()){FileItem fileitem=(FileItem)itr.next();if(!fileitem.isFormField()){String name=fileitem.getName();name=name.substring(stIndexOf("\\")+1,name.length());long size=fileitem.getSize();if((name==null||name.equals(""))&&size==0)continue;name=name.substring(stIndexOf('.')+1,name.length());File upload=new File(uploadPath);if(!upload.exists()){upload.mkdir();}fileitem.write(new File(uploadPath+filename+"."+name));}else{}}}catch(Exception e){System.out.println("上传文件失败！"+e.toString());}response.sendRedirect("waredetail.jsp");%><%String realpath=request.getRealPath("");File files=new File(realpath+"\\upload");String test[];test=files.list();for(int k=0;k<test.length;k++){System.out.println(test[k]);%><img alt=""src="upload\<%=test[k] %>"width="200"height="200"><%}%>3.4.5商品数据表操作类例、GoodsCtrl,其他类与之相似，省略不写package edu.hbcf.shop.ctrl;import java.sql.Connection;import java.sql.PreparedStatement; import java.sql.ResultSet;import java.sql.SQLException;import java.util.ArrayList;import java.util.List;import edu.hbcf.shop.conn.DBConn; import edu.hbcf.shop.bean.ShopGoods;/*** MsgCtrl类实现留言版模块的增、删、改、查* @version 1.0* @author cy**/public class GoodsCtrl {DBConn db=null;Connection conn=null;ResultSet rs=null;PreparedStatement pstat=null;/*** 此方法实现查询所有留言信息，并返回查询结果* @return List( ShopGoods 类的结果记录集合)*/public List<ShopGoods> queryAll(){List<ShopGoods> list=new ArrayList<ShopGoods>();//定理list 泛型集合，并实例化db=new DBConn();//生成相应的类对象conn=db.getConn();//加载并注册驱动，生成连接对象返回String sql="select * from goods order by GoodsID DESC";//定义查询所有留言的sql语句try {pstat=conn.prepareStatement(sql);//生成预处理执行对象rs=pstat.executeQuery();//执行sql语句，并将结果保存在结果记录集中while(rs.next()){//游标后移一条记录，如果记录存在ShopGoods sg=new ShopGoods();//实例化留言对象sg.setGoodsID(rs.getInt("GoodsID"));//将对应记录字段GoodsID保存在商品留言对象的GoodsID属性中sg.setGoodsName(rs.getString("GoodsName"));//将对应记录字段GoodsName保存在商品留言对象的GoodsName属性中sg.setBuyNumber(rs.getInt("BuyNumber"));//将对应记录字段BuyNumber值保存在商品留言对象的BuyNumber属性中sg.setUserName(rs.getString("UserName"));//将对应记录字段UserName值保存在商品留言对象的UserName属性中sg.setWareID(rs.getInt("WareID"));//将对应记录字段WareID值保存在商品留言对象的WareID属性中sg.setCreateTime(rs.getString("CreateTime"));//将对应记录字段CreateTime值保存在商品留言对象的CreateTime属性中list.add(sg);//添加对象sg到集合类中}} catch (SQLException e) {// TODO Auto-generated catch blockSystem.out.println("查询留言版,数据库操作失败！"+e.toString());}finally{this.close();//连接通道关闭}return list;//返回集合类对象}/*** 此方法实现按用户查询所有留言信息，并返回查询结果* @return List( ShopGoods 类的结果记录集合)*/public List<ShopGoods> queryAllByUser(String UserName){ List<ShopGoods> list=new ArrayList<ShopGoods>();//定理list 泛型集合，并实例化db=new DBConn();//生成相应的类对象conn=db.getConn();//加载并注册驱动，生成连接对象返回String sql="select * from goods where UserName=? order by GoodsID DESC";//定义查询所有留言的sql语句try {pstat=conn.prepareStatement(sql);//生成预处理执行对象pstat.setString(1, UserName);rs=pstat.executeQuery();//执行sql语句，并将结果保存在结果记录集中while(rs.next()){//游标后移一条记录，如果记录存在ShopGoods sg=new ShopGoods();//实例化留言对象sg.setGoodsID(rs.getInt("GoodsID"));//将对应记录字段GoodsID值保存在商品留言对象的GoodsID属性中sg.setGoodsName(rs.getString("GoodsName"));//将对应记录字段GoodsName值保存在商品留言对象的GoodsName属性中sg.setBuyNumber(rs.getInt("BuyNumber"));//将对应记录字段BuyNumber值保存在商品留言对象的BuyNumber属性中sg.setUserName(rs.getString("UserName"));//将对应记录字段UserName值保存在商品留言对象的UserName属性中sg.setWareID(rs.getInt("WareID"));//将对应记录字段WareID值保存在商品留言对象的WareID属性中sg.setCreateTime(rs.getString("CreateTime"));//将对应记录字段CreateTime值保存在商品留言对象的CreateTime属性中list.add(sg);//添加对象sg到集合类中}} catch (SQLException e) {// TODO Auto-generated catch blockSystem.out.println("查询留言版,数据库操作失败！"+e.toString());}finally{this.close();//连接通道关闭}return list;//返回集合类对象}/*** 此方法实现向数据库添加一条留言信息* @return int 添加留言成功返回1，否则返回0*/public int addGoods(ShopGoods sg){int flag=0;db=new DBConn();//生成相应的类对象conn=db.getConn();//加载并注册驱动，生成连接对象返回String sql="insert into goods values(?,?,?,?,?)";//定义添加记录的sql语句try {pstat=conn.prepareStatement(sql);//生成预处理执行对象pstat.setString(1,sg.getGoodsName());//设置对象的GoodsName参数pstat.setInt(2, sg.getBuyNumber());//设置对象的BuyNumber 参数pstat.setString(3, sg.getUserName());//设置队想的UserName 参数pstat.setInt(4, sg.getWareID());//设置对象的WareID参数pstat.setString(5, sg.getCreateTime());//设置对象的CreateTime参数flag=pstat.executeUpdate();//执行sql语句} catch (SQLException e) {// TODO Auto-generated catch blockSystem.out.println("添加留言失败"+e.toString());}finally{this.close();//关闭连接通道}return flag;//返回操作状态}/*** 此方法实现根据留言id查询一条留言信息* @param GoodsID 整形值，接受一条记录的id* @return ShopGoods 将查询的一条留言记录存放到ShopGoods类实例中返回*/public ShopGoods querryById(int GoodsID){ShopGoods sg=null;db=new DBConn();//生成相应的类对象conn=db.getConn();//加载并注册驱动，生成连接对象返回String sql="select * from goods where GoodsID=?";//定义查询一条留言的sql语句try {pstat=conn.prepareStatement(sql);//生成预处理执行对象pstat.setInt(1, GoodsID);//设置pstat对象的待定参数msgidrs=pstat.executeQuery();//执行查询if(rs.next()){//游标后移一条记录，如果记录存在sg=new ShopGoods();//实例化ShopGoods对象//sg.setGoodsID(rs.getInt("GoodsID"));//将对应记录字段GoodsID值保存在留言对象的GoodsID属性中sg.setGoodsName(rs.getString("GoodsName"));//将对应记录字段GoodsName值保存在留言对象的GoodsName属性中sg.setBuyNumber(rs.getInt("BuyNumber"));//将对应记录字段BuyNumber值保存在留言对象的BuyNumber属性中sg.setUserName(rs.getString("UserName"));//将对应记录字段UserName值保存在留言对象的UserName属性中sg.setWareID(rs.getInt("WareID"));//将对应记录字段WareID值保存在留言对象的WareID属性中sg.setCreateTime(rs.getString("CreateTime"));//将对应记录字段msgid值保存在留言对象的CreateTime属性中}} catch (SQLException e) {// TODO Auto-generated catch blockSystem.out.println("依据id查询一条留言失败"+e.toString());//输出错误信息}finally{this.close();//关闭连接通道}return sg;//返回sg对象}/**** @param sg 接收ShopGoods类的实例对象* @return int值，表示操作成功为非零值，操作失败为0*/public int updateGoods(ShopGoods sg){int flag=0;db=new DBConn();//生成相应的类对象conn=db.getConn();//加载并注册驱动，生成连接对象返回String sql="update goods setBuyNumber=?,UserName=?,WareID=?,CreateTime=? where GoodsID=?";try {pstat=conn.prepareStatement(sql);//生成预处理执行对象pstat.setInt(1, sg.getGoodsID());//设置pstat对象的GoodsID参数pstat.setInt(2, sg.getBuyNumber());//设置对象的BuyNumber参数pstat.setString(3, sg.getUserName());//设置队想的UserName参数pstat.setInt(4, sg.getWareID());//设置对象的WareID参数pstat.setString(5, sg.getCreateTime());//设置对象的CreateTime参数flag=pstat.executeUpdate();} catch (SQLException e) {// TODO Auto-generated catch blocke.printStackTrace();}finally{this.close();//关闭连接}return flag; //返回flag}/*** 实现一条留言记录的删除* @param GoodsID 整形值，接受一条记录的id* @return int值，表示操作成功为非零值，操作失败为0*/public int deleteGoodsbyId(int GoodsID){int flag=0;db=new DBConn();//生成相应的类对象conn=db.getConn();//加载并注册驱动，生成连接对象返回String sql="delete from goods where GoodsID=?";try {pstat=conn.prepareStatement(sql);//生成预处理执行对象pstat.setInt(1, GoodsID);//设置待定参数的值flag=pstat.executeUpdate();//执行sql语句} catch (SQLException e) {// TODO Auto-generated catch blocke.printStackTrace();}finally{this.close();//关闭连接通道}return flag; //返回状态标志}/*** 此方法实现关闭操作留言版产生的连接对象、预处理执行对象以及结果记录集*/public void close(){try{if(rs!=null){//如果结果记录集rs不为空rs.close(); //关闭rs}if(pstat!=null){//如果预处理执行对象pstat不为空pstat.close();//关闭pstat}if(conn!=null){//如果连接对象conn不为空conn.close();//关闭conn}}catch(SQLException e){System.out.println("操作留言版数据库关闭异常！"+e.toString());}}}3.4.6客户端校验<script language="javascript">function check(){if(ername.value=="")//判断用户名为空{alert("用户名不能为空");return false;}if(document.myform.password.value=="")//判断密码为空{alert("密码不能为空");return false;}var password2=request.getParameter("password");if(password2.value!=password.value){alert("输入的密码不一致！");//判断密码一致性return false;}}</script>3.4.7新技术应用——HTML5表单、按钮美化<style type="text/css">.content {font-family: 宋体;font-size: 12px; line-height:18px} a:link {font-size:12px; color:red}a:visited{font-size:12px; color:blue}a:hover{font-size:12px; color:pink}a:active{font-size:12px; color:purper}input[type="submit"]:hover {background: -webkit-gradient(linear, left top, left 24, from(#FF9800), color-stop(0%, #FF6900), to(#FF9800));}.form {margin-top:100px;margin-bottom:100px;margin-left: 400px;margin-right: 400px;padding: 26px 24px 46px;font-weight: normal;background: white;border: 1px solid #E5E5E5;-webkit-box-shadow: rgba(200, 200, 200, 0.7) 0 4px 10px -1px;box-shadow: rgba(200, 200, 200, 0.7) 0 4px 10px -1px;}.button-primary {font-size: 13px;line-height: 16px;padding: 3px 10px;border-color: #298CBA;font-weight: bold;color: white;background: #21759B url(../images/button-grad.png) repeat-x scroll left top;text-shadow: rgba(0, 0, 0, 0.3) 0 -1px 0;-webkit-border-radius: 11px;border-radius: 11px;cursor: pointer;}input {-webkit-border-radius: 3px;border-radius: 3px;border-width: 1px;border-style: solid;}</style>表格美化<style type="text/css">#nav{margin:0;padding:7px 6px 0;line-height:100%;border-radius:2em;-webkit-border-radius:2em;-wekit-box-shadow:0 1px 3px rgba(0,0,0,4);-moz-box-shadow:0 1px 3px rgba(0,0,0,4);background:#8b8b8b;background:-moz-linear-gradient(top,#a9a9a9,#7a7a7a);border:solid 1px#6d6d6d;}</style>3.4.8分页//分页基本信息String cpage=request.getParameter("currentpage");int recordcounts=0; //当前所有记录个数int currentpage=1;if(cpage!=null){currentpage=Integer.parseInt(cpage);}int pages=1;int page_recorde_count=4;if(msglist!=null){recordcounts=msglist.size();//计算留言的个数pages=(recordcounts%page_recorde_count==0)?(recordcounts/page_recorde_ count):(recordcounts/page_recorde_count)+1;int i=(currentpage-1)*page_recorde_count;int count=0;while(count<page_recorde_count){if(i<recordcounts){msg=msglist.get(i);//得到下表索引表示的对象count++;i++;}else{break;}}}%>总共<%=pages %>页，当前第<%=currentpage %>页<%if(currentpage==1) {%>首页<%}else{ %><a href="waredetail.jsp?currentpage=1">首页</a><%} %>|<%if(currentpage-1>=1) {%><a href="waredetail.jsp?currentpage=<%=currentpage-1 %>">上一页</a><%}else{ %>上一页<%} %>|<%if(currentpage+1<=pages) {%><a href="waredetail.jsp?currentpage=<%=currentpage+1 %>">下一页</a> <%}else{ %>下一页<%} %>| <%if(currentpage==pages) {%>尾页<%}else{ %><a href="waredetail.jsp?currentpage=<%=pages %>">尾页</a><%} %>4、测试测试是为了发现程序中的错误而执行程序的过程。