电脑端商城网页设计(电商网站页面设计)

一、课题任务与目的

设计与实现一个商城购物网站，方便用户对商品的浏览和购买，管理员对用户、商品的管理以及网站的运行维护。主要功能有注册用户、商品浏览、购物车、留言、聊天、公告、浏览记录等。

本网站与其他的购物网站既有相似之处也有不同之处。网站只有一个管理员，维护着自己网站，经营着自己的店铺，类似京东的自营模式，但是只有一个商家。用户通过网站模拟支付购买自己需要的商品，不满意可以退货退款或通过客服聊天协商解决，保障用户的利益。

二、调研资料情况

1.网上商城定义

网上商城类似于现实世界当中的商店，差别是利用电子商务的各种手段,达成从买到卖的过程的虚拟商店，从而减少中间环节，消除运输成本和代理中间的差价，造就对普通消费，和加大市场流通带来巨大的发展空间。尽能的还消费者以利益，带动公司发展和企业腾飞，引导国民经济稳定快速发展，推动国内生产总值。

网上商城主要有三大类：B2B（Business To Business,商家对商家）、B2C(Business To Customer,商家对顾客直销)和C2C(Customer to Customer,客户和客户），其功能不尽相同。B2B的典型代表有阿里巴巴、中国制造网，主要是从事批发业务。B2C的典型代表有亚马逊、中国巨蛋、当当网，卓越主要是从事零售业务。C2C的典型代表有淘宝、易趣、拍拍、百度有啊。

除过B2B，B2C，C2C之外，目前新型的电子商务模式还有C2B，M2B两种，那么我们如何更好的理解和区别B2B，B2C，C2C，C2B，M2C这五种电子商务模式呢？B2B (Business to Business) 是指商家与商家建立的商业关系。例如我们在麦当劳中只能够买到可口可乐是因为麦当劳与可口可乐中的商业伙伴的关系，商家们建立商业伙伴的关系是希望通过大家所提供的东西来形成一个互补的发展机会，大家的生意都可以有利润，例子：阿里巴巴、慧聪。B2C (Business to Consumer) 就是我们很经常看到的供应商直接把商品卖给用户，例如你去麦当劳吃东西就是B2C，因为你只是一个客户。例子：当当、卓越。C2C (Consumer to Consumer)客户之间自己把东西放上网去卖。例子：淘宝、拍拍、易趣。C2B (Consumer to Business)这个概念比较新,意思是由客户选择自己要些什么东西，要求的价格是什么，然后由商家来决定是否接受客户的要求。假如商家接受客户的要求，那么交易成功，假如商家不接受客户的要求，那么就是交易失败。M2C（Manufacturers to Consumer），生产厂家(Manufacturers)直接对消费者(Consumers)提供自己生产的产品或服务的一种商业模式，特点是流通环节减少至一对一，销售成本降低，从而保障了产品品质和售后服务质量。

2.网上商城企业

1）淘宝网

淘宝网是亚太地区较大的网络零售、商圈，由阿里巴巴集团在2003年5月创立，

是中国深受欢迎的网购零售平台，拥有近5亿的注册用户数，每天有超过6000万的固定访客，同时每天的在线商品数已经超过了8亿件，平均每分钟售出4.8万件商品。

截止2011年年底，淘宝网单日交易额峰值达到43.8亿元，创造270.8万直接且充分就业机会。随着淘宝网规模的扩大和用户数量的增加，淘宝也从单一的C2C网络集市变成了包括C2C、团购、分销、拍卖等多种电子商务模式在内的综合性零售商圈。目前已经成为世界范围的电子商务交易平台之一。

截至2014年底，淘宝网拥有注册会员近5亿，日活跃用户超1.2亿，在线商品数量达到10亿，在c2c市场，淘宝网占95.1%的市场份额。淘宝网在手机端的发展势头迅猛，据易观2014年最新发布的手机购物报告数字，手机淘宝+天猫的市场份额达到85.1%。截止目前，淘宝网创造的直接就业机会达467.7万。

2016年3月29日，阿里巴巴集团CEO张勇为淘宝的未来明确了战略：社区化、内容化和本地生活化是三大方向。

淘宝网2005年成交金额破80亿元，超越沃尔玛。2007年，淘宝的交易额实现了433亿元，比2006年增长156%。2008年上半年，淘宝成交额就已达到413亿元。2009年全年交易额达到2083亿人民币。

随着淘宝网规模的扩大和用户数量的增加，淘宝也从单一的C2C网络集市变成了包括C2C、分销、拍卖、直供、众筹、定制等等多种电子商务模式在内的综合性零售商圈。

2）京东

京东（JD）是中国最大的自营式电商企业，京东创始人刘强东担任京东集团CEO。

2015年第一季度在中国自营式B2C电商市场的占有率为56.3%。目前，京东集团旗下设有京东商城、京东金融、拍拍网、京东智能、O2O及海外事业部。2014年5月，京东在美国纳斯达克证券交易所正式挂牌上市（股票代码：JD），是中国第一个成功赴美上市的大型综合型电商平台，与腾讯、百度等中国互联网巨头共同跻身全球前十大互联网公司排行榜。2014年，京东市场交易额达到2602亿元，净收入达到1150亿元。http://www.biyezuopin.vip

2014年11月22日，京东集团宣布大家电“京东帮服务店”正式开业。京东称，未来3年，“京东帮服务店”将在全国区县铺开，达到千余家。

2014年11月20日，在浙江乌镇出席首届世界互联网大会的中共中央政治局委员、国务院副总理马凯介绍，阿里巴巴、腾讯、百度、京东4家企业进入全球互联网公司十强。2016年5月18日，京东正式敲响了 6·18 的战鼓。

2016年6月8日，《2016年BrandZ全球最具价值品牌百强榜》公布，京东首次进入百强榜，排名第99。2016年6月，京东宣布，与沃尔玛达成深度战略合作。作为合作的一部分，沃尔玛旗下1号店将并入京东。消息宣布后，京东股价上涨近5%。

3）亚马逊

亚马逊公司（Amazon，简称亚马逊；NASDAQ：AMZN），是美国最大的一家网络电子商务公司，位于华盛顿州的西雅图。是网络上最早开始经营电子商务的公司之一，亚马逊成立于1995年，一开始只经营网络的书籍销售业务，现在则扩及了范围相当广的其他产品，已成为全球商品品种最多的网上零售商和全球第二大互联网企业，在公司名下，也包括了AlexaInternet、a9、lab126、和互联网电影数据库（Internet Movie Database，IMDB）等子公司。

亚马逊及其它销售商为客户提供数百万种独特的全新、翻新及二手商品，如图书、影视、音乐和游戏、数码下载、电子和电脑、家居园艺用品、玩具、婴幼儿用品、食品、服饰、鞋类和珠宝、健康和个人护理用品、体育及户外用品、玩具、汽车及工业产品等。

2004年8月亚马逊全资收购卓越网，使亚马逊全球领先的网上零售专长与卓越网深厚的中国市场经验相结合，进一步提升客户体验，并促进中国电子商务的成长。2016年10月，亚马逊排2016年全球100大最有价值品牌第8名。

3.网上商城发展

网上商城是在为个人用户和企业用户提供人性化的全方位服务，努力为用户创造亲切、轻松和愉悦的购物环境，不断丰富产品结构，最大化地满足消费者日趋多样的购物需求，并凭借更具竞争力的价格和逐渐完善的物流配送体系等各项优势，赢得市场占有率多年稳居行业首位的骄人成绩，也是时代发展的趋势。

参考资料

[1]网星工作室，《Dreamweaver MX》，北京希望电子出版社

[2]薛小龙，《JSP典型系统实战与解析》，电子工业出版社

[3]管西京，《JSP+MySql动态网站案例开发》，电子工业出版社

[4]程舒通，《学校网站动态技术的开发》，南宁职业技术学院学报

[5]唐汉明,翟振兴,关宝军,王洪权.深入浅出MySQL(第2版)[M]，人民邮电出版社

[6]张海藩，《软件工程导论学习辅导》[M]，清华大学出版社

[7]李刚，《疯狂Java讲义》（第3版）电子工业出版社

[8]李兴华，《Java Web开发实战经典基础篇》，清华大学出版社

[9]明日科技编著，《Java从入门到精通》，清华大学出版社

[10]Paul DuBois，MySQL[M].Addison-Wesley Educational Publishers,Inc,USA,2013

[11]Ralph R. Young 著，韩柯、耿民等译，《有效需求实践》，机械工业出版社

三、初步设计方法与实施方案

1系统功能

本系统设计四种用户，第一种是未注册用户，第二种是注册用户，第三种是管理员用户，第四种是客服。四种用户权限都不一样，未注册用户可以浏览商品但不能购买，注册用户可以购买商品，管理员用户则管理网站，客服实现聊天功能。主要功能有用户注册、商品浏览、购物车、网站管理等。系统结构如图1所示。

1）前台页面

Ø 注册登录

注册信息需要验证码，符合条件方可注册；登录时输入用户名、密码、验证码。

Ø 商品浏览

商品分类展示，单个分类中分页显示商品名称、商品价格、商品描述、商品图片，可以搜索商品。

Ø 购物车

用户点击某一个展示商品下的购买，可以加入购物车。可以修改购物车，当点击结算模拟支付生成订单（订单信息包括订单号、用户信息、商品信息、总价、未收货、未退货、未发货）。

Ø 订单管理

查询订单信息、进行收货确认、选着是否退货、查看是否发货。

Ø 用户信息管理

可以修改用户名、密码、电话、地址，查看账户余额。

Ø 系统公告查看

查看系统管理员发布的网站公告。

Ø 留言功能

用户在网站上发布留言。

Ø 聊天功能

商品咨询、售后交流。

Ø 浏览历史、商品推荐

用户可以查看自己的商品浏览历史和推荐的商品

2后台界面

只有管理员才可以登录后台，对网站进行维护管理和店铺经营。

Ø 用户管理

查看全部用户，修改和删除用户，给用户的帐号充值（用户自己也可以模拟支付）。添加客服用户，管理客服。

Ø 商品管理

添加商品（名称、价格、描述、图片），商品要属于某个商品类别，如计算机类、手机类；查询、修改、删除商品信息。

Ø 订单管理

查询订单信息包括订单号、用户信息、商品信息、总价及查看是否收货、是否退货，发货确认。

Ø 公告管理

管理员可以添加新的网站公告、删除无效的公告、查询历史公告，便于给其他用户浏览。

Ø 留言管理

管理员可以回复用户的留言、删除错误的留言、查询用户的网站留言。

Ø 聊天管理

管理员可以对用户与客服的聊天记录进行查询以及删除。

图1功能模块图

2初步设计方法与实施方案

1）系统框架

采用Java EE轻量级的三个开源框架：Struts2、Hibernate和Spring。即S2SH框架整合开发。

2）系统方案

考虑到安全性和功能可扩展性，网站采用java ee开发，数据库使用开源免费的Mysql，服务器采用Tomcat。

MySQL作为一种快速、多用户、多线程的SQL数据库服务器，可以通过Intemet方便地获取和升级，属免费软件，这使它成为B/S系统开发的首选数据库。作为一个网络数据库，其安全性尤其重要。涉及到数据库系统的内部安全性和外部安全性，内部安全性关心的是文件系统的问题，外部安全性关心的是外部通过网络连接服务器的客户问题。MySQL有一套先进但非标准的安全，权限机制。

Tomcat 服务器是一个免费的开放源代码的Web 应用服务器，属于轻量级应用服务器，在中小型系统和并发访问用户不是很多的场合下被普遍使用，是开发和调试JSP 程序的首选。Apache 为HTML页面服务，而Tomcat 实际上运行JSP 页面和Servlet。

3）系统开发环境

Eclipse 是一个开放源代码的、基于Java的可扩展开发平台。就其本身而言，它只是一个框架和一组服务，用于通过插件组件构建开发环境。幸运的是，Eclipse 附带了一个标准的插件集，包括Java开发工具（Java Development Kit，JDK）。Eclipse要比Myeclipse运行快，而且占用内存少，影响机子速度因素小，最主要的是eclipse不收费，现在Myeclipse大部分都收费，破解的也不是很好找，并且汉化起来比eclipse要难的多，Eclipse小巧，占用资源也少，速度快，直接解压就可以使用，装插件也很简单，功能跟myeclipse没太大区别。

4）系统运行环境

Ø 系统:Windows XP及其以上版本

Ø Web服务器:Tomcat7及其以上版本

Ø 数据库服务器:Mysql

Ø 浏览器:IE7,8,9、火狐、Chrome

四、预期结果

未注册用户可以注册帐号然后登录网站进行商品浏览、查看推荐商品，点击购买把商品加入购物车，确认无误后点击下单成功购买商品，最后确认收货，不满意可退货。用户可以修改自己的个人信息或在网站上留言。

管理员发布网站公告，用户可以及时查看。管理员可以对用户、商品、订单进行管理，也可以对公告、留言、聊天进行管理。

用户和客服可以通过网站及时沟通交流，解决问题，维护客户的利益。

五、进度计划

第一阶段（第1周）：撰写开题报告，准备开题答辩；

第二阶段 (第2周)：进行需求分析，构建数据流图、数据字典；