课堂笔记 - 电商项目开发笔记

目  录

1. 学习计划
   1. 目标

根据需求，完成一个互联网电商系统。

电商系统：以淘宝、京东为代表的网购平台。

1. 1. 为什么要学习电商系统？

电商系统涉及的技术非常全面，包括SSM核心框架、linux、redis、solr、mq等全部的框架和技术。

学好了电商系统，就能掌握如何利用我们所需的知识，在工作中开发项目。

1. 1. 如何学习电商系统

做任何的系统，都有一套相对固定的流程。

（1）确定需求

（2）画出原型，制作静态页面。

（3）根据静态页面，画出E-R图，创建数据库。

（4）确定系统架构

（5）确定技术选型

（6）项目组分配任务

（7）确定开发环境，统一版本

（8）开发功能模块

（9）测试

（10）预发布

（11）上线

（12）运维

我们就按照这个流程来学习、开发电商项目。

1. 开发流程
   1. 确定需求

互联网电商系统的需求，一般从两个方面考虑：并发能力+功能需求。

1. 1. 1. 并发能力

所谓的并发，就是单位时间内，同时访问服务器的总次数。

本系统并发需求800-1000次/秒。（实际开发中由甲方客户确定）

1. 1. 1. 功能需求

核心功能：

（1）用户访问门户系统，可以搜索、浏览商品，并将商品添加到购物车。

（2）用户通过身份认证之后，可以下订单、支付。

（3）要完成身份认证，必须实现注册登陆功能。

（4）后台系统中，可以实现对商品、订单等的管理。

（5）CMS系统管理门户系统中的内容(商品、广告、链接等)。

1. 1. 画出原型，制作静态页面
      1. 后台系统页面
         1. 主界面

1. 1. 1. 1. 商品模块

（1）商品列表

（2）商品规格参数列表

（3）新增商品

    --主界面

--商品类目

1. 1. 1. 1. CMS系统（Content Manager System）

--内容分类管理

--内容列表

1. 1. 1. 门户系统

（1）用户登陆

（2）用户注册

（3）搜索页面

（4）购物车

（5）订单页面

1. 1. 画出E-R图，创建数据库

（1）既然是购物平台，肯定有一张商品表

（2）每一个商品对应一个分类，需要一张商品分类表

（3）每一类商品，都对应一个规格参数的模板。需要一张参数模板表

（4）每一个商品的规格参数值都是不一样的，所以需要一张规格参数值表。

（5）每一个商品都对应有一个详细的描述信息，所以需要一张描述信息表。

     目的：将大文本的描述信息抽出来，减小商品表的体积，从而提供商品表的检索效率。

（6）CMS需要一张内容分类表

（7）每一个内容分类，都有一组具体的内容，所以需要一张内容表。

（8）用户要登陆，需要一张用户表

（9）用户下单，需要一张订单表

（10）一个订单中，可以有多个商品，所以需要一张订单项表。

（11）每一个订单都有一个收件地址，需要需要一张收件人表。

注意：本项目中，数据库已经设计好，将sql文件导入本地数据库即可。

1. 1. 选择系统架构
      1. 单一系统架构

  整个项目只有一个应用，不同的功能模块以包为单位，写在同一个系统中。

单一系统架构

1. 1. 1. 分布式架构

分布式指的是将一个系统拆分成多个不同的子系统，部署到不同的服务器上，系统之间通过接口的形式，相互调用。

分布式架构

好处：

（1）各系统之间相互独立，以接口相互调用，代码入侵少，耦合度低。

（2）拓展性能好，新增一个功能模块时，只需要将该子系统接入即可。

（3）可以进行灵活的分布式部署和负载均衡实现。

（4）项目组分小组开发子系统，沟通成本低。

劣势：

调用接口的时候，必须开发接口，意味着增加工作量。

1. 1. 1. 确定选型后的架构图

图1-5 易购商城系统架构

核心系统描述：

后台管理系统：

管理商品、订单、类目、商品规格属性、用户管理以及内容发布等功能。

前台系统：

用户可以在前台系统中进行注册、登录、浏览商品、首页、下单等操作。

会员系统：

用户可以在该系统中查询已下的订单、收藏商品、我的优惠券、团购等信息。

订单系统：

提供下单、查询订单、修改订单状态、定时处理订单。

搜索系统：

提供商品的搜索功能。

单点登录系统：

为多个系统之间提供用户登录凭证以及查询登录用户的信息。

1. 1. 技术选型（主要技术）
2. Spring、SpringMVC、Mybatis-Plus
3. JSP、JSTL、jQuery、jQuery plugin、EasyUI、KindEditor（富文本编辑器）、CSS+DIV
4. Redis（缓存服务器）
5. Solr（搜索）
6. Activemq（消息推送）
7. Httpclient、jsonp（调用系统服务，系统之间相互调用）
8. Mysql
9. tenginx（web服务器）
10. Linux（项目最终部署的地方）

1. 1. 项目组任务分配

产品经理：2人，确定需求以及给出产品原型图。

项目经理：1人，项目管理。

前端团队：3人，根据产品经理给出的原型制作静态页面。

后端团队：6-8人，实现产品功能。

测试团队：2人，测试所有的功能。

运维团队：2人，项目的发布以及维护。

开发周期6-8个月。

1. 1. 确定开发环境
      1. 确定jdk版本

--说明：这里我们选择jdk1.8。（先安装jdk1.8）

注意：确定安装的是jdk，而不是jre

1. 1. 1. 安装Maven插件
         1. 第一步：安装maven到本地磁盘

（1）解压Maven安装包

（2）解压老师提供的Maven仓库。（jar包齐全，不用从中央仓库下载）

（3）修改/conf/setting.xml文件，指定仓库地址。

（4）修改/conf/setting.xml文件，修改中央仓库为阿里云

（5）修改/conf/setting.xml文件，修改jdk版本为1.8

1. 1. 1. 1. 第二步：在Eclipse中安装Maven插件

（1）安装maven插件

（2）添加本地的maven到Eclipse中

（3）指定默认的Maven插件

（4）加载Maven的配置setting.xml，更新本地仓库

1. 1. 功能开发

   根据确定之后的需求和任务分配，完成功能模块的开发。

1. 后台管理系统搭建
   1. 后台系统结构

说明：

（1）ego-project是全局项目，是一个聚合工程，用来管理分布式下的所有子系统。

（2）ego-base是公共组件系统，定义工具类、pojo和mapper等。

（3）ego-manager是后台管理系统，依赖ego-base系统，通过maven坐标引入。

1. 1. 配置步骤说明

（1）创建ego-project聚合系统

（2）创建ego-base公共系统

（3）创建ego-manager后台管理系统

1. 1. 配置步骤
      1. 第一部分：创建ego-project聚合工程
         1. 第一步：创建项目

使用Maven创建项目（选择pom模型）

1. 1. 1. 1. 第二步：集中定义jar、插件版本(锁定版本号)

修改pom.xml文件

1. 1. 1. 第二部分：创建ego-base工程

说明：ego-base是聚合工程中的一个子系统，使用maven module创建

1. 1. 1. 1. 第一步：创建项目

1. 1. 1. 第三部分：创建后台管理系统
         1. 第一步：创建ego-manager（war模型）

（1）使用Maven module创建

（2）在/WEB-INF/路径下，添加一个web.xml文件

（3）修改pom.xml文件，添加ego-base依赖，通过maven坐标引入

1. 1. 编译ego-project工程

（1）更新ego-project聚合工程

（2）安装到本地仓库（maven clean、maven install）

（3）编译成功

1. ego-manager整合
   1. 整合步骤说明

（1）搭建环境。（导包、静态资源+jsp）

（2）Spring整合SpringMVC

（3）Spring整合Mybatis-plus

（4）整合测试

1. 1. 第一部分：搭建环境
      1. 第一步：导入jar包

（1）导入的包说明：

Spring核心包（4个）

Common-logging日志包

Spring事物+jdbc

Spring切面+AOP

Mybatis-plus核心包

Jdbc驱动+连接池druid

Jsp+servlet+jstl

（2）修改pom.xml文件

1. 1. 1. 第二步：导入静态资源、jsp页面

说明：静态资源、jsp页面，都放到/WEB-INF/路径下

1. 1. 第二部分：Spring整合SpringMVC
      1. 第一步：在src目录下创建spring-mvc.xml文件

1. 1. 1. 第二步：配置Springmvc核心控制器

修改web.xml文件

1. 1. 1. 第三步：整合测试

需求：访问后台管理系统首页。

1. 1. 1. 1. Step1：创建PageController类

1. 1. 1. 1. Step2：配置Tomcat插件启动项目

修改ego-manager项目的pom.xml文件，添加tomcat插件

1. 1. 1. 1. Step3：重新编译ego-manager项目

1. 1. 1. 1. Step4：启动项目

说明：通过tomcat插件启动项目。

1. 1. 1. 1. Step5：访问index首页

后台地址：http://localhost:8080/

--Spring整合Springmvc成功!!!

1. 1. 1. 1. Step6：访问其它页面

（1）修改PageController，使用路径变量绑定要访问页面

--测试：访问添加商品页面

1. 1. 第三部分： Mybatis-plus整合Spring

思路：

（1）配置数据源

（2）配置会话工厂

（3）配置Mybaits动态代理

（4）配置事物代理

1. 1. 1. 第一步：创建resource.properties文件

1. 1. 1. 第二步：创建spring-data.xml文件

1. 1. 第四部分：SSM整合测试
      1. 需求

根据id查询商品信息。

1. 1. 1. 配置步骤
         1. 第一步：创建Item类

1. 1. 1. 1. 第二步：创建ItemMapper接口

1. 1. 1. 1. 第三步：创建ItemService接口及其实现类

（1）创建ItemService

（2）创建ItemServiceImpl类

1. 1. 1. 1. 第四步：创建ItremController类

1. 1. 1. 1. 第五步：重新编译项目、安装到本地仓库

1. 1. 1. 整合测试

重启项目，浏览器访问地址  http://localhost:8080/item/ 536563

1. 1. 1. 1. 碰到的问题及解决办法

（1）json对象转换异常

原因：

Springmvc返回json对象时，需要添加jackson依赖。

解决办法：

在ego-manager工程中，修改pom.xml文件，添加Jackson依赖。

1. 1. 1. 1. 测试结果

SSM整合成功!!!

1. 配置ego-base工程
   1. 必要性

除了ego-manager系统外，其它的子系统也需要用到pojo、mapper。

因此，在ego-base中创建pojo、mapper，就只需要创建一次了。

1. 1. 配置步骤

配置步骤说明：

     （1）将pojo、mapper复制到ego-base工程对应的包路径下。

     （2）修改ego-manager扫描路径

1. 1. 1. 第一步：复制pojo、mapper到ego-base中

1. 1. 1. 第二步：添加mybatis-plus依赖

修改pom.xml文件

1. 1. 1. 第三步：修改ego-project工程中pojo、mapper扫描路径

--修改spring-data.xml文件

重新编译ego-project工程即可！！！

1. 查询商品列表实现
   1. 前端js实现

商品列表使用EasyUI-datagrid插件来加载。

EasyUI-datagrid插件对返回数据格式要求为：

{total:”2”,rows:[{“id”:”1”,”name”,”张三”},{“id”:”2”,”name”,”李四”}]}

1. 1. 后台java实现
      1. 代码结构

Controller：接收参数，接收分页信息，响应实体数据

Service：业务处理，分页处理

Mapper：逆向工程生成，不需要开发。

注意：请求参数在jquery.easyui.min.js中定义，如下图：

响应值格式，也在jquery.easyui.min.js中定义，如下图：

1. 1. 1. 创建返回结果类型pojo

在ego-base工程中创建。

1. 1. 1. Service层实现

1. 1. 1. controller层实现

1. 1. 1. 开心一刻