AJAX购物网站文档.docx
《AJAX购物网站文档.docx》由会员分享，可在线阅读，更多相关《AJAX购物网站文档.docx（26页珍藏版）》请在冰点文库上搜索。
AJAX购物网站文档
AJAX购物网站设计文档
一、要实现的功能
用户访问网站时，如未登陆成用户，则只可以查看网站中的商品信息不能购买商品。
注册为会员并登陆后，可以购买指定数量的商品，购买完所有商品后，用户可调用结帐功能对所购买的商品进行结帐，在整个购买过程中，用户所购买的商品放在虚拟购物车中，并未记录数据库中。
二、AJAX技术在本例中的作用
实现动态无刷新的页面效果，即通过动态改变页面中层的内容改变页面的内容。
三、数据库模型设计
图3-1数据库模型图
描述：
编号
库表名称
描述
1
ngwc_commodities
商品信息表
2
ngwc_operlog
用户操作记录，存购买信息
3
ngwc_user
用户表
4
ngwc_type
用户类型表
四、类的设计
1.持久化类的设计
图4-1持久化类类图
描述：
编号
类名
描述
1
NgwcCommodities
商品信息类
2
NgwcOperlog
用户购买信息类，存购买信息
3
NgwcUser
用户信息类
4
NgwcType
用户类型类
说明：
持久化类的每个类的属性都有其对应的setter和getter方法,Hibernate通过持久化类可进行数据库的操作。
2.虚拟购物车类的设计
图4-2虚拟购物车类类图
描述：
编号
类名
描述
1
Cart
虚拟购物车类
2
BeanItems
购物车中存放的每一个商品
3.数据库操作类的设计
图4-3数据库操作类类图
描述：
编号
类名
描述
1
Dao
数据库操作类
2
DaoImpl
数据库操作类的接口，定义的数据库操作类中实现在方法
Dao类中实现的方法说明：
ListshowAllComms（intstart）;//按分页得所有商品
ListshowFindComms（Stringcommname,intstart）;//按查找得所有商品
intgetPages（）;//得所有商品总页数
intgetFindCommsPages（Stringcommname）;//得查找的商品个数
voidaddUser（NgwcUseruser）;//向数据库添加一个用户
NgwcUsergetUserInfo（Stringusername,Stringpassword）;//通过用户名和密码得到用户信息
publicListgetUserLogs（NgwcUseruser）;//得到当前用户的购买记录
publicbooleanexistUser（Stringusername）;//是否存在用户
booleanexistUser（Stringusername,Stringpassword）;//是否存在该用户名及密码对应的用户
publicvoidsaveLogs（NgwcOperloglogs）;//保存logs
publicvoidupdateComms（NgwcCommoditiescomm,intnum）;//更新商品信息
publicvoidupdateUser（NgwcUseruser）;//更新用户信息
publicbooleanregistUser（NgwcUseruser）;//添加一个用户
五、功能实现
1.注册功能实现
功能说明：
用户点击首页中的注册链接后，页面中显示注册层供用户填写注册信息，当用户输入新注册的用户名时，ajax调用后台名为checkUser的servlet判断是否存在同名用户，并返回判断的信息；当用户输入密码和确认密码时，判断密码是否和确认密码相同；若以上两个条件同时满足，注册按钮可用，否刚，注册按钮不可用。
完成输入信息后，点击注册按钮进行用户注册操作，注册操作完成后，系统自动为用户完成登陆操作并返回首页。
图5-1-1注册功能活动图
图5-1-2注册功能顺序图
描述：
编号
名称
类型
描述
1
Index.jsp
页面文件
首页页面
2
ajax.js
Js文件
存放所有的javascript函数
3
checkUser
Servlet
检察是否存在同名用户
4
RegistAction
Action
点击注册按钮后提交到的页面
5
Session
Session对象
当前用户的session
6
Dao
类
数据库操作类
2.登陆功能实现
功能说明：
用户点击完登陆链接后，在页面中显示登陆层用户输入完用户名和密码后点击登陆按钮完成登陆操作。
图5-2-1登陆功能活动图
图5-2-2登陆功能顺序图
编号
名称
类型
描述
1
Index.jsp
页面文件
首页页面
2
ajax.js
Js文件
存放所有的javascript函数
3
login
Servlet
执行登陆操作
4
Session
Session对象
当前用户的session
5
Dao
类
数据库操作类
3．显示所有商品功能实现
功能说明：
根据是否已经登陆判断每一项商品的购买按钮是否可用，根据用户请求的页数从数据库中查询出数据，生成数据集合，根据按钮可用信息及数据集合生成页面信息并回传显示。
图5-3-1显示所有商品活动图
图5-3-2显示所有商品顺序图
描述
编号
名称
类型
描述
1
Index.jsp
页面文件
首页页面
2
ajax.js
Js文件
存放所有的javascript函数
3
ShowAllComms
Servlet
执行显示所有商品操作
4
Session
Session对象
当前用户的session
5
Dao
类
数据库操作类
4.显示所有查找的商品
功能说明：
根据是否已经登陆判断每一项商品的购买按钮是否可用，根据用户请求的页数及需要查询的商品名称从数据库中查询出数据，生成数据集合，根据按钮可用信息及数据集合生成页面信息并回传显示。
图5-4-1显示所有查找商品活动图
图5-4-2显示所有查找商品顺序图
描述
编号
名称
类型
描述
1
Index.jsp
页面文件
首页页面
2
ajax.js
Js文件
存放所有的javascript函数
3
ShowFindComms
Servlet
执行显示所有查找商品的操作
4
Session
Session对象
当前用户的session
5
Dao
类
数据库操作类
5.
购买商品
功能说明：
用户在购买商品时，首先输入要购买的商品数量，如果要购买的商品数量大于库存的数量则不能执行购买操作，输入正确的数量后点击购买按钮执行购买操作，将用户购买的商品信息通过ajax传给后台servlet进行操作，完成购买操作后，session中用户信息的用户帐户余额根据用户的折扣率及购买商品的金额减去相应的数值，用户购买的商品信息将存入虚拟购物车实例。
最后在首页中显示。
图5-5-1购买商品时序图
描述
编号
名称
类型
描述
1
Index.jsp
页面文件
首页页面
2
ajax.js
Js文件
存放所有的javascript函数
3
Buy
Servlet
执行购买商品操作
4
Session
Session对象
当前用户的session
图5-5-2购买商品活动图
6.从购物车中删除商品
功能说明：
当用户想要从购物车中删除所买商品时，在首页左下方单击相应商品的”删除”链接，转向DeleteFromCart并传要删除的商品id，该Servlet负责将购物车实例从session中取出，将用户指定id的商品从购物车中删除最后，将购物车存回session并转回首页。
图5-6-1从购物车中删除商品活动图
图5-6-2从购物车中删除商品顺序图
描述
编号
名称
类型
描述
1
Index.jsp
页面文件
首页页面
2
DeleteFromCart
Servlet
执行删除操作的Servlet
3
Session
Session对象
当前用户的session
7.确认购买操作
功能说明：
当用户购买完商品后，执行购买操作，结帐当前购物车，修改当前用户余额，修改库存余额，将购买记录存进数据库中。
图5-7-1确认购买操作活动图
图5-7-2确认购买操作顺序图
描述
编号
名称
类型
描述
1
Index.jsp
页面文件
首页页面
2
ajax.js
Js文件
所有的javascript函数文件
3
BuyComms
Servlet
执行确认购买操作
4
Session
Session对象
当前用户的session
5
Dao
类
数据库操作类
附录
1.AJAX分页显示原理：
用户点击要显示的页数链接后，调用相应的ajax处理函数，该函数将页数作为参数传递给后台servlet进行处理，在该后台servlet中，将根据页数信息对数据进行加工，从数据库中取出对应页上应该显示的商品信息，根据页面生成规则生成html页面代码，并将这些代码回传出去，ajax的接收处理函数接收到页面代码后，调用相应标记的innerHTML方法改变显示的内容完成分页显示操作。
图附录-1
2．虚拟购物车类代码分析
Cart类：
购物车类
packagecom.mjpc.util;
importjava.util.Collection;
importjava.util.HashMap;
importjava.util.Iterator;
importcom.mjpc.data.NgwcCommodities;
publicclassCart{
privateintNumOfCart;//购物车中的商品总数
HashMapcart;//购物车中的商品集合,其各个项目以BeanItem类对象形式存在
Stringcartid;/*购物车的id号，本例中并没有使用，其它应用中可用其作为商
品的订单号（可通过sessionid或其它方式获取）*/
publicCart（）{//购物车类的构造方法，初始化一个购物车
NumOfCart=0;
cart=newHashMap（）;
cartid="";
}
publicHashMapgetCart（）{
returncart;
}
publicvoidsetCart（HashMapcart）{
this.cart=cart;
}
publicStringgetCartid（）{
returncartid;
}
publicvoidsetCartid（Stringcartid）{
this.cartid=cartid;
}
publicintgetNumOfCart（）{
returnNumOfCart;
}
publicvoidsetNumOfCart（intnumOfCart）{
NumOfCart=numOfCart;
}
publicvoidaddItem（Integerid,NgwcCommoditiescomm,intnum）{//向购物车中添加一个商品
//如果购物车中没有当前id的商品则新添加一个商品项目，购物车商品数量加一
if（!
this.cart.containsKey（id））{
BeanItemsitem=newBeanItems（comm,num）;
this.cart.put（id,item）;
this.NumOfCart++;
}else{
//如果当前购物车中存在当前id的商品则在原有项目的基础上购买数量更新购物车
BeanItemsitem=（BeanItems）cart.get（id）;
item.setItemNum（item.getItemNum（）+num）;
this.cart.put（id,item）;
}
}
publicvoidremoveItemByNum（intid）{
//删除购物车中key为id的项目，购物车中商品数量减一
if（this.cart.containsKey（id））{
this.cart.remove（id）;
this.NumOfCart--;
}
}
publicCollectiongetAllItems（）{//得到购物车中的所有商品
returnthis.cart.values（）;
}
publicdoublegetSum（）{//得到购物车中商品的总价格
doublesum=0;
Iteratorit=this.cart.values（）.iterator（）;
while（it.hasNext（））{
BeanItemsitem=（BeanItems）it.next（）;
sum+=item.getItemPrice（）;
}
returnsum;
}
}
BeanItems类：
购物车中的商品以BeanItems对象的形式存储
packagecom.mjpc.util;
importcom.mjpc.data.NgwcCommodities;
publicclassBeanItems{
privateintitemNum;//当前商品的购买数量
privateNgwcCommoditiescomm;//购买的具体的商品
privatedoubleitemPrice;//当前商品的价格（数量*单价）
publicBeanItems（）{//初始化一个购物车中的商品
itemNum=0;
comm=newNgwcCommodities（）;
}
publicNgwcCommoditiesgetComm（）{
returncomm;
}
publicvoidsetComm（NgwcCommoditiescomm）{
m=comm;
}
publicintgetItemNum（）{
returnitemNum;
}
publicvoidsetItemNum（intitemNum）{
this.itemNum=itemNum;
}
publicBeanItems（NgwcCommoditiescomm,intnum）{//通过购买的商品和购买的数量初始化一个商品
this.itemNum=num;
m=comm;
}
publicdoublegetItemPrice（）{//得到当前商品价格（数量*单价）
doubletotalPrice=0;
//保留小数点后两位小数
totalPrice=comm.getPrice（）*itemNum*100;
totalPrice=Math.round（totalPrice）/100.0;
returntotalPrice;
}
}
升级会员 