Files
litemall/doc/project.md
2018-11-11 22:37:25 +08:00

1158 lines
40 KiB
Markdown
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
# 1 litemall系统
## 1.1 简介
litemall是一个简单的商场系统基于现有的开源项目重新实现一个完整的前后端项目包含小程序客户端和网页管理端。
![](./pic1/1-1.png)
项目的架构是三个系统和六个模块:
* 基础系统子系统(platform)
由数据库、litemall-core模块、litemall-db模块和litemall-all模块组成;
* 小商场子系统(wxmall)
由litemall-wx-api模块、litemall-wx模块和renard-wx模块组成
* 管理后台子系统(admin)
由litemall-admin-api模块和litemall-admin模块组成。
* 简单商城系统(mall)
这里仅列出,目前没有开发计划。
而六个模块的开发设计到三种技术栈:
* Spring Boot技术栈
采用IDEA开发工具开发litemall-core、litemall-db、litemall-admin-api、
litemall-wx-api和litemall-all共五个模块
* miniprogram微信小程序技术栈
采用微信小程序开发工具开发litemall-wx模块和renard-wx模块
* Vue技术栈
采用VSC开发工具开发litemall-admin模块。
## 1.2 系统功能
从业务功能上,目前由五个业务模块组成:
* 会员业务模块
* 商场业务模块
* 商品业务模块
* 推广业务模块
* 系统业务模块
### 1.2.1 小程序端功能
* 首页
* 专题列表、专题详情
* 分类列表、分类详情
* 品牌列表、品牌详情
* 新品首发、人气推荐
* 团购
* 搜索
* 商品详情
* 商品评价列表、商品评价
* 购物车
* 下单
* 个人
* 订单列表、订单详情
* 地址列表、地址添加、地址删除
* 收藏、足迹、关于
### 1.2.2 管理平台功能
* 会员管理
* 会员管理
* 收货地址
* 会员收藏
* 会员足迹
* 搜索历史
* 意见反馈
* 商城管理
* 行政区域
* 品牌制造商
* 订单管理
* 商品类目
* 通用问题
* 关键词
* 渠道管理(待定)
* 商品管理
* 商品列表
* 商品上架
* 商品编辑
* 用户评论
* 推广管理
* 广告管理
* 专题管理
* 团购规则
* 团购活动
* 系统管理
* 管理员
* 对象存储
* 权限管理(待定)
* 定时任务(待定)
* 参数管理(待定)
* 系统日志(待定)
* 统计管理
* 用户统计
* 订单统计
* 商品统计
## 1.3 项目特点
存在以下特点:
* 数据库方面只是简单的表表和表之间的依赖关系没有采用外键设计而是依赖Java代码在service层面或者业务层面保证。这样做的好处是数据库频繁改动很方便不会因为外键而导致数据库难以修改;
* 涉及三种技术栈,但是每种技术栈仅涉及最基础的技术;
* 后端技术栈,仅涉及 SpringSpring Boot, Spring MVC和Mybatis技术其他后端技术暂时不采用;
* 小程序技术栈仅涉及miniprogram官方文档
* 前端技术栈仅涉及vue, vuex, vue-route和element技术
* 安全方面,仅采用最基本的代码,提供简单基本的安全服务;
* 性能方面没有涉及内存数据库缓存功能而是完全依赖MySQL;
* 对象存储服务方面,支持本地存储和第三方云存储方案。
* 消息通知方面,支持邮件通知、第三方云短信通知和微信模板通知;
* 部署方便,支持多服务部署和一键部署脚本;
* 文档全面,虽然还在开发中,但是规划中文档和代码注释一定会完成,帮助开发者理解项目。
总之,目前的系统只是为了学习技术和业务而开发的一个简单商场原型系统。虽然缺失很多企业级功能,但是是完整和合理的原型系统。
注意:
> 以上特点并不一定是优点。
接下来从项目的开发、部署测试和上线三个阶段介绍litemall。
![](pic1/1-10.png)
首先需要明确的是三个不同阶段:
* dev
即develop或者development, 这里指开发阶段,通常代码是直接在本地编译、运行和测试。
此外这里服务访问地址通常是localhost。这里的“用户”主要是指开发者本身。
* dep
即deploy或者deployment这里指部署测试阶段通常代码已经编译打包运行在远程主机中
可以对外服务。此外这里服务访问地址通常是IP地址。如果IP是公网IP那么
部署以后就可以对外服务;如果是内网地址,那么只能内网访问。这里的“用户”主要是
指开发者本身、测试者当然如果是局域网或者不介意IP访问的那么这里的“用户”
也可能是最终使用者用户。
* prod
即product或者production这里指上线阶段通常也是代码编译打包运行在远处主机中可以对外服务。
此外这里服务访问地址通常是域名地址同时端口是80web端口。上线以后直接面向的是最终用户。
虽然服务的代码本身和dep是完全一样的但是考虑到场景的不同上线阶段可能在运行环境方面需要做
调整例如采用反向代理屏蔽内部实际项目结构。此外最大的不同应该是上线环境下要使用域名和80端口
而部署阶段则更为自由。
其次,需要明确的是,这里划分三种阶段不是简单的文档说明,还直接影响项目本身的行为
和代码编译结果,因此开发者需要清晰的了解;
最后其实dep和prod不存在先后关系。例如如果开发者已经存在域名和生产环境可以直接
跳过dep阶段而直接部署在线上环境中。因此有些时候这里部署和上线是一个阶段。
当然这里仍然建议先dep后prod是因为对于第一次开发而言先dep阶段可以避免对域名、https证书等非业务相关工作的干扰。
此外,有些业务功能(例如微信支付)必须是域名访问,那么开发和部署阶段可以先采用模拟或跳过的形式,
先不开发和测试这样业务功能,等其他功能开发完毕和部署测试成功以后,再来开发这些线上环境才能
运行的功能,此时会有一个好的基础。
## 1.4 开发方案
![](pic1/1-2.png)
如图所示,当前开发阶段的方案:
* MySQL数据访问地址`jdbc:mysql://localhost:3306/litemall`
* litemall-wx-api后端服务地址`http://localhost:8080/wx`数据则来自MySQL
* litemall-admin-api后端服务地址`http://localhost:8080/admin`,数据则来自MySQL
* litemall-admin前端访问地址`http://localhost:9527`, 数据来自litemall-admin-api
* litemall-wx没有前端访问地址而是直接在微信小程序工具上编译测试开发最终会部署到微信官方平台即不需要自己部署web服务器而数据则来自litemall-wx-api
### 1.4.1 数据库
数据库环境设置过程如下:
1. 安装MySQL
2. 创建数据库、用户权限、数据库表和测试数据
数据库文件存放在litemall-db/sql文件夹中其中litemall_schema.sql创建数据库和用户权限
litemall_table.sql则创建表litemall_data.sql则是测试数据。
注意建议采用命令行或者MySQL Workbench。如果采用navicat可能导入失败。
### 1.4.2 Spring Boot开发环境
1. 安装JDK8
2. 安装Maven
3. 安装Git可选
4. 安装IDEA Community建议安装Maven插件和Git插件。
这里IDEA社区版即可不要求IDEA商业版。
Eclipse没有试过但应该也是可行的。
5. IDEA导入本项目
6. 采用Maven命令安装依赖库
例如:
```
cd litemall
mvn install
```
或者采用IDEA的Maven插件安装本项目依赖库点击`install`
![](pic1/1-8.png)
7. 采用Maven命令编译本项目
例如:
```
cd litemall
mvn compile
```
此时可以看到litemall-wx-api等模块多了target文件夹里面是编译出的文件。
或者采用IDEA的Maven插件编译本项目点击`compile`
如果采用IDEA也可以跳过当前步骤直接步骤8因为运行时会自动编译再运行
8. 采用Maven命令运行本项目的litemall-all
例如:
```
cd litemall/litemall-all
mvn spring-boot:run
```
如果采用IDEA则litemall-all模块的Application类
右键` Run Application.main()`方式运行该模块,
![](pic1/1-9.png)
打开浏览器,输入
```
http://localhost:8080/wx/index/index
http://localhost:8080/admin/index/index
```
如果出现JSON数据则litemall-all模块运行正常。
注意:
> 1. 在上述开发步骤中既介绍了Maven命令方式也介绍了IDEA方式
> 但是仍然建议开发者开发阶段采用IDEA。
> 2. 以上是本人开发过程中采用的一些步骤,开发者可不拘泥于这些步骤。
> 如果开发者没有按照本人步骤开发而出现相关问题,也请**不要**咨询,
> 本人**没有**相关解决经验。
> 3. 开发者使用IDEA导入项目或者运行项目的时候会出现软件卡顿的现象这通常是litemall-admin的
> node_modules文件夹内自动下载了大量的litemall-admin的依赖库当IDEA尝试索引该文件夹内的大量文件时
> 则出现IDEA卡顿的现象具体解决方式可以参见[FAQ](./FAQ.md)
### 1.4.3 微信小程序开发环境
1. 安装微信小程序开发工具;
2. 导入本项目的litemall-wx模块(或者renard-wx模块)文件夹;
3. 编译前请确定litemall-all模块已经运行而litemall-wx模块的config文件夹中的api.js已经设置正确的后端数据服务地址
4. 点击`编译`,如果出现数据和图片,则运行正常
注意:
> 开发者编译以后,可以看到图片和数据,但是采用微信登录或者微信支付是肯定会失败的。
> 原因是这里的配置信息没有正确设置例如appid具体详细配置见1.4.5节。
### 1.4.4 Vue开发环境
1. 安装[nodejs](https://nodejs.org/en/)
2. 安装依赖库
```
cd litemall/litemall-admin
npm install -g cnpm --registry=https://registry.npm.taobao.org
cnpm install
```
3. 编译并运行
```
cnpm run dev
```
然后,打开浏览器,输入`http://localhost:9527`。
如果出现管理后台登录页面,则表明管理后台的前端运行正常;
4. 请确定litemall-all模块已经运行然后点击`登录`,如果能够成功登录,则表明管理后台的前端和后端对接成功,运行正常。
目前本人采用VSCVisual Studio Code来开发litemall-admin项目开发者也可以采用其他熟悉的IDE。
### 1.4.5 项目配置
当安装好Spring Boot开发环境、Vue开发环境和小程序开发环境以后启动相应的模块已经可以看到一些数据或者效果。
但是还有一些特性或者功能没有启动,这是因为需要开发者进行配置才能正确启用。
**项目配置结构**
1. 管理后台前端即litemall-admin模块配置文件在litemall-admin/config中存在三个配置文件`dev.env.js`,`dep.env.js`
和`dep.env.js`。这里面配置信息都是一样,最主要的配置是`BASE_API`,即管理后台的服务根地址。
* 开发阶段,开发者运行命令`cnpm run dev`,这里就会采用`dev.env.js`配置文件;
* 部署阶段,当开发者运行命令`cnpm run build:dep`,这里就会采用`dep.env.js`配置文件;
* 上线阶段,当开发者运行命令`cnpm run build:prod`,这里就会采用`prod.env.js`配置文件。
2. 小商场前端即litemall-wx模块配置文件是`litemall-wx/project.config.json`和`litemall-wx/api.js`。
这里面最主要的配置信息是`project.config.json`中的`appid`开发者需要设置自己申请的appid
以及`apis.js`中的`WxApiRoot`,即小商场服务根地址。
```
// 本机开发时使用
var WxApiRoot = 'http://localhost:8080/wx/';
// 局域网测试使用
// var WxApiRoot = 'http://192.168.0.101:8080/wx/';
// 云平台部署时使用
// var WxApiRoot = 'http://122.152.206.172:8080/wx/';
// 云平台上线时使用
// var WxApiRoot = 'https://www.menethil.com.cn/wx/';
```
3. 管理后台后端和小商城后端即多个Spring Boot模块配置文件是每个模块的`litemall-xx/src/main/java/resources`的
`application.yml`和`application-xx.yml`配置文件。这里会发现每个模块都会有两个配置文件,但是实际上当前模块的配置信息
都是在`application-xx.yml`文件中,而`application.yml`文件仅仅用于引入其他模块的配置文件。
例如litemall-all模块的`application.yml`的内容是
```
spring:
profiles:
active: db, core, admin, wx
message:
encoding: UTF-8
```
因此启动litemall-all模块时程序首先加载litemall-all的`application.yml`,然后通过`spring.profiles.active`信息
再次依次加载`application-db.yml`,`application-core.yml`,`application-admin.yml`和`application.yml-wx`四个配置文件。
这里后端服务模块的配置如下所示。
#### 1.4.5.1 日志配置
如果开发者启动litemall-all模块则需要配置该模块的`application.yml`文件
```
logging:
level:
root: ERROR
org.springframework: ERROR
org.mybatis: ERROR
org.linlinjava.litemall.core: ERROR
org.linlinjava.litemall.db: ERROR
org.linlinjava.litemall.admin: ERROR
org.linlinjava.litemall.wx: ERROR
org.linlinjava.litemall: ERROR
```
具体如何配置请自行学习Spring Boot的日志配置。
`org.linlinjava.litemall.core`定义litemall-core模块的日志级别
`org.linlinjava.litemall.db`定义litemall-core模块的日志级别
`org.linlinjava.litemall.wx`定义litemall-wx-api模块的日志级别
`org.linlinjava.litemall.admin`定义litemall-admin-api模块的日志级别
`org.linlinjava.litemall`而定义litemall所有后端模块的日志级别
当然如果开发者这里启动litemall后端模块级别是DEBUG时可能会发现并没有很多日志
这是因为代码内部没有写很多日志,开发者可以根据需要添加。
注意:
> 如果开发者独立启动litemall-wx-api模块那么则需要配置litemall-wx-api模块的
> `application.yml`文件来设置日志
#### 1.4.5.2 数据库连接配置
在litemall-db模块的`application-db.yml`文件中配置数据库连接和druid
```
spring:
datasource:
druid:
url: jdbc:mysql://localhost:3306/litemall?useUnicode=true&characterEncoding=UTF-8&serverTimezone=UTC&allowPublicKeyRetrieval=true&verifyServerCertificate=false&useSSL=false
driver-class-name: com.mysql.jdbc.Driver
username: litemall
password: litemall123456
initial-size: 10
max-active: 50
min-idle: 10
max-wait: 60000
pool-prepared-statements: true
max-pool-prepared-statement-per-connection-size: 20
validation-query: SELECT 1 FROM DUAL
test-on-borrow: false
test-on-return: false
test-while-idle: true
time-between-eviction-runs-millis: 60000
filters: stat,wall
```
#### 1.4.5.3 微信登录配置
微信登录需要配置两个地方,
首先是小商场前端litemall-wx模块或renard-wx模块中`project.config.json`文件的appid
其次是小商场后端litemall-core模块的`application-core.yml`文件:
```bash
litemall:
wx:
app-id: wxa5b486c6b918ecfb
app-secret: e04004829d4c383b4db7769d88dfbca1
```
这里的`app-id`和`app-secret`需要开发者在[微信公众平台](https://mp.weixin.qq.com/)注册获取。
注意
> 这里开发者可能会疑惑小商场后端应该配置在litemall-wx-api模块的`application-wx.yml`文件更合适。
> 这里放置在`application-core.yml`文件中是因为litemall-core模块也依赖小程序appid配置信息。
#### 1.4.5.4 微信支付配置
在litemall-core模块的`application-core.yml`文件中配置微信支付:
```
litemall:
wx:
mch-id: 111111
mch-key: xxxxxx
notify-url: https://www.example.com/wx/order/pay-notify
```
这里的`mch-id`和`mch-key`需要开发者在[微信支付平台](https://pay.weixin.qq.com/)注册获取。
而这里的`notify-url`则应该是项目上线以后微信支付回调地址,当微信支付成功或者失败,
微信支付平台将向回调地址发生成功或者失败的数据,因此需要确保该地址是
litemall-wx-api模块的WxOrderController类的payNotify方法所服务的API地址。
开发阶段可以采用一些技术实现临时外网地址映射本地,开发者可以百度关键字“微信 内网穿透”自行学习。
#### 1.4.5.5 邮件通知配置
在litemall-core模块的`application-core.yml`文件中配置邮件通知服务:
```
litemall:
notify:
mail:
# 邮件通知配置,邮箱一般用于接收业务通知例如收到新的订单sendto 定义邮件接收者,通常为商城运营人员
enable: false
host: smtp.exmail.qq.com
username: ex@ex.com.cn
password: XXXXXXXXXXXXX
sendfrom: ex@ex.com.cn
sendto: ex@qq.com
```
配置方式:
1. 邮件服务器开启smtp服务
2. 开发者在配置文件中设置`enable`的值`true`,然后其他信息设置相应的值。
这里只测试过QQ邮箱开发者需要自行测试其他邮箱。
应用场景:
目前邮件通知场景也很简单,就是用户下单以后系统会自动向`sendto`用户发送一封邮件,告知用户下单的订单信息。
以后可能需要继续优化扩展。当然,如果不需要邮件通知订单信息,可以默认关闭即可。
验证配置成功:
当配置好信息以后开发者可以运行litemall-core模块的`MailTest`测试类,
独立发送邮件,然后登录邮箱查看邮件是否成功接收。
#### 1.4.5.6 短信通知配置
在litemall-core模块的`application-core.yml`文件中配置短信通知服务:
```
litemall:
notify:
# 短消息模版通知配置
# 短信息用于通知客户例如发货短信通知注意配置格式template-nametemplate-templateId 请参考 NotifyType 枚举值
sms:
enable: false
appid: 111111111
appkey: xxxxxxxxxxxxxx
template:
- name: paySucceed
templateId: 156349
- name: captcha
templateId: 156433
- name: ship
templateId: 158002
- name: refund
templateId: 159447
```
配置方式:
1. 腾讯云短信平台申请,然后设置四个场景的短信模板;
2. 开发者在配置文件设置`enable`的值`true`,然后其他信息设置
腾讯云短信平台申请的appid等值。
这里只测试过腾讯云短信平台,开发者需要自行测试其他短信云平台。
应用场景:
目前短信通知场景只支持支付成功、验证码、订单发送、退款成功四种情况。
以后可能需要继续优化扩展。
验证配置成功:
当配置好信息以后开发者可以litemall-core模块的`SmsTest`测试类中设置手机号和
模板所需要的参数值,独立启动`SmsTest`测试类发送短信,然后查看手机是否成功接收短信。
#### 1.4.5.7 微信通知配置
微信通知是微信上收到的服务通知。
在litemall-core模块的`application-core.yml`文件中配置微信通知服务:
```
litemall:
notify:
# 微信模版通知配置
# 微信模版用于通知客户或者运营者注意配置格式template-nametemplate-templateId 请参考 NotifyType 枚举值
wx:
enable: false
template:
- name: paySucceed
templateId: xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
- name: captcha
templateId: xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
- name: ship
templateId: xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
- name: refund
templateId: xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
```
配置方式:
1. 微信公众平台申请,然后在`模板消息`中设置四个场景的微信模板;
2. 开发者在配置文件设置`enable`的值`true`,然后其他信息设置
微信公众平台中所设置模板ID。
应用场景:
目前微信通知场景只支持支付成功、验证码、订单发送、退款成功四种情况。
以后可能需要继续优化扩展。
验证配置成功:
这里没有实现测试类因为微信通知需要小程序前端的formId作为参数因此需要
小商城前端配合。开发者可以在实际场景中DBEUG看看。
#### 1.4.5.8 物流配置
物流配置是查询商品物流信息,这里主要是基于[第三方快递鸟服务](http://www.kdniao.com/api-track)。
在litemall-core模块的`application-core.yml`文件中配置快递鸟物流服务:
```
litemall:
notify:
# 快鸟物流查询配置
express:
enable: false
appId: "XXXXXXXXX"
appKey: "XXXXXXXXXXXXXXXXXXXXXXXXX"
vendors:
- code: "ZTO"
name: "中通快递"
- code: "YTO"
name: "圆通速递"
- code: "YD"
name: "韵达速递"
- code: "YZPY"
name: "邮政快递包裹"
- code: "EMS"
name: "EMS"
- code: "DBL"
name: "德邦快递"
- code: "FAST"
name: "快捷快递"
- code: "ZJS"
name: "宅急送"
- code: "TNT"
name: "TNT快递"
- code: "UPS"
name: "UPS"
- code: "DHL"
name: "DHL"
- code: "FEDEX"
name: "FEDEX联邦(国内件)"
- code: "FEDEX_GJ"
name: "FEDEX联邦(国际件)"
```
配置方式:
1. [快递鸟平台](http://www.kdniao.com/)申请;
2. 开发者在配置文件设置`enable`的值`true`,然后其他信息设置
快递鸟平台中的appId和appKey。
应用场景:
小商场查询订单详情时,如果商品已发货,小商城后端会返回详细物流信息。
验证配置成功:
当配置好信息以后开发者可以litemall-core模块的`ExpressTest`测试类中设置快递公司编码和
真实测试快递单号,独立启动`ExpressTest`测试类查询物流信息。
#### 1.4.5.9 对象存储配置
对象存储,即存储和下载文件。
在litemall-core模块的`application-core.yml`文件中配置对象存储服务:
* 本地对象存储配置
如果开发者采用当前主机保存上传的文件,则需要配置:
```
litemall:
storage:
# 当前工作的对象存储模式分别是local、aliyun、tencent、qiniu
active: local
# 本地对象存储配置信息
local:
storagePath: storage
# 这个地方应该是wx模块的WxStorageController的fetch方法对应的地址
address: http://localhost:8080/wx/storage/fetch/
```
配置方式:
配置文件设置`active`的值`local`,表示当前对象存储模式是本地对象存储;
而`storagePath`是上传文件保存的路径;`address`则是访问文件的对外路径。
* 阿里云对象存储配置
```
litemall:
storage:
# 当前工作的对象存储模式分别是local、aliyun、tencent、qiniu
active: aliyun
aliyun:
endpoint: oss-cn-shenzhen.aliyuncs.com
accessKeyId: 111111
accessKeySecret: xxxxxx
bucketName: litemall
```
配置方式:
1. 阿里云官网注册
2. 配置文件设置`active`的值`aliyun`,表示当前对象存储模式是阿里云对象存储;
* 腾讯云对象存储配置
```
litemall:
storage:
# 当前工作的对象存储模式分别是local、aliyun、tencent、qiniu
active: tencent
# 腾讯对象存储配置信息
# 请参考 https://cloud.tencent.com/document/product/436/6249
tencent:
secretId: 111111
secretKey: xxxxxx
region: xxxxxx
bucketName: litemall
```
配置方式:
1. 腾讯云官网注册
2. 配置文件设置`active`的值`tencent`,表示当前对象存储模式是腾讯云对象存储;
* 七牛云对象存储配置
```
litemall:
storage:
# 当前工作的对象存储模式分别是local、aliyun、tencent、qiniu
active: qiniu
# 七牛云对象存储配置信息
qiniu:
endpoint: http://pd5cb6ulu.bkt.clouddn.com
accessKey: 111111
secretKey: xxxxxx
bucketName: litemall
```
配置方式:
1. 七牛云官网注册
2. 配置文件设置`active`的值`qiniu`,表示当前对象存储模式是七牛云对象存储;
#### 1.4.5.10 其他配置
除上述配置信息,本项目还存在其他配置。
目前仅采用默认值即可,开发者可以自己实践或者扩展新的配置信息。
## 1.5 部署方案
在1.4节中介绍的是开发阶段时一些关键性开发流程。本节将介绍代码开发成功以后开始部署项目时一些关键性流程。
首先需要明确的是开发时项目使用的服务地址是本地地址即localhost而部署时则应该根据具体情况设置合理的服务器地址和端口。
其次,需要明确的是各模块之间的关系:
* litemall-wx-api模块会包含litemall-core模块和litemall-db模块部署在服务器中
* litemall-admin-api模块会包含litemall-core模块和litemall-db模块部署在服务器中
* litemall-all模块则会包装litemall-wx-api模块和litemall-admin-api模块
* litemall-wx模块部署在微信开发者工具中此外数据API地址指向litemall-wx-api所在服务qi地址
* litemall-admin编译出的静态文件放在web服务器或者tomcat服务器此外服务器地址设置指向3中litemall-admin-api所在地址
最后,**如果项目部署云主机,则根据开发者的部署环境在以下文件中或代码中修改相应的配置。**
1. MySQL数据库设置合适的用户名和密码信息
2. 后端服务模块设置合适的配置信息;
3. 小商场前端litemall-wx模块`config/api.js`的`WxApiRoot`设置小商场后端服务的服务地址;
4. 管理后台前端litemall-admin模块`config/dep.env.js`中的`BASE_API`设置管理后台后端服务的服务地址。
实际上,最终的部署方案是灵活的:
* 可以是同一云主机中安装一个Spring Boot服务同时提供litemall-admin、litemall-admin-api和litemall-wx-api三种服务
* 可以单一云主机中仅安装一个tomcat/nginx服务器部署litemall-admin静态页面分发服务
然后部署两个Spring Boot的后端服务
* 也可以把litemall-admin静态页面托管第三方cdn然后开发者部署两个后端服务
* 当然,甚至多个服务器,采用集群式并发提供服务。
注意
> 1. `本机`指的是是当前的开发机
> 2. `云主机`指的是开发者购买并部署的远程主机
以下简单列举几种方案。
### 1.5.1 单机单服务部署方案
本节介绍基于腾讯云的单机单服务部署方案,面向的是服务器数据和应用部署在云主机单机中用于演示的场景。
其他云应该也是可行的。
主要流程是创建云主机安装ubuntu操作系统按照JDK和MySQL应用运行环境部署单一Spring Boot服务。
![](pic1/1-11.png)
#### 1.5.1.1 主机
请参考腾讯云官方文档进行相关操作。
1. 创建云主机虚拟机
2. 安装操作系统
本项目采用ubuntu 16.04.1,但是并不限制其他操作系统。
3. 创建安全组
![](pic1/1-4.png)
目前允许的端口808180828083808080443223306
注意:
这里其实只需要8080端口允许其他端口只是方面开发阶段的测试和调试。
4. 设置SSH密钥可选
建议开发者设置SSH密钥可以免密码登录云主机以及用于脚本自动上传应用。
5. 使用PuTTY远程登录云主机
如果开发者设置SSH密钥可以采用免密码登录否则采用账号和密码登录。
#### 1.5.1.2 JDK8
https://www.digitalocean.com/community/tutorials/how-to-install-java-with-apt-get-on-ubuntu-16-04
http://www.webupd8.org/2012/09/install-oracle-java-8-in-ubuntu-via-ppa.html
```bash
sudo add-apt-repository ppa:webupd8team/java
sudo apt-get update
sudo apt-get install oracle-java8-installer
sudo apt-get install oracle-java8-set-default
```
警告
> "ppa:webupd8team/java" 不是Oracle官方PPA可能存在安全隐患。
#### 1.5.1.3 MySQL
https://www.digitalocean.com/community/tutorials/how-to-install-mysql-on-ubuntu-16-04
```
sudo apt-get update
sudo apt-get install mysql-server
sudo apt-get install mysql-client
```
### 1.5.1.4 项目打包
1. 在主机或者开发机打包项目到deploy
```
cd litemall
cat ./litemall-db/sql/litemall_schema.sql > ./deploy/db/litemall.sql
cat ./litemall-db/sql/litemall_table.sql >> ./deploy/db/litemall.sql
cat ./litemall-db/sql/litemall_data.sql >> ./deploy/db/litemall.sql
cd ./litemall-admin
cnpm install
cnpm run build:dep
cd ..
mvn clean package
cp -f ./litemall-all/target/litemall-all-*-exec.jar ./deploy/litemall/litemall.jar
```
这里的工作是:
1. 把数据库文件拷贝到deploy/db文件夹
2. 编译litemall-admin项目
3. 编译litemall-all模块同时把litemall-admin编译得到的静态文件拷贝到
litemall-all模块的static目录
2. 修改litemall文件夹下面的*.yml外部配置文件当litemall-all模块启动时会
加载外部配置文件而覆盖默认jar包内部的配置文件。
例如配置文件中一些地方需要设置成远程主机的IP地址
此时deploy部署包结构如下
* bin
存放远程主机运行的脚本包括deploy.sh脚本和reset.sh脚本
* db
存放litemall数据库文件
* litemall
存放远程主机运行的代码包括litemall-all二进制可执行包和litemall外部配置文件
* util
存放开发主机运行的脚本包括package.sh脚本和lazy.sh脚本。
由于是本地开发主机运行,因此开发者可以不用上传到远程主机。
### 1.5.1.5 项目部署
1. 远程主机环境MySQL和JDK1.8)已经安装好,请确保云主机的安全组已经允许相应的端口。
2. 导入db/litemall.sql
```bash
cd /home/ubuntu/deploy/db
mysql -h localhost -u $ROOT -p$PASSWORD < litemall.sql
```
3. 启动服务
```bash
sudo service litemall stop
sudo ln -f -s /home/ubuntu/deploy/litemall/litemall.jar /etc/init.d/litemall
sudo service litemall start
```
4. 测试是否部署成功(xxx.xxx.xxx.xxx是云主机IP
```
http://xxx.xxx.xxx.xxx:8080/wx/index/index
http://xxx.xxx.xxx.xxx:8080/admin/index/index
http://xxx.xxx.xxx.xxx:8080/#/login
```
### 1.5.1.6 项目辅助脚本
在前面的项目打包和项目部署中都是采用手动命令来部署。
这里可以写一些脚本简化:
* util/packet.sh
在开发主机运行可以自动项目打包
* util/lazy.sh
在开发主机运行可以自动项目打包、项目上传远程主机、自动登录系统执行项目部署脚本。
注意:
> 1. 开发者需要在util/lazy.sh中设置相应的远程主机登录账号和密钥文件路径。
> 2. 开发者需要在bin/reset.sh设置远程主机的MySQL的root登录账户。
* bin/deploy.sh
在远程主机运行可以自动部署服务
* bin/reset.sh
在远程主机运行可以自动项目导入数据、删除本地上传图片、再执行bin/deploy.sh部署服务。
注意:
> 开发者需要在bin/reset.sh设置远程主机的MySQL的root登录账户。
总结当开发者设置好配置信息以后可以在本地运行lazy.sh脚本自动一键部署:
```bash
cd litemall
./deploy/util/lazy.sh
```
不过由于需要设置的信息会包含敏感安全信息强烈建议开发者参考这里的deploy文件夹
然后实现自己的deploy文件夹妥善处置外部配置文件和脚本中的敏感安全信息!!!
### 1.5.2 单机多服务部署方案
### 1.5.2 集群式云部署方案
由于本项目是面向微小型企业的小商城系统,因此预期的分布式部署方案是
1. 专门的云数据库部署数据
2. 专门的云存储方案
3. 专门的CDN分发管理后台的静态文件
4. 一台云主机部署管理后台的后端服务
5. 一台或多台云主机部署小商场的后端服务
虽然由于环境原因没有正式测试过,但是这种简单的集群式场景应该是可行的。
在1.5.2节中所演示的三个服务是独立的,因此延伸到这里分布式是非常容易的。
但是,如果需要实现互联网式分布式云部署,目前的项目架构和方案不支持。
至少每个功能模块应该是独立服务系统。此外,需要引入单点登录系统、集群、缓存
和消息队列等多种技术。因此如果开发者需要这种形式的分布式方案,请参考其他项目。
## 1.6 上线方案
在1.5节部署方案中,我们介绍了多种部署的方案,但是实际上这些方案都不能立即用于正式环境:
1. 正式环境需要域名和HTTPS证书
2. 小商场的小程序端对服务器域名存在接入要求。
本节采用`www.example.com`域名作为示例。
注意
> `www.example.com`仅作为实例,不是真实环境下的域名。
这里列举一种基于1.5.1的单机单服务上线方案即一个all后端服务同时提供三种数据
* 提供管理后台的前端文件;
* 提供管理后台前端所需要的数据;
* 提供小商城前端所需要的数据。
![](pic1/1-12.png)
开发者可以基于自身业务采用其他上线方案。
### 1.6.1 域名
1. 注册域名,通常商业性的网站采用`.com`
2. 解析域名到服务器公网IP采用`ping`命令查看是否解析成功
3. 备案
### 1.6.2 nginx
https://www.digitalocean.com/community/tutorials/how-to-install-nginx-on-ubuntu-16-04
#### 1.6.2.1 nginx安装
采用命令
```bash
sudo apt-get update
sudo apt-get install nginx
```
有的文档会指出需要防火墙设置,但是腾讯云主机防火墙默认没有开启。
开发者这里自己可以开启设置,或者直接不开启。
打开浏览器,输入以下地址:
```
http://www.example.com
```
此时如果看到nginx的欢迎页面则安装成功。
安装以后:
* `/var/www/html`默认静态web文件目录
* `/etc/nginx`:
* `/etc/nginx/nginx.conf`:
* `/etc/nginx/sites-avaiable`:
* `/etc/nginx/sites-enabled`:
* `/etc/nginx/snippets`:
* `/var/log/nginx/access.log`:
* `/var/log/nginx/error.log`:
#### 1.6.2.2 https
1. 申请证书
可以参考[腾讯云 域名型证书申请流程](https://cloud.tencent.com/document/product/400/6814)
2. 下载证书
这里使用nginx文件夹下面的密钥文件例如`1_www.example.com_bundle.crt`和`2_www.example.com.key`
3. 部署证书到nginx
可以参考[腾讯云 证书安装指引](https://cloud.tencent.com/document/product/400/4143)
把两个密钥文件保存的`/etc/nginx`文件夹,然后修改`/etc/nginx/nginx.conf`文件:
```
server {
listen 443;
server_name www.example.com;
ssl on;
ssl_certificate /etc/nginx/1_www.example.com_bundle.crt;
ssl_certificate_key /etc/nginx/2_www.example.com.key;
ssl_session_timeout 5m;
ssl_protocols TLSv1 TLSv1.1 TLSv1.2;
ssl_ciphers ECDHE-RSA-AES128-GCM-SHA256:HIGH:!aNULL:!MD5:!RC4:!DHE;
ssl_prefer_server_ciphers on;
}
```
4. 重启nginx
打开浏览器,输入以下地址:
```
https://www.example.com
```
此时可以看到https协议的nginx欢迎页面。
#### 1.6.2.3 反向代理Spring Boot后端
修改`/etc/nginx/nginx.conf`文件配置nginx静态web文件目录
```
server {
location / {
proxy_pass http://localhost:8080;
proxy_set_header Host $host;
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
}
}
```
打开浏览器,输入以下地址:
```
https://www.example.com/wx/index/index
https://www.example.com/admin/index/index
https://www.example.com/admin/index/index
```
此时,看到后端数据说明反向代理配置成功。
#### 1.6.2.4 全站加密
服务器自动把http的请求重定向到https
```
server {
listen 80;
server_name www.example.com;
rewrite https://$server_name$request_uri? permanent;
}
```
打开浏览器,输入以下地址:
```
http://www.example.com
```
总结经过以上不同方面的配置nginx这里最终的配置是如下
1. 证书`1_www.example.com_bundle.crt`和`2_www.example.com.key`放置在
`/etc/nginx/`文件夹内。
2. 把`/etc/nginx/nginx.conf`文件进行修改,具体可以参考[本项目的nginx.conf](./pic/nginx.conf)
3. 重启nginx
注意:
> 本人对nginx也不了解仅仅依靠网络知识配置了简单的效果。
> 更多配置方法和功能,请开发者自行学习。
### 1.6.3 小商场上线
在1.6.2.3节"反向代理Spring Boot后端"成功以后,其实小商场的后端已经上线成功。
这里介绍小商场的前端上线过程:
上线之前需要修改代码或者配置文件:
1. litemall-wx-api模块的WxOrderController类的payNotify方法的链接换成合适的地址。
注意:
> 换成什么地址都可以,但是这里不应该暴露出来。也就是说这个地址是微信支付平台
> 和这里的小商场后端服务之间的交互API对外公开会存在安全隐患。
2. litemall-core模块需要配置application-core.yml
```
litemall:
wx:
app-id: wxa5b486c6b918ecfb
app-secret: e04004829d4c383b4db7769d88dfbca1
mch-id: 111111
mch-key: xxxxxx
notify-url: http://www.example.com/wx/order/pay-notify
```
这里的`litemall.wx.notify-url`就是前面开发者自定义的地址。
3. litemall-wx模块的`project.config.json`文件调整相应的值,
特别是`appid`要设置成开发者申请的appid。
### 1.6.4 管理后台上线
在1.6.2.3节"反向代理Spring Boot后端"成功以后,其实管理后台已经上线成功,
包括管理后台的前端和后端,会同时对外提供管理后台的前端文件和后端数据。
当然,这里开发者需要自己的线上环境在以下文件中或代码中修改相应的配置。
1. MySQL数据库设置合适的用户名和密码信息
2. 管理后台后端服务模块设置合适的配置信息建议开发者参考deploy/litemall的外部配置文件
这样可以避免开发者对模块内部的开发配置文件造成修改;
3. 管理后台前端litemall-admin模块`config/prod.env.js`中的`BASE_API`设置管理后台后端服务的服务地址。
### 1.6.5 上线脚本
本项目目前没有上线脚本不过可以参考1.5.1节中的部署脚本。
### 1.6.6 项目优化
以下是部署方案中出现而在上线方案中可以优化的一些步骤。
#### 1.6.6.1 管理后台前端文件启动优化
litemall-admin编译得到的前端文件在第一次加载时相当耗时这里需要一些措施来优化启动速度
* 静态文件托管CDN
在上节中采用Spring Boot来分发管理后台的静态文件。
这里可以进一步地把静态文件托管到CDN当然这里是需要收费。
* gzip压缩
* 动态加载
#### 1.6.6.2 后端服务内部访问
原来后端服务包括小商城的后端服务和管理后台的后端服务可以通过域名或者IP直接对外服务而这里采用nginx反向代理后可以
通过80端口访问后端服务。因此会存在这样一种结果
* 用户可以https协议的80端口访问后端服务nginx反向代理
* 用户也可以通过http协议的8080访问后端服务spring boot
由于http不是安全的这里可能存在安全隐患
而如果取消后端服务的对外访问这样可以保证用户只能采用安全的https协议访问后端服务。
同时,对外也能屏蔽内部具体技术架构细节。
#### 1.6.6.4 nginx优化
本人对nginx不是很熟悉而nginx还存在很多可以调整优化的部分这里建议开发者
根据自己业务或架构情况优化。
## 1.7 项目管理
这里简述一些当前项目开发的要点。
### 1.7.1 项目.gitignore
当前项目的.gitignore不是单一文件而是多个模块都存在
* deploy/.gitignore
* litemall-admin/.gitignore
* litemall-admin-api/.gitignore
* litemall-core/.gitignore
* litemall-db/.gitignore
* litemall-wx-api/.gitignore
* litemall-all/.gitignore
* .gitignore
### 1.7.2 项目自动部署
#### 1.7.2.1 deploy部署
当前项目存在deploy部署文件夹这个是上述1.5.1节部署腾讯云主机所采取的一些脚本。
流程如下:
1. util脚本是当前开发主机运行用来打包项目和上传腾讯云主机
2. 打包项目时会编译打包项目相关模块到litemall和db文件夹中
3. bin脚本是云主机运行用来安装数据库、导入数据、启动项目服务。
这里deploy部署方式比较简单不灵活开发者可以参考开发自己的项目脚本。
#### 1.7.2.2 .gitlab-ci.yml部署
目前不支持
#### 1.7.2.3 docker部署
目前不支持
### 1.7.3 Spring Boot配置方案