《补充电子商务网站设计实例.ppt》由会员分享，可在线阅读，更多相关《补充电子商务网站设计实例.ppt（68页珍藏版）》请在三一办公上搜索。
1、电子商务网站的分析与设计实例,网上购书系统规划及总体设计 网站建设与功能模块 系统的设计编程与测试运行环境 数据库与数据表的设计与功能 购物网站各主要模块的编程及其功能 习题,网上购书系统规划及总体设计,一、系统分析 1.市场分析(1)调查个人消费者群体的详细情况 消费者个人的基本情况 消费者网上购物的基本情况(2)调查单位消费者群体的详细情况 市场环境：良好的国际和地区经济环境、政府的支持与所在地Internet设施的完备程度都对电子商务有影响，要综合以上因素，确定市场环境是否有利于网上购物系统建设。客户分析:客户可以是消费者，也可以是企业或个人，需要分析客户的受教育程度和网民结构等,2.需
2、求分析 企业需求：对于企业网上购物系统，由于企业自身的生存、发展所引发的对电子商务系统需求，称为企业需求。市场需求：由于市场供求不平衡或其它原因所引发的对商务系统的需求，称为市场需求，对于消费类网上购物系统而言，无论是企业需求还是市场需求，总归都是来自网上客户的需求。3.系统功能分析(1)商品或服务的展示功能(2)部分实现电子商务功能(3)完整的电子商务功能,网上购书系统规划及总体设计,二、购书系统规划 网上购物系统设计包括确定商务模式、制订营销计划、确定系统构成、确定系统流程和确定技术方案等。1.确定商务模式：包括确定总体商务模式与网上品牌、网上服务等方式。2.制订营销计划：主要是制订具体的
3、网上交易计划。3.确定系统构成：包括系统功能模块/子系统、前台/后台等的设计。4.确定系统流程：包括用户从登录到购物结帐、从交易产生到交易的处理完毕等整个流程的设计。,网上购书系统规划及总体设计,建立一个网上购物系统，必须规划系统的设计目的和设计结构，选取合适的软件环境与编辑工具等，并且要规划好建设网上购物系统的各项具体步骤。1.设计购物网站的目的(1)直传网站形象：建立网站网页，加入WWW已成为目前网站的基本宣传模式。(2)销售商品：以销售商品为目的的网站。(3)娱乐：各式网上交友、联机游戏网站已经成为目前网上的热门去处。(4)提供信息：此类站点主要提供各类信息。(5)个人网页：既可向领导、
4、同事展示自己的才能，又可向外界推销自己,2.网站结构的规划 应根据建网目的规划网站结构的主题。以树状结构为例，网站可分为网站简介、热门商品、分类商品、会员注册、网上购物和客户服务等主题，然后依主题绘出网站的结构图。在绘制网站结构图时，需要考虑网站内部的导航方式。如果网站拥有很多层网页，浏览的顺序和如何连接各网页的问题也是需要重视的。3.选择前台开发工具和后台支持系统软件(1)操作系统：Windows XP。(2)Web服务器：个人Web服务器Personal Web Server4.0。(3)后台数据库系统：Microsoft Access 2003。(4)网页前台编辑工具：FrontPage
5、 2000和Mcromedia dreamweaver 8.0。,(5)网页后台编程软件：Microsoft脚本编辑器MSE。4.规划好建立网上购物系统的具体步骤(1)建立网上购物系统的网页。(2)安装个人Web服务器。(3)建立Access的数据库。(4)设置ODBC的数据源。(5)发布网站系统,三、网站的总体设计 1.网站建设目的确定 开展B2B和B2C交易；(1)开展拍卖业务；(2)用于企业形象建设，拓展企业联系渠道；(3)作为交易中间商建立市场交易场所，开展中介交易；(4)作为服务性网站；其他应用目的等。2.网站客户定位 只有清楚地确认网站的客户群体、客户的需求、客户的兴趣，才可能在网
6、站上提供客户所需要的内容和信息、留住目标客户群体。网站对客户了解得越多，网站成功的可能性越大。,网络客户群体具有多样性，相应地，网站的设计也必须与之相适应。大型企业网站必须进行客户需求分析，即在充分了解本企业客户业务流程、所处环境、企业规模、行业状况的基础上，分析客户表面的、内在的、具有可塑性的各种需求。3.网站内容框架确定构架网站内容框架主要包括：网站核心内容、主要信息、服务项目等。确定内容框架后，就可以勾画网站的结构图。结构图有很多种，如顺序结构、网状结构、继承结构、WEB结构等。4.网站的盈利模式设定,5.主要业务流程设定 流程应当尽量作到对客户透明，使客户购物操作方便，让客户感到在网上
7、购物与在现实世界中的购物流程没有本质的差别和困难。6.网站开发形式选择 购买。成本较低，开发时间短，需要的专业人员少。小企业常选用这种方法。外包。开发商与企业的沟通，可以将开发商的技术优势与企业电子商务的需求密切结合，大大提高整个电子商务网站开发的成功率。,租借。在需要经常维护或者购买成本很高的情况下，租借比购买更有优势。对于无力大量投资于电子商务的中小型企业来说，租借很有吸引力。自建。自建能更好地满足组织的具体要求。那些有资源和时间去自己开发的公司或许更喜欢采用这种方法，以获得差异化的竞争优势。网上书店的基本功能包括：普通用户可以注册、登录、浏览商品、查看商品详细情况；单击“购买”就可以将该
8、商品添加到购物车，在购物车中还可以修改数量和删除商品；全部选择完毕后可以前往收银台结账。管理员用户登录后，应该可以管理普通用户信息；可以添加和删除图书类别；可以添加和删除书籍；可以查看和处理订单。,网站建设与功能模块,一、网站建站步骤 1.提出建站申请或需求(1)提出网站建设基本要求 在这个阶段，企业的重点工作是分析企业的业务流程、分析企业的市场需求、分析通行业企业网站的特点、分析并确立企业远景目标。(2)提供相关文本及图片资料 企业通常都有自己的发展历史，都有日常管理文档、照片和录像资料。在建站时需要将这些资料进行整理并电子化，提交给建站人员。,2.制定网站建设方案(1)网站需求方与建设方就
9、网站建设内容进行协商，修改、补充，以达成共识；(2)建设方制定网站建设方案；(3)双方确定建设方案具体细节及价格。3.签署相关协议、客户支付预付款(1)双方签订网站建设协议；(2)客户支付预付款；(3)客户提供网站相关内容资料。4.经客户确认后进行建设(1)根据网站建设方案）完成初稿设计；(2)客户审核确认初稿设计；(3)建设方完成整体网站制作。,5.网站测试，客户验收(1)客户根据协议内容进行验收工作；(2)验收合格，由需求方签发“网站建设验收合格确认书”；(3)客户支付余款，准备网站开通；(4)为客户注册域名、开通网站空间、上传制作文件、设置电子邮箱。6.网站后期维护工作(1)向客户提交网
10、站维护说明书；(2)建设方依据网站建设协议及网站维护说明书相关条款对待客户。,二、网站功能模块 1.前台管理实现功能 会员注册、登录、注销模块 个人账户管理模块 产品模块 搜索模块 分类模块 2.后台管理实现功能 图书管理 分类管理 用户管理 送货汇款管理,系统功能模块图,系统的设计编程与测试运行环境,一、网站购物系统的设计编程环境 1.网站购物系统的编程语言 网站的架设可分为前台编程、后台编程，前台涉及的HTML语言因编辑工具强大，大部分可根据设计自动生成，VB Script、Java Script语句和后台涉及的语言一般需要开发者编写代码实现，本网站选用了ASP语言作为后台编程语言来处理服
11、务器端的数据或数据库。Microsoft的Active Server Page（简称ASP）语言是一种服务器端的语言，只要适当规划便可编写产生动态的、,交互式的网站应用程序,程序处理的过程都是在服务器端将所设计的网页由主机端翻译并执行后，给客户端送出标准的HTML文件，并非等网页下载到客户端才执行，其处理过程如下：含有ASP程序的网页 Web服务器支持ASP 纯HTML语言网页 当客户端的浏览器（Browser）向发行网站提出执行ASP的文件时，在已经安装ASP直译程序的Web Server将这个ASP文件从头翻译一次，并且将执行的结果传送回客户端；,2.设计编程环境 本购物系统的设计编程环境
12、采用了多种软件工具综合互补进行设计编程。网页 界面设计主要用到Microsoft Frontpage 2000、Macromedia Dreamweaver 4.0和Flash 5.0等。Microsoft Frontpage 2000是Microsoft公司开发的“所见即所得”网页制作软件，它具有两大功能：一个是制作网页，另一个是建立和管理网站。作为网页编辑工具，它可编辑Internet上的HTML格式保存的所有文件，并可结合其它工具编辑处理图象动画，可在网页中插入各插件，产生多种效果。作为管理网站的工具，它可用多种方式查看、调整网站的组织结构及关系。,利用工具栏编辑时，Frontpage
13、2000可自动编译出HTML代码，并将其在浏览器中显示出效果，还可以提供直接编辑HTML的功能。Macromedia Dreamweaver 4.0是一种专业级、功能强大的“所见即所得”的网页设计制作软件，并带有站点管理等功能，提供对DHTML和CSS标准的支持，可设计出生动的DHTML动画、多层次的页面和CSS样式表，比Frontpage 2000更专业、功能更强大。所以本网站的网页界面设计主要采用了后者，并利用Flash 5.0设计图表等。编程环境主要选用了Microsoft脚本编辑器MSE，它是Office 2000软件中的脚本编辑工具，也是微软集成的网页开发软件Visual Studi
14、o6.0的编辑器，便于编写产生动态的、交互式的网站ASP程序。,二、网站购物系统的测试运行环境 本网站测试运行环境是指网站系统所选择的操作系统与web服务器。Web服务器的主要作用是提供Internet上的Web服务。只有架设了Web服务器，申请了IP地址以及域名，并且连接到Internet上，才能提供Web服务，用户才能通过Internet访问服务器上的Web页。架设一个Web服务器，首先要选择服务器的操作系统平台和Web服务器软件。Web服务器的架设有多种方案，这主要也取决于服务器的操作系统平台和Web服务器软件。常见的Web服务器平台有：基于Unix或Linux操作系统的Apache S
15、erver、基于Microsoft Windows NT/2003的IIS（Internet Information Server）和基于Windows XP的PWS（Personal Web Server）等。在确定操作系统平台时，要根据服务器设备的硬件情况与系统要求而定。,Unix一般运行在工作站或大、中、小型计算机上，Windows NT/2003 一般运行在专用服务器或高档微机上，而Windows XP一般运行在PC机上。本购物系统选择了Microsoft Windows XP操作系统和PWS作为Web服务器软件来测试运行网站系统。虽然WindowsXP在安全性、可靠性、用户管理和数据
16、流量等方面欠佳，一般用于个人Web发布而不宜用作大型网站的系统平台，但是，它不失为一个很好的电子商务实验环境。,三、网站主页界面的设计 1.网站主页图标与广告横幅（Top.htm）网站图标是网站的标志，一般体现网站的形象与网址信息；广告横幅便于放置广告信息，起到宣传网站与商务信息的作用。2.网站主页功能区（Left.asp）功能区包含用户登录、注册及商品信息查询等功能项(Left.asp)，该页面可超链接至登录、注册页面，并且实现关键字商品搜索功能。3.网站主页导航条设计（Maintop.htm）任何一个网站都离不开导航条的应用。网站的页面内会发现下面的代码：,这条代码的功能就是将导航条包含到
17、当面页面中，这样可以使本网站维持统一的风格。如果对head.htm进行修改，则所有包含head.htm的文件也会发生相应的变化。导航条可以使Web站点具有统一的风格，而且能够方便地修改，这为用户在站点内方便地跳转提供了基础。导航条的结构如图所示：,导航条,数据库与数据表的设计与功能,根据本系统实现内容的需要，数据库主要用来存储网站用户信息、图书信息以及订单信息。本例采用了Microsoft Access作为网站的后台数据库。数据库的需求 Web应用跟踪和管理用户的状态、行为所采用的措施主要有两种：一是使用session或Cookie保存用户活跃期间的信息，但是这些信息在会话结束后将不再存在；二
18、是使用数据库保存那些需要持久保存的信息，例如用户注册资料、用户的订单、图书信息等都必须通过数据库进行存储，并用能够提供查询、插入、修改和删除等操作。这主要是SQL提供的强大功能。,网上购书系统的主要对象是用户，所以必需建立用户表，包括用户的基本信息情况；用户的主要活动是购买图书，所以必须建立图书信息表；用户要购买图书，选择所要的图书，首先要对图书进行搜索，所以我们要对图书进行分类，进行大类和小类的划分，建立图书类别表和图书类别细分表；最后用户提交订单，建立订单表。经过以上分析，此数据库应包括以下几种表格：User表：用户信息表。Admin表：管理员信息表。Category表：图书大类信息表。S
19、orts表：图书小类信息表。Product表：图书信息表。Orders表：订单信息表。Delivery表：汇款送货表。Review表：顾客评论信息表。,数据库的逻辑结构设计 数据库设计要遵循一些规则，尽量地分离各个实体对应的表，一个实体对应一个表，搞清楚该实体有哪些属性，各个属性对应什么字段，以及各个实体之间有何种联系。实体、属性与联系是进行概念设计时要考虑的3个元素，也是一个好的数据库设计的核心。本系统采用的后台数据库是Access数据库系统，因此必须把上面的数据项和数据结构转换为Access数据库系统所支持的实际数据模型，也就是数据库的逻辑结构。结合实际，经过仔细的分析，本系统数据库的各个
20、表格的设计结构如下表所示：,用户表结构,管理员信息表结构,订单管理信息表结构,图书产品信息表结构,图书产品分类(大类)信息表结构,图书产品分类(小类)信息表结构,汇款/送货信息表结构,用户评论表结构,购物网站各主要模块的编程及其功能,用户注册 用户要在网站上购买图书就应该先注册，注册登录后才能使网站更好地为自已服务，从而购买到自己想要的图书。下图为用户注册页面：,用户注册,以下代码可以实现填写用户详细注册信息的表单功能，如下：%if NOT isempty(request(RegSubmit)then 判断用户刚才是否已注册过 if session(regtimes)=1 thencall M
21、sgBox(对不起，您刚注册过用户!,Back,None)response.endend if,判断用户输入的用户名或Email地址是否已存在set rs=server.CreateObject(adodb.recordset)rs.open select username,useremail from user where username=&trim(request(username)&or useremail=&trim(request(useremail)&,conn,1,1if not rs.eof and not rs.bof then call MsgBox(您输入的用户名或Em
22、ail地址已存在，请返回重新输入！,Back,None)else rs.close 若用户填写内容格式正确，则将其内容存入用户数据库表中,用户注册成功 rs.open select*from user,conn,1,3,rs.addnew rs(username)=trim(request(username)rs(password)=md5(trim(request(password)rs(useremail)=trim(request(useremail)rs(quesion)=trim(request(quesion)rs(answer)=md5(trim(request(answer)r
23、s(realname)=trim(request(realname)身份证 rs(identify)=trim(request(identify)rs(mobile)=trim(request(mobile)rs(userqq)=trim(request(userqq),rs(adddate)=now()rs(lastvst)=now()rs(loginnum)=0 rs(postcode)=0 rs(score)=0 rs(paymethord)=0 rs(deliverymethord)=0 rs.update rs.close set rs=nothing response.Cookie
24、s(cookieName)(username)=trim(request(username),response.Cookies(cookieName).expires=date+1 session(regtimes)=1 session.Timeout=1 call MsgBox(注册成功！请到用户管理中心填详细资料！,GoUrl,muser.asp)end if end if%!-,.style2 color:#000000-,用户注册 请填写用户信息*用户名：,*用户名：用户名长度不能小于2。*密码：,长度必须大于6个字符。*确认密码：*E-Mail：,请您务必填写正确的E-mail地址，
25、便于我们与您联系。真实姓名：收货人姓名。,身份证号码：此项信息用于必要时以核实身份，一经注册，便不可更改，请如实填写！,移动手机：请填写正确的号码，以便有急事联系。,Q Q：网上联系。,密码提示：密码答案：,!-,/检查用户填写内容的格式是否正确function check()if(checkspace(document.userinfo.username.value)document.userinfo.username.focus();alert(用户名不能为空，请重新输入！);return false;if(checkspace(document.userinfo.username.val
26、ue)|document.userinfo.username.value.length 2)document.userinfo.username.focus();alert(用户名长度不能小于2，请重新输入！);return false;,if(checkspace(document.userinfo.password.value)|document.userinfo.password.value.length 6)document.userinfo.password.focus();alert(密码长度不能小于6，请重新输入！);return false;if(document.userin
27、fo.password.value!=document.userinfo.password1.value)document.userinfo.password.focus();document.userinfo.password.value=;document.userinfo.password1.value=;alert(两次输入的密码不同，请重新输入！);return false;,if(document.userinfo.useremail.value.length!=0)if(document.userinfo.useremail.value.charAt(0)=.|document.
28、userinfo.useremail.value.charAt(0)=|document.userinfo.useremail.value.indexOf(,0)=-1|document.userinfo.useremail.value.indexOf(.,0)=-1|document.userinfo.useremail.value.lastIndexOf()=document.userinfo.useremail.value.length-1|document.userinfo.useremail.value.lastIndexOf(.)=document.userinfo.userema
29、il.value.length-1),alert(Email地址格式不正确！);document.userinfo.useremail.focus();return false;else alert(Email不能为空！);document.userinfo.useremail.focus();return false;if(checkspace(document.userinfo.identify.value)|document.userinfo.identify.value.length 15),document.userinfo.identify.focus();alert(身份证号码长
30、度不能小于15位，请重新输入！);return false;function checkspace(checkstr)var str=;for(i=0;i checkstr.length;i+)str=str+;return(str=checkstr);,-,如果用户注册的内容都条例上述的要求，就会显示注册成功的页面。如果用户注册的内容不符合上述要求，例如身份证长度小于15位，则会显示注册不成功所示的页面。注册成功注册不成功,购物车设计 在构建网上商店时，购物小车是必不可少的部分。用户在结账之前，用它来记录自己的购买信息（例如商品名、数量和金额等）。我们可以用ASP中的Session对象来完成
31、这个功能。Web服务器会自动为每个用户建立一个Session对象，用Session对象记录用户的相关信息来实现购物小车。图11-14进入购物车的页面，在这里用户可以单击图书的名称来查看图书以决定是否购买，之后可以选择要购买的图书去下订单，也可以删除已选购的图书。,购物车页面,下面的代码用来实现购物的具体过程。%dim id,username,actionaction=request.QueryString(action)username=trim(request.cookies(cookieName)(username)id=request.QueryString(id)set rs=serv
32、er.CreateObject(adodb.recordset),select case actioncase delconn.execute delete from orders where actionid=&request.QueryString(actionid)response.redirect car.aspcase addrs.open select id,username from orders where username=&username&and id=&id&and state=6,conn,1,1检查order订单数据库，查找所选图书是否已在购物车中if not rs
33、.eof and not rs.bof thencall MsgBox(对不起，此图书已存在于您的购物车中，不可以重复添加！,Close,None),response.endrs.closeelsers.closers.open select id,username,state,paid from orders,conn,1,3rs.addnewrs(id)=idrs(username)=usernamers(state)=6rs(paid)=0rs.updaters.close,set rs=nothingcall MsgBox(图书成功添加到你的购物篮！,Close,None)respon
34、se.endend ifend selectrs.open select orders.actionid,orders.id,product.name,product.price1,product.price2,product.discount from product inner join orders on product.id=orders.id where orders.username=&request.cookies(cookieName)(username)&and orders.state=6,conn,1,1%,搜索模块设计 在该网站中，用户还可以搜索自己想要的图书，界面如图
35、所示：,图书搜索界面,下面的代码用来实现两级查询的具体操作。,%dim rsSubset rsSub=server.CreateObject(adodb.recordset),rsSub.open select sorts,sortsid from sorts where categoryid=&rs(categoryid)&order by sortsorder,conn,1,1if rsSub.recordcount=0 then response.Write 对不起！此大类没有添加小类！do while not rsSub.eofresponse.Write&trim(rsSub(sorts)&rsSub.movenext loop rsSub.close set rsSub=nothing%,图书分类模块设计 为了能更好地管理图书，同时也为了使用户能更好地查询图书，本网站对图书采用了两级分类的方法，界面如图所示。,图书分类,网上购物系统的源程序代码 1.Reg.asp注册处理关键代码 2.Login.asp登录处理关键代码 3.Index.asp网站主页的主要代码 4.Car.asp购物车处理关键代码 5.Hot.asp产品模块中的畅销图书模块的关键代码 6.Vorder.asp订单生成、处理关键代码 7.Myorder.asp查看用户订单详细资料模块关键代码,
