
第5章 ASP综合应用实例
5.1 网上购物系统
5.1.1 应用系统设计分析
顾客到自选超市购物,通常是先浏览一下各种商品的品牌、介绍、价位,选中合意的物品后,将它们放入购物袋,然后继续挑选其他物品。等到物品选齐了,便到“收银台”付款。
网上购物的实现紧紧围绕着购物流程进行。首先,为了使商家能够将自己商场中的商品展现在顾客面前,需要建立一个数据库和一个商品清单页面。当顾客访问商品清单页面的物品时,服务器便搜索数据库中的商品信息,将搜索结果换成HTML文档后,随时返回给客户浏览。顾客按照页面上的商品清单开始挑选自己想买的商品并加入购物车,服务器必须逐一将顾客已经选择的商品信息存入商品信息缓冲区。Session变量是同一用户所有网页共用的对象,这一特性用来保存顾客的购物信息是最方便的。我们把利用Session变量记录顾客商品信息的网页变量,形象地称为“购物袋”。
顾客时常改变主意,不想买或想少买或不止买一件,随意增减购买数量,随意更改已购商品,也希望看看“购物袋”中商品总价格是多少。网上购物系统应该让顾客随心所欲,随时把“购物袋”中商品总价格算出来告诉顾客。购物完毕,应该请顾客填写相关信息。如:姓名、电话、住址、付款方式、交货方式等,服务器将提交的信息存入数据库,完成一次完整的网上购物过程。最后商家将在后台读取数据库中顾客的购物信息,根据顾客的要求进行个性服务。当然,作为完整的网上购物系统还应该具有系统的后台管理程序,包括商品信息更新录入、系统权限管理、系统安全维护、顾客购物信息分析等。
网上购物程序具体设计大致可采取以下步骤:存放商品信息的数据库数据表用来保存商品类别、名称、简介等字段信息,商品详细信息用另外网页单独存放,供购物时通过单击商品清单中的“信息简介”链接来显示,实现图文并茂;“购物袋”信息的保存,是通过Session对象来实现的;商品类别可设计一个数据库数据表专门存放,通过程序解决所有商品网页的分类问题。
5.1.2 数据库设计
“网上商城”的数据库使用Access数据库,数据库名为ShopBag.mdb。它包含3个数据表:Category商品分类表、Products商品信息表、Buyinformation顾客信息表。数据表结构分别如表5.1.1、表5.1.2、表5.1.3所示。其中Products商品信息表中的Link字段是考虑到当商品的图片、文字信息大且需要动态更新时,另外制作商品详细内容的专门网页让顾客进一步浏览。Category数据表与Products数据表的数据记录将由商家管理员通过系统管理入口页面进行录入更新,而Buyinformation数据表的数据记录则由顾客填单提交,自动生成。
表5.1.1 Category商品分类表

表5.1.2 Products商品信息表

表5.1.3 Buyinformation顾客信息表

数据库ShopBag.mdb的ODBC数据源的创建采用在程序代码中使用全路径DSN方式建立数据源,即程序中直接指定用Access数据库ODBC驱动程序名来建立数据库的链接。
5.1.3 前台购物功能页面设计
(1)“网上购物商场”主页设计。
这个网页提供了“书籍课本”“学习用品”“数码产品”3种分类商品的网页链接和系统管理功能链接。页面设计如图5.1.1所示,该页面程序代码见5.1.5节Main.asp程序代码。
(2)商品选购网页设计。
当顾客选择某一类商品链接后即转入该类商品购物网页,该页面应提供详尽的选购物品清单,方便顾客在商品的“挑选”栏选购,和“放入购物袋”。页面设计如图5.1.2所示。该页面程序代码见5.1.5节Buy.asp程序代码。

图5.1.1 网上购物商场主页

图5.1.2 购物界面
(3)“购物袋”查看与商品增减认购页面设计。
顾客单击“查看购物袋”,则进入查看和认购页面。顾客可以随意更改购买数量,可以清除购物袋,可以另选其他类的商品网页(包括“计算机必读教材”“中学生学习用品”“数码与电子产品”)等,也可以结束购买,填写顾客信息。页面设计如图5.1.3所示。该页面程序代码见5.1.5节Check.asp程序代码。

图5.1.3 查看购物袋与认购界面
5.1.4 后台系统管理程序设计
系统的后台管理程序包括商品信息更新录入、系统权限管理、系统安全维护、顾客购物信息分析等,通过输入管理员权限密码进入系统管理与维护。管理入口界面如图5.1.4所示。

图5.1.4 系统管理入口界面
5.1.5 程序模块设计
(1)“网上购物商场”主程序Main.asp源程序代码。


(2)共用子程序的Util.asp源程序代码。

(3)“购物界面”Buy.asp源程序代码。


(4)“放入购物袋”Add.asp源程序代码。


(5)“查看购物袋”Check.asp源程序代码。


(6)“完成购物”BuyFinish.asp源程序代码。


(7)“退回所有物品”Clear.asp源程序代码。

(8)“购物袋”没有任何商品时显示的Nothing.asp源程序。
