电子商务网站建设实验报告书.doc

电子商务网站建设教学实习报告书1.系统规划该电子商务网站能够帮助企业实现网上宣传、网上销售等功能。经过系统调查，从方案可行性、经济可行性、技术可行性、社会环境等方面论述，确定本次实习，结合电子商务网站特点以及从上述几点考虑，本次实习要实现电子商务网站中的商品介绍功能、商品查询功能和在线销售功能。2.系统总体设计内容要求：1. 功能设计：绘制电子商务网站的总体设计图。用程序处理流程图表示电子商务网站的功能模块的处理流程。2. 数据库设计：根据关系型数据库设计理论，画出整个数据库的E-R图，建立数据库db2.mdb。总体设计例图如下所示：程序处理流程例图如下：数据库的E-R例图如下：3.系统设计内容要求：画出各模块程序流程图：要求应用规定符号画出商品信息显示、商品信息查询、购物车以及收银台这四项功能程序处理流程图。提示：1 程序流程图的作用 程序流程图是人们对解决问题的方法、思路或算法的一种描述。 流程图的优点：（a）采用简单规范的符号，画法简单； （b）结构清晰，逻辑性强； （c）便于描述，容易理解。 2 流程图采用的符号 （1）起始框 （2）终止框 （3）执行框 （4）判别框 （5）进程框（6）数据框流程图例图如下：4.系统实施1. 工作计划及时间安排6月6号到6月10号 每天按照老师给任务完成代码的翻译，并熟悉网上商城的购物流程分析6月11号到6月13号 建立数据库，和对自己网上商城网站的规划 6月14号到6月15号 按照上一星期自己对网上商城的流程分析，进行网站的建设，开始是对数据库的建设和管理，后来进行网页的设计和修改6月16号 进行对网站的测试和运营管理2. 具体实施过程1）设计实现Products展示页面利用Dreamweaver设计实现Products展示页面，并对页面中的主要模块进行描述，例如商品查询功能模块，描述它的页面属性，以及对它的控件响应事件进行说明。商品展示页面涉及数据库中的商品表Products、商品搜索页面Search.asp和商品展示页面Products.asp的设计。为提高页面的设计效率和代码的重用性，考虑使用包含文件，包括xptop.asp、copyright_shopxp.asp、Conn.asp个包含文件。数据设计可参考下表products表包含文件设计包含文件设计是指可以包含在其他页面中的文件。如果一个程序代码段可能会多次出现在其他页面中不妨将其保存为扩展名为.inc的包含文件。当某个页面中需要插入该代码段的时候即可使用如下形式包含进来。不仅扩展名为.inc可以包括到当前页面中，扩展名为.html或.asp的文件也都可以用此方式包含进来。本网站中共涉及head.inc、Foot.inc、Conn.inc3个包含文件。本网站所展示的各类商品中，其网页头部显示信息通常相同，故可设计head.inc来保存这一部分代码，然后被其他网页调用。Head.inc头文件源代码如下：商品展示tdColor:#15007B;Font-Size:12px;Line-Height:18pxa:linkColor:#CC0000;Font-Size:12px;Text-Decoration:nonea:visitedColor:#CC0000;Font-Size:12px;Text-Decoration:nonea:hoverColor:#FF6600;Font-Size:12px; text-decoration:none新世纪商城 影视音乐书籍化妆IT礼品首页>>在同一网站各个页面的结尾，通常需要显示一些相同的网站授权、经营许可证及网站联系人等信息。于是也可通过统一的文件来保存这些代码Foot.inc，以便需要时方便地插入到网页的尾部。Foot.inc脚本文件源代码如下：Copyright 2011.  All rights reserved.新世纪商城 版权所有网上销售经营许可证 京证XX0018号对于一个网站来讲，其中许多页面都要使用到数据库，需要与数据库建立连接，以便能够打开其中所需的表进行操作。因此可建立独立文件来保存与数据库db2.mdb连接的代码，文件名为Conn.inc。Conn.inc源代码为： Products.asp商品展示页面主要用于商品信息的显示，将db2数据库中的Products表中的信息展示出来。展示的效果如下：在该页面需通过包含头部文件Head.inc显示网站的名称，并提供到其他各类产品展示页面的链接。然后再将搜索页面包含进来，如果客户在填写了搜索关键字，需将搜索结果在本页面显示出来。然后逐行显示产品信息，包括图片、价格、产品描述等信息。本页面的参考代码如下： %建立Recordset对象实例并打开Product表Set rs=Server.CreateObject(ADODB.Recordset)rs.OpenProducts,Conn,2,2Dim Key,Picture,ID,Name,PriceKey=Request(SearchKey)If KeyThen rs.Filter=ProductName Like % & Key & % Or ProductDescription Like % & Key & %End IfIf rs.EOF And rs.BOF Then Response.Write没有搜索到任何商品!Elsers.MoveFirst利用循环语句输出rs记录集中每一条记录的内容While Not rs.EOF Picture=trim(rs(ProductPicture)ID=trim(rs(ProductID)Name=trim(rs(ProductName)Price=trim(rs(ProductSalePrice)Response.WriteResponse.WriteResponse.Write&Response.WriteResponse.Write rs(ProductName)&Response.Write 市场价：&rs(ProductPrice)&元Response.Write优惠价：&rs(ProductSalePrice)&元Response.WriteResponse.Write>>购买Response.WriteResponse.Write rs(ProductDescription)&Response.Writers.MoveNextWendEnd Ifrs.closeSet Conn=Nothing%在该页面通过包含头部文件Head.inc显示网站的名称，并提供到其他各类产品展示页面和首页的链接。程序通过 调用数据库。商品搜索区，根据客户输入的搜索关键字启动商品搜索程序，并将搜索到的商品极其信息展示在本页面，如果没有搜索到该产品，则会提示“没有搜索到任何商品! ”产品展示区，可以显示每个产品的图片、名称、市场价、优惠价、产品描述等。 2）商品查询页面利用Dreamweaver设计实现商品查询页面，并对页面中的主要模块进行描述，描述它的页面属性，同时对它的控件响应事件进行说明。一般网站均允许客户通过输入与商品有关的关键字来搜索所需的商品，本网站设计时应通过search.asp页面来收集客户输入的关键字，然后打开有关的商品表借助SQL语句的模糊查询功能实现对商品的搜索，然后将搜索的结果展示出来。Search.asp页面的参考代码如下：商品搜索 商品搜索 关键字：     3）购物车页面设计利用Dreamweaver设计实现购物车页面，并对页面中的主要模块进行描述，描述它的页面属性，以及对它的控件响应事件进行说明。购物车页面设计时购物网站最为重要的页面程序设计。在本次实践网站中，客户在商品展示页面浏览商品时，只需用鼠标点击所选商品旁的“购买”字样链接即可将该商品放入自己的购物车。购物车页面所要实现的功能实际上是负责将客户选定的商品及该商品有关的信息保存到网站数据库相应的表中，同时在网页上显示当前客户已购买各项商品的名称、单价、数量和金额等。除此之外，当客户去收银台时，通常需要根据购物车中保存的这些信息来自动生成对应的商品订单。在购物车设计页面时，要保存客户选择购物商品的信息以及客户信息，这里一般通过以下3种方式解决将当前客户及所购商品信息保存在客户端的Cookie中。将当前客户及所购商品信息保存在服务器端的Session变量中。将当前客户及所购商品信息保存在服务器端的数据库中。本次实践实例中使用第3种方式来保存客户及购物车中的信息，包括两个表Carts和CartItems两个数据表。其中：Carts表的主要功能是用来自动为每个客户分配一辆购物车，并保存购物车的编号及购物日期信息；CartsItems表则用来保存每辆购物车中每一件商品的编号、名称、单价和数量等购物明细信息。Carts表和CartItems表的结构分别如下表放入购物页面设计本网站购物车功能的实现是由添加商品页面AddItem.asp和购物车页面Cart.asp两个程序来完成。其中AddItem.asp页面的功能是：当客户在商品展示页面中选中某项商品并点击其旁边的“购买”字样而激活AddItem.asp页面后，该页面首先判断这个客户是否已经有了购物车（即该客户是否为进入本网站后的第一次购物），若还没有购物车就为其新分配一辆（即为该客户在Carts表中自动产生一个新的购物车编号），并且将新分配的购物车编号CartID保存到该客户本次会话的Session变量中；若这个客户已经有购物车，则从Session变量中获取这个购物车编号。在此之后，AddItem.asp页面还需负责将客户所购商品标明为此购物车编号后存入购物车明细表CartItems之中，最后再调用购物车页面Cart.asp显示该客户购物车中已购商品的详细内容。AddItem.asp页面源代码如下：显示购物车页面设计在本网站中，显示当前客户的购物车中已购商品的各项信息是由购物车页面Cart.asp来完成。在该页面中还可以为客户提供修改已订购物品数量、重新计算的功能，并提供转去“继续购物”或“去收银台“结账的超级链接。页面截图如下Carts.asp源代码如下：tdColor:#15007B; font-size:18px; line-height:24pxa:link color:#CC0000; font-size:18px; text-decoration:nonea:visited color:#CC0000; font-size:18px; text-decoration:nonea:hover color:#FF6600; font-size:18px; text-decoration:blink购物车您的购物车<<继续购物  去收银台>>序号商品名称单价数量金额input type=text size=3 name=Quan value=总  计4）重新计算功能实现绘制从新计算功能的详细程序处理流程图。5）获取送货信息页面设计利用Dreamweaver设计实现获取送货信息页面，并对页面中的主要模块进行描述，描述它的页面属性，以及对它的控件响应事件进行说明。客户在收银台页面点击“去收银台”按钮将激活order1.asp页面，该页面的功能是提供一个表单，用来要求客户填写真实姓名、电子邮件地址、详细住址、邮政编码、联系电话等信息以便准确及时地将所购商品送达客户。客户提交此表以后将激活Order2.asp页面。其页面截图如下：Order1.asp的源代码如下： 姓 名： 电子邮件： 所在省份： 所在城市： 详细住址： 邮政编码： 联系电话： 6）确认购物及送货信息页面设计与实现利用Dreamweaver设计实现确认购物及送货信息页面，并对页面中的主要模块进行描述，描述它的页面属性，以及对它的控件响应事件进行说明。当客户在上述表单中填写好各项信息并点击“提交”按钮后，就将进入order2.asp页面。其功能是用来再次显示客户所购各项商品的名称、单价、数量、金额和总计金额等，供客户进一步确认。同时将获得客户真实姓名及各项送货信息再次显示出来，供客户确认。如果客户选择“确认订购“按钮，将激活Order3.asp页面。如果客户选择”取消订购“按钮，将调用Order4.asp终止本次购物。页面截图如下：Order2.asp的源代码如下： 请确认您的购物信息：序号商品名称单价数量金额%dim i,totali=0total=0for i=0 to rsItem.Fields.Count-1while not rsItem.eofif rsItem.EOF OR rsItem.BOF then Exit for response.write()response.write( & rsItem(ItemID) & )response.write( & rsItem(Name) & )response.write( & rsItem(Price) & )response.write( & rsItem(Quantity) & )response.write( & rsItem(Price)*rsItem(Quantity) & )response.write()total=total+rsItem(Price)*rsItem(Quantity)Session(total1)=totali=i+1rsItem.movenext()WendrsItem.closeconn.close()Set rsItem=NothingSet Conn=Nothingresponse.write(总计： )response.write( )response.write( )response.write( )response.write( &total & )%请确认您的个人信息：姓名：电子邮件地址：所在省份：所在城市：详细住址：邮政编码：联系电话