1、项目搭建1 导入原型只有前端页面，但没有后端代码的项目。即一个只有页面但没有功能的项目！导入原型： 创建一个 web 项目，命名为 goods； 把原型的 webroot 和 src 两个目录 copy 到 goods 中，覆盖原有的文件夹； 把 goods 发布到 tomcat 上，打开浏览器，访问主页。2 前台需求分析前台是针对会员购书，而后台是管理员管理系统并完成售书。2.1 前台主页/index.jsp 使用转发到/jsps/main.jsp,、main.jsp 中只有一个 ，结构如下：main.jsp(1)ITCAST 网上书城用户名：张三 我的购物车 我的订单 修改密码 退出(3)
2、搜索图书 高级(2)图书分类(4)欢迎信息中各个部分使用的是完成的框架页。(1)：/jsps/top.jsp；(2)：/jsps/left.jsp；(3)：/jsps/searchj.jsp ；(4)：/jsps/body.jsp在(1)、(2)、(3)部分都存在超链接或表单，无论点击哪个超链接（或提交表单）都会在(4)部分显示。2.2 模块划分系统分为如下模块： 用户模块 分类模块 图书模块 购物车模块 订单模块2.3 前台用户模块用户模块功能有： 注册 激活 登录 修改密码 退出2.4 前台分类模块分类模块功能有： 显示所有分类；2.5 前台图书模块前台图书模块功能有： 分页查看指定分类的
3、图书； 分页查看指定名称的图书； 分页查看指定条件的图书； 查看图书详细信息。2.5 购物车模块购物车模块功能有： 向车中添加条目； 查看我的购物车； 修改条目数量； 删除条目； 批量删除条目；2.6 前台订单模块前台订单模块功能有： 生成订单； 查看我的订单； 查看订单详细信息； 取消订单； 确认收货； 支付订单；3 后台需求分析后台是管理员管理系统，以售书功能。3.1 后台主页(1)ITCAST 网上书城后台管理管理员：张三 退出 分类管理 图书管理 订单管理(2)欢迎图片与前台主页一样，使用框架页。3.2 管理员模块管理员模块功能有： 管理员登录； 管理员退出；3.3 后台分类管理后台分
4、类管理功能有： 查看所有分类； 添加一级分类； 添加二级分类； 编辑一级分类； 编辑二级分类； 删除一级分类； 删除二级分类；3.4 后台图书管理(1)ITCAST 网上书城后台管理用户名：张三 我的购物车 我的订单 修改密码 退出(2)图书分类 添加图书 高级搜索后台图书管理功能有： 分页查看指定分类的图书； 分页查看指定条件的图书； 添加新图书； 编辑图书； 删除图书；3.5 后台订单管理后台订单管理功能有： 分页查看所有订单； 分页查看指定状态的订单； 查看订单详细信息； 订单发货； 取消订单；4 数据模型设计根据需求分析，得到如下实体： User：会员； Category：图书分类；
5、Book：图书； CartItem：购物车条目； Order：订单； OrderItem：订单条目； Admin：管理员。4.1 t_user 表列名 列类型 描述uid char(32) 主键loginname varchar(50) 会员登录名loginpass varchar(50) 会员登录密码email varchar(50) 邮箱地址status boolean 是否已激活activationCodechar(64) 激活码4.2 t_category 表列名 列类型 描述cid char(32) 主键cname varchar(50) 图书分类名称pid char(32) 外键，
6、相对本表的 cid，表示父分类 id。desc varchar(100) 分类描述orderBy int 分类序号，用来排序。4.3 t_book 表列名 列类型 描述bid char(32) 主键bname varchar(200) 图书名称author varchar(50) 图书作者price decimal(8,2) 定价currPrice decimal(8,2) 当前价discount decimal(3,1) 折扣press varchar(100) 出版社edition int 版次pageNum int 页数wordNum int 字数printtime char(10) 印
7、刷时间booksize int 开本paper varchar(50) 纸质cid char(32) 所属分类 idimage_w varchar(100) 大图路径image_b varchar(100) 小图路径orderBy int 序号4.4 t_cartitem 表列名 列类型 描述cartItemIdchar(32) 主键quantity int 数量bid char(32) 图书 iduid char(32) 当前会员 idorderBy int 序号4.5 t_order 表列名 列类型 描述oid char(32) 主键ordertime char(19) 下单时间total
8、 decimal(10,2) 合计金额status int 订单状态：1 未付款、2 未发货、3 未收货、4 交易成功、5 已取消address varchar(1000) 收货地址uid char(32) 当前会员 id4.6 t_orderitem列名 列类型 描述orderItemIdchar(32) 主键quantity int 数量subtotal decimal(8,2) 金额小计bid char(32) 图书 idbname varchar(200) 图书名称currPrice decimal(8,2) 当前价image_b varchar(100) 小图路径oid char(3
9、2) 所属订单 id4.7 t_admin列名 列类型 描述adminId char(32) 主键adminnamevarchar(50) 管理员登录名adminpwd varchar(50) 管理员密码5 项目框架5.1 导包项目所需要导什么包，要从项目所使用的工具来计算。本项目需要使用工具如下： c3p0； commons-beanutils； commons-dbutils； commons-fileupload； commons-fileupload.jar; javamail； Log4J； mysql-connector； itcast-tools。5.2 配置文件本项目使用了 C
10、3P0 数据库连接池，所以需要在 src 下配置 c3p0-config.xml 文件。模板如下：c3p0-config.xmljdbc:mysql:/localhost:3306/goodscom.mysql.jdbc.Driverroot1233102105.3 建包包名的结构一般为：公司域名.项目名.模块名称.分层名称。本项目的包大致如下： cn.itcast.goods.user.domain； cn.itcast.goods.user.dao； cn.itcast.goods.user.service； cn.itcast.goods.user.web.servlet； cn.itc
11、ast.goods.category.doamin； cn.itcast.goods.category.dao； cn.itcast.goods.category.service； cn.itcast.goods.category.web.servlet； cn.itcast.goods.book.domain； cn.itcast.goods.book.service； cn.itcast.goods.book.web.servlet； cn.itcast.goods.cart.domain； cn.itcast.goods.cart.dao； cn.itcast.goods.cart.se
12、rvice； cn.itcast.goods.cart.web.servlet； cn.itcast.goods.order.domain； cn.itcast.goods.order.dao； cn.itcast.goods.order.service； cn.itcast.goods.order.web.servlet； cn.itcast.goods.web.filter； cn.itcast.goods.admin.admin.domain； cn.itcast.goods.admin.category.web.servlet； cn.itcast.goods.admin.book.w
13、eb.servlet； cn.itcast.goods.admin.order.web.servlet。5.4 JQuery 异步请求本项目的页面中使用 JQuery 来完成表单的校验，而且还使用了 JQuery 的 AJAX。这里简单回顾一下使用 JQuery 发送异步请求的过程。使用 JQuery 发送异步请求最为灵活的方法是 ajax()方法，该方法只有一个参数，参数为一个 JSON 对象，下面来看看这个对象的属性。 async：默认为 true，表示发送异步请求。 beforeSend：函数类型。该函数会在发送请求前被调用，可以用来设置自定义的HTTP 报头。该函数有一个参数为 XML
14、HttpRequest 类型，我们可以使用它完成底层 AJAX 的设置，如果该函数返回 false，那么当前请求会被取消。 cache：默认为 true，表示是否在浏览器缓存中加载信息。当 dataType 为 script 时，该属性为 false。 complete：函数类型，无论请求是否成功，当请求结束时调用它。该函数有两个参数，function (XMLHttpRequest, textStatus)。 contentType：默认为 application/x-www-form-urlencoded，一般无需修改该属性。 data：请求参数，格式为key1:val1,key2:val
15、2。如果 val 为数组那么会被转换为多个参数，例如key:val1,val2转换为 key=val1if(name) $.ajax(async: false,cache: false,type: “POST“,dataType: “json“,url: “,data: method: “findByName“, name: name,success: function(person) $(“#person“).text(person.pid + “, “ + person.name + “, “ + person.age + “, “ + person.birthday););););请输入
16、姓名：Comment q9: 因为请求服务器时指定 method参数值为 findByName，所以就会调用本方法Comment q10: 获取 name参数值Comment q11: 把 Person对象转换成 json对象Comment q12: 发送给客户端public class AjaxServlet extends BaseServlet public String findByName(HttpServletRequest request, HttpServletResponse response)throws ServletException, IOException Stri
17、ng name = request.getParameter(“name“);PersonDao dao = new PersonDao();try Person person = dao.findByName(name);StringBuilder sb = new StringBuilder();sb.append(“);sb.append(“pid“:“).append(“).append(person.getPid().append(“,“);sb.append(“name“:“).append(“).append(person.getName().append(“,“);sb.app
18、end(“age“:“).append(“).append(person.getAge().append(“,“);sb.append(“birthday“:“).append(“).append(person.getBirthday().append(“);sb.append(“);response.getWriter().print(sb); catch (SQLException e) throw new RuntimeException(e);return null;6 页面结构6.1 目录介绍在 WebRoot 下有很多文件夹，下面我们对这些文件夹进行介绍： adminjsps：后台
19、管理 jsp 页面； bank_img：银行图片，在线支付时，会员需要选择支付的网银，这个页面需要显示这些图片； book_img：每本书都要有大图和小图，图书的图片都在这个文件夹中； css：公共 css 样式文件； images：按钮图片； jquery：jquery 的源代码； js：公共 js 脚本； jsps：前台会员购书 jsp 页面； menu：javascript 小工具，在前台首页的左部就是使用的这个小工具来显示图书分类的。6.2 jsps 目录介绍jsps 目录下是前台页面：index.jsp 中只有一条语句，使用标签转发到 /jsps/main.jsp。而 main.jsp 页面是框架页，分为上、左、高级、中三个部分。分别对应：top.jsp、 left.jsp、gj.jsp、body.jsp。其中 book、cart、order、user 目录中分别对应各自模块的页面； pager 是分页页面，使用分页的页面会使用指令包含分页页面。js 和 css 目录下又分为 book、cart、order、user 目录：对应不同页面的 css 和 js 文件。7 添加过滤器添加编码过滤器！web.xmlEncdoingFiltercn.itcast.filter.EncodingFilterEncdoingFilter/*
