第10章网上购物商城要点分析.pptVIP

JSP+MySQL+Dreamweaver动态网站开发案例教程  机械工业出版社同名教材 配套电子教案 * * 一 网站的规划 二 数据库设计 定义网站与设置数据库连接 网上购物商城主页面的制作 五 购物流程设计 六 账户管理设计 第10章 网上购物商城 10.1.1 网站结构 网上购物商城的网站结构示意图如图10-1所示，主要包括商品展示页面与购物流程页面，网站的首页为index.jsp。 10.1 网站的规划 10.1.2 页面设计 本案例所介绍的网上购物商城的页面包括在线购物首页、商品订购、查看购物车、填写送货地址、确认订单以及账户管理等15个页面，见表10-1。 10.1 网站的规划 10.2.1 还原数据库 1．复制数据库文件夹到MySQL的数据库文件夹 打开案例所在的文件夹，将数据库文件夹news复制到MySQL的数据库文件夹data下，即完成了数据库的还原。 2．在phpMyAdmin中查看数据库中的表 已经还原的数据库esale，如图10-3所示。 10.2 数据库设计 10.2.2 数据表的结构 1．表custmers的结构 这个表用来存储购物网站上的客户数据的，本表的主键是cust_id（客户编号），并设置为自动编号auto_increment，表的结构如图10-5所示。 10.2 数据库设计 10.2.2 数据表的结构 2．表products的结构 这个表用来存储网站上的产品数据，所有字段的命名都以“prod_”为前缀。本表的主键是prod_id（产品编号），并设置为自动编号auto_increment，表的结构如图10-6所示。 10.2 数据库设计 10.2.2 数据表的结构 3．表orders的结构 这个表用来存储网站上的订单数据，所有字段的命名都以“ord_”为前缀。本表的主键是ord_id（订单编号），并设置为自动编号auto_increment，表的结构如图10-7所示。 10.2 数据库设计 10.2.2 数据表的结构 4．表orderdetails的结构 这个表用来存储网站上的订单明细数据，本表的主键是ord_detailid（订单明细编号），并设置为自动编号auto_increment，表的结构如图10-8所示。 10.2 数据库设计 接下来要在Dreamweaver中定义一个JSP网站，设置本地文件夹、测试服务器和数据库的连接，见表10-2。 10.3 定义网站与设置数据库连接 完成了网站的定义后，需要设置网站与数据库的连接，才能在此基础上制作出动态页面。 10.3 定义网站与设置数据库连接 首先，要制作购物商城的首面index.jsp。这个页面用于显示所有产品的清单。用户可以单击产品名称或立即购买按钮链接到产品的订购页面，其版面设计如图10-14所示。 10.4 网上购物商城主页面的制作 10.5.1 产品订购页面的制作 本节讲解的是制作产品订购页面shopping.jsp，该页面的主要功能是显示商品的详细说明与放大的图片展示，同时也为客户提供订购此商品的链接，其版面设计如图10-33所示。 10.5 购物流程设计 10.5.2 会员登录页面的制作 基于网络及数据安全的考虑，目前的购物网站都必须要加入会员，才能进行购物的事宜。当浏览者在商品订购页面中单击“立即购买”按钮时，系统会判断用户是否已经登入系统，如果尚未登入就必须转到会员登录页面login.jsp确认身份。会员登录页面的版面设计如图10-51所示。 10.5 购物流程设计 10.5.3 购物车页面的制作 在确认了会员身份后，就进入了检查购物车内容的页面chart.jsp。该页面中需要确认商品购买的数量或是否取消某种商品的选购，其版面设计如图10-58所示。 10.5 购物流程设计 10.5.4 填写邮寄信息页面的制作 填写邮寄信息页面sendinfo.jsp的主要功能是确认送货数据是否正确，其版面设计如图10-92所示。 10.5 购物流程设计 10.5.5 购物结账确认页面的制作 页面checkout.jsp的功能是再次确认是否要进行交易，其版面设计如图10-99所示。 10.5 购物流程设计 *