《WEB应用与开发》课程设计报告.docx

《WEB应用与开发》课程设计报告.docx

《《WEB应用与开发》课程设计报告.docx》由会员分享，可在线阅读，更多相关《《WEB应用与开发》课程设计报告.docx（15页珍藏版）》请在冰豆网上搜索。

《WEB应用与开发》课程设计报告

WEB应用与开发课程设计

报告

设计题目：

网上购物系统

专业：

信息管理与信息系统

学生姓名：

**

班级学号：

分组成员：

**

指导教师：

**

20年06月08日

《WEB应用与开发》课程设计报告

一、设计时间

2012年6月04日-----6月08日

总的设计时间为1周，第17周。

具体安排如下：

1、分析设计准备阶段（第17周周一至周二）

2、编程调试阶段（第17周周三至第17周周四）

3、书写设计报告和书写说明书阶段（第17周周五）

4、考核阶段（第17周周五）

二、设计地点

**学院机房

三、设计目的

通过对一些实际问题的软件设计，使学生能将课本的理论知识应用于实践，编制出较为实用的小系统，培养学生查阅资料的习惯，提高学生独立思考和解决问题的能力。

1、巩固学习WEB基础知识方面的基本算法,进一步熟悉基本概念。

2、熟练html标记语言、Java语言的应用、tomcat软件和SQL数据库的应用。

3、运用所学的WEB知识，能够实际做出较为实用的小项目，增进一些实际问题的软、硬件知识的掌握。

4、培养查阅资料,独立思考问题的能力。

四、设计小组成员

**

五、指导老师

**

六、设计课题

网上购物系统——JpetStore网上宠物商店

七、基本思路及关键问题的解决方法

1、购物系统的需求与分析：

在正式开发之前，应先了解系统应实现的功能。

为了解系统的需求，通过观察著名网站的电子商务界面淘宝网站等，可以发现共同拥有d饿选项有：

商品的图片、商品的分类提供搜索商品的功能等、用户登录后方可goum商品。

用户选中的一些商品先存放与购物车中，在最后下订单时进行汇总。

因此可初步了解到JpetStore购物系统的基本功能。

普通用户可以浏览所以大类别商品，查看某一大类别商品下的所有小类别商品分类、小类别商品下的所有商品，搜索商品，将商品添加到购物车，更新购物车等。

2、数据库表的设计：

数据库设计时系统开发过程的一个重要环节，它具体可以分为两部分：

一个是概念模型设计，即E-R图的设计；二是物理模型设计，即数据库/表字段的设计。

3、购物车的理解、购物清单结算

4、运行工程

八、算法及流程图

（一）功能模块的实现

系统功能模块的划分

前台系统顺序流程图

1、大类别显示

应用程序的首页只提供了一个EntertheStore的链接时，将导航到大类别页面，要完成这个过程，需要执行一下步骤：

（1）设置链接，为“EntertheStore”添加链接，代码如下：

EntertheStore

（2）设置配置文件，在web.xml中添加如下代码：

IndexServlet

org.bzc.jpetstore.servlets.IndexServlet

IndexServlet

/index.do

（3）在src目录的org\bzc\jpetstore\servlets文件夹中新建名为IndexServlet的类，Servlet本身并没有处理业务数据，而是调用CategoryBiz类的相关方法操作，具体代码如下：

publicclassIndexServletextendsHttpServlet{

publicvoiddoGet（HttpServletRequestrequest,

HttpServletResponseresponse）

throwsServletException,IOException{

doPost（request,response）;}

publicvoiddoPost（HttpServletRequestrequest,

HttpServletResponseresponse）

throwsServletException,IOException{

CategoryBizcategorybiz=newCategoryBiz（）;

Stringtourl="";

//因为其他页面也需要获取大类别数据，所以存放于session中

HttpSessionsession=request.getSession（）;

//初始化一个List对象，用来存储大类别数据

Listlist=newArrayList（）;

try{

//调用业务对象获取数据

list=categorybiz.searchById（0,""）;

tourl="/catalog/Main.jsp";}

catch（Exceptione）{

tourl="index.html";

e.printStackTrace（）;}

session.setAttribute（"categroyList",list）;

request.getRequestDispatcher（tourl）.forward（request,response）;

}

}

（4）在src目录的org\bzc\jpetstore\biz文件夹中新建名为CategoryBiz的类，CategoryBiz与数据库进行相互。

此处需要查询的是所有的大类别数据，后面还需要根据大类别ID查询大类别数据，将这两部分整合，均由searchByld（）方法提供这个功能。

具体代码如下：

publicclassCategoryBiz{

ControlDBcontrolDB=null;

publicCategoryBiz（）{

controlDB=newControlDB（）;

}

publicListsearchById（intflag,Stringcatid）{

Stringsql="";

Listlist=newArrayList（）;

if（flag==0）{

sql="select*fromcategory";

}elseif（flag==1）{

sql="select*fromcategorywherecatid='"+catid+"'";

}

System.out.println（sql）;

try

{list=controlDB.executeQueryCategory（sql）;}

catch（Exceptione）

{e.printStackTrace（）;}

returnlist;

}

}

（5）编写封装与数据库操作的ControlDB类。

（6）编写main.jsp页面，它用来显示大类别数据。

main.jsp页面的部分代码如下：

……

forEachitems="${categroyList}"var="category">

path=show&categoryId=${category.catid}">

outvalue="${category.descn}"escapeXml="false"/>

${category.name}

forEach>

运行Tomcat,执行此部分操作，最终效果如图所示：

2、小类别显示,完成步骤同大类别显示

运行Tomcat,执行此部分操作，最终效果如图所示：

3、商品显示,完成步骤同大类别显示

运行Tomcat,执行此部分操作，最终效果如图所示：

4、添加商品到购物车

在商品的列表页面提供了添加到购物车的链接。

单击AddtoCart链接可以把与之对应的商品添加入购物车中。

要完成这个过程，需要执行一下步骤：

（1）设置链接，为商品添加链接，在商品上创建链接的代码如下：

path=addItemToCart&itemId=${item.itemid}&product”>

（2）设置配置文件，在web.xml中添加如下代码：

ItemServlet

org.bzc.jpetstore.servlets.ItemServlet

ItemServlet

/item.do

（3）在src目录的org\bzc\jpetstore\servlets文件夹中新建名为ProductServlet的类，Servlet本身并没有处理业务数据，而是调用ItemBiz类的相关方法操作，具体代码如下：

publicclassProductServletextendsHttpServlet{

publicvoidinit（）throwsServletException{}

publicvoiddestroy（）{}

publicvoiddoGet（HttpServletRequestrequest,

HttpServletResponseresponse）

throwsServletException,IOException{

doPost（request,response）;

}

publicvoiddoPost（HttpServletRequestrequest,

HttpServletResponseresponse）

throwsServletException,IOException{

Stringpath=request.getParameter（"path"）;

HttpSessionsession=request.getSession（）;

ListlistProduct=newArrayList（）;

ProductBizproductbiz=newProductBiz（）;

ItemBizitembiz=newItemBiz（）;

Stringtourl="";

if（"show".equals（path））{

StringproductId=request.getParameter（"productId"）;

try{

ListitemList=itembiz.searchByproductId（productId）;

Productproduct=（Product）productbiz.searchById（1,productId）

.get（0）;

session.setAttribute（"itemList",itemList）;

session.setAttribute（"product",product）;

}catch（Exceptione）{

e.printStackTrace（）;}

tourl="/catalog/Product.jsp";

}else{

listProduct=productbiz.searchById（0,""）;

tourl="index.html";

session.setAttribute（"listProduct",listProduct）;

}

request.getRequestDispatcher（tourl）.forward（request,response）;

}

}

（4）编写Cart.jsp页面，来显示购物车中的商品项数据，Cart.jsp页面的部分代码如下：

<<MainMenu

ShoppingCart

path=updateCartQuantities">

ItemIDProductIDDescriptionInStock?

QuantityListPriceTotalCost 

iftest="${cart.numberOfItems==0}">

Yourcartisempty.

if>

forEachitems="${cartItems}"var="cartitem">

path=show&itemId=${cartitem.item.itemid}">

${cartitem.item.itemid}

${cartitem.item.productid}

${cartitem.item.attr1}

${cartitem.item.attr2}

${cartitem.item.attr3}

${cartitem.item.attr4}

${cartitem.item.attr5}

${product.name}

${cartitem.inStock}

${cartitem.item.listprice}

${cartitem.total}

path=removeItemFromCart&workingItemId=${cartitem.item.itemid}">

forEach>

SubTotal:

${cart.subTotal}