**前言**
`luban-mall` 項(xiàng)目脫胎于開源電商項(xiàng)目`mall`,并在這一開源醒目的基礎(chǔ)上由魯班學(xué)院以**伯樂老師**為代表等進(jìn)行了項(xiàng)目增強(qiáng)和完善。它是基于`SpringBoot+MyBatis`的電商系統(tǒng)劫映,包括**前臺(tái)商城系統(tǒng)**及**后臺(tái)管理系統(tǒng)**
前臺(tái)商城系統(tǒng)包含首頁門戶生真、商品推薦浅蚪、商品搜索浦夷、商品展示莱没、購物車举娩、訂單流程馒稍、會(huì)員中心华匾、客戶服務(wù)映琳、幫助中心等模塊。 后臺(tái)管理系統(tǒng)包含商品管理、訂單管理萨西、會(huì)員管理有鹿、促銷管理、運(yùn)營管理谎脯、內(nèi)容管理葱跋、統(tǒng)計(jì)報(bào)表、財(cái)務(wù)管理源梭、權(quán)限管理娱俺、代碼生成設(shè)置等模塊。將這一項(xiàng)目吃透废麻,對(duì)于Java開發(fā)人員來說非常有助于掌握java技術(shù)棧中主流的技術(shù)框架荠卷,既能學(xué)習(xí)電商項(xiàng)目的架構(gòu)技術(shù),也能熟悉和掌握電商項(xiàng)目中的業(yè)務(wù)開發(fā)脑溢。
**1 電商分布式架構(gòu)圖**
? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ??
**2 單體架構(gòu)**
對(duì)于個(gè)人學(xué)習(xí)而言僵朗,最開始我們選擇從單體架構(gòu)開始。后面項(xiàng)目的業(yè)務(wù)模塊多了和復(fù)雜起來之后屑彻,為了減少項(xiàng)目的耦合度才開始按照相互獨(dú)立的業(yè)務(wù)模塊拆分出微服務(wù)验庙,走分布式系統(tǒng)架構(gòu)路線。任何事情都應(yīng)該從簡單開始社牲,本電商項(xiàng)目的起步學(xué)習(xí)階段采用的是前后端分離的單體架構(gòu)技術(shù)粪薛。
**2.1 工程介紹**
| 工程名 | 描述 |
| --- | --- |
|? mall-common? | 基礎(chǔ)工程? ? |
|? mall-security? |? 基礎(chǔ)校驗(yàn)? |
|? mall-admin? |? 商品后臺(tái)管理系統(tǒng),包括商品中心搏恤、活動(dòng)管理和訂單管理等? |
|? mall-core? |? 電商系統(tǒng)業(yè)務(wù)核心系統(tǒng)违寿,主要進(jìn)行訂單處理? |
|? mall-search? |? ? 商品搜索 |
|? mb-generator? |? ? mybatis工具類 |
|? luban-admin-web? |? 管理后臺(tái)的web項(xiàng)目? |
| luban-front-web? ? |? 電商前端web項(xiàng)目? |
**2.2 技術(shù)選型**
前后分離
**后端技術(shù)選型**
|? 技術(shù)? |? 說明? |? 官網(wǎng)? |
| --- | --- | --- |
| Spring Boot? ? | 容器+MVC框架? ? | https://spring.io/projects/spring-boot? ? |
|? Spring Security? | 認(rèn)證和授權(quán)框架? ? |? https://spring.io/projects/spring-security? |
|? Mybatis? |? ORM框架? |? http://www.mybatis.org/mybatis-3/zh/index.html? |
|? MyBatisGenerator? |? 數(shù)據(jù)層代碼生成? |? http://www.mybatis.org/generator/index.html? |
|? PageHelper? |? MyBatis物理分頁插件? |? http://git.oschina.net/free/Mybatis_PageHelper? |
|? Swagger-UI? |? 文檔生成工具? |? https://github.com/swagger-api/swagger-ui? |
|? Elasticsearch? |? 搜索引擎? |? ? https://github.com/elastic/elasticsearch |
|? RabbitMq? |? 消息隊(duì)列? | https://www.rabbitmq.com/? ? |
|? Redis? | 分布式緩存? ? |? https://redis.io/? |
|? MongoDb? ? |? 文檔型數(shù)據(jù)庫 |? https://www.mongodb.com/? ? ? ? ? ? ? |
| zookeeper |? 分布式鎖? | https://zookeeper.apache.org/? ? |
|? Docker? ? ? |? 應(yīng)用容器引擎 | https://www.docker.com/? ? |
| Druid? ? ? |? 數(shù)據(jù)庫連接池 | https://github.com/alibaba/druid |
| OSS? |? 對(duì)象存儲(chǔ)? | https://github.com/aliyun/aliyun-oss-java-sdk? ? ? ? ? ? ? ? ? ? ? |
| JWT? ? ? | JWT登錄支持 |? https://github.com/jwtk/jjwt? ? ? |
| LogStash? | 日志收集? | https://github.com/logstash/logstash-logback-encoder |
| Lombok? | 簡化對(duì)象封裝工具 | https://github.com/rzwitserloot/lombok? ? ? |
| Seata | 全局事務(wù)管理框架 | https://github.com/seata/seata? ? ? |
| Portainer | Portainer| https://github.com/portainer/portainer? |
| canal? | 數(shù)據(jù)同步 | https://github.com/alibaba/canal|
**前端技術(shù)選型**
|? 技術(shù)? | 說明? ? |? 官網(wǎng)? |
| --- | --- | --- |
|? Vue? | 前端框架? ? |? https://vuejs.org/? |
| Vue-router? ? |? 路由框架? |? https://router.vuejs.org/? |
| Vuex? ? | 全局狀態(tài)管理框架? ? | https://vuex.vuejs.org/? ? |
| Element? ? | 前端UI框架? ? | https://element.eleme.io/? ? |
| Axios? ? | 前端HTTP框架? | https://github.com/axios/axios? ? |
| v-charts? | 基于Echarts的圖表框架 | https://v-charts.js.org/ |
**環(huán)境依賴**
|? 工具? |? 版本號(hào)? |? 下載? |
| --- | --- | --- |
|? JDK? |? 1.8? | https://www.oracle.com/technetwork/java/javase/downloads/jdk8-downloads-2133151.html? ? |
|Mysql? ? | 5.7? ? | https://www.mysql.com/? ? |
| Redis? ? |? 3.2? | https://redis.io/download? ? |
| Elasticsearch? | 6.2.2? | https://www.elastic.co/downloads? ? |
| MongoDb? | 3.2? | https://www.mongodb.com/download-center? ? |
| RabbitMq? | 3.7.14 |http://www.rabbitmq.com/download.html? ? |
|nginx? | 1.10? ? | http://nginx.org/en/download.html? |
**3 后端開發(fā)環(huán)境搭建**
關(guān)注筆者的微信公眾號(hào)**碼農(nóng)進(jìn)階之路2020**,發(fā)送消息【luban-mall】可獲得luban-mall項(xiàng)目的百度網(wǎng)盤下載地址熟空。
- 下載 luban-mall工程藤巢,包含模塊(mall-common,mall-security息罗,mall-admin掂咒,mall-core,mall-search迈喉,mb-generator
- IDE導(dǎo)入luban-mall項(xiàng)目
**3.1安裝Mysql數(shù)據(jù)庫并初始化數(shù)據(jù)**
- 安裝myql,創(chuàng)建數(shù)據(jù)庫绍刮,默認(rèn)mall
mysql的安裝可以參考這篇文章:MySQL 安裝
如果需要在Linux服務(wù)器上安裝Mysql5.7,請參考我的這篇文章:Linux系統(tǒng)云服務(wù)器上安裝Mysql5.7數(shù)據(jù)庫,解決不能遠(yuǎn)程訪問的bug
```sql
#使用root賬戶登錄命令行客戶端(如Navicat或IDEA中的DataSource)后執(zhí)行sql腳本創(chuàng)建mall數(shù)據(jù)庫
create database mall;
#設(shè)置全局密碼驗(yàn)證策略和長度限制挨摸,防止創(chuàng)建用戶授予密碼時(shí)報(bào)錯(cuò)
set global validate_password_policy=LOW;
set global validate_password_length=8;
#創(chuàng)建新的druid用戶及登錄密碼
create user 'druid'@'%' IDENTIFIED BY 'druid705';
#查詢r(jià)oot用戶是否具備給其他用戶授權(quán)的限制
use mysql;
SELECT host,user,Grant_priv,Super_priv FROM user where user='root';
#如果你以上查詢結(jié)果Grant_priv字段的值為'N',則執(zhí)行以下sql使root用戶可以給其他用戶授予操作權(quán)限
UPDATE user SET Grant_priv='Y' WHERE User='root';
FLUSH PRIVILEGES;
#授予druid用戶對(duì)mall庫下表的增刪改查權(quán)限和創(chuàng)建和刪除表孩革、視圖的一系列權(quán)限
GRANT CREATE,DROP,ALTER,INSERT,UPDATE,SELECT,DELETE on mall.* to 'druid'@'%' with grant OPTION;
```
- 創(chuàng)建好mall數(shù)據(jù)庫和druid用戶并使用root賬戶給其授權(quán)后就可以使用druid賬戶登錄連接mysql的mall數(shù)據(jù)庫,在客戶端命令控制臺(tái)中將項(xiàng)目根目錄下的`document/sql/mall.sql`腳本拷貝進(jìn)去并執(zhí)行建表和插入數(shù)據(jù)了
**3.2 Redis安裝**
讀者可參考這篇文章安裝緩存數(shù)據(jù)庫Redis:Redis 安裝 包含了windows系統(tǒng)和Linux系統(tǒng)下Redis的安裝得运,Redis官網(wǎng)建議使用Linux系統(tǒng)下安裝最新穩(wěn)定版本redis膝蜈,目前的穩(wěn)定版本為`redis-6.0.8`锅移。不過為了方便本地開發(fā),我們可以在本地安裝windows系統(tǒng)下的redis-3.2版本饱搏。上了測試和生產(chǎn)環(huán)境最好換成Linux系統(tǒng)下的Redis服務(wù)帆啃。
**3.3 ElasticSearch 安裝**
讀者可參考我的這篇文章:大數(shù)據(jù)分析利器ElasticSearch入門(一)? 安裝ES,不過筆者當(dāng)時(shí)安裝的版本是7.3.2版本窍帝,Linux和Windows系統(tǒng)下的安裝內(nèi)容都有努潘,而且步驟非常詳細(xì),對(duì)于安裝過程中出現(xiàn)bug進(jìn)行了解決和規(guī)避坤学。
**3.4 MongoDB 安裝**
(1) Windows 系統(tǒng)下安裝 MongoDB
讀者可參考菜鳥教程的這篇文章在Windows系統(tǒng)下安裝 MongoDB 文檔數(shù)據(jù)庫:
(2) linux 系統(tǒng)下安裝 MongoDB
讀者可參考菜鳥教程的這篇文章在Linux系統(tǒng)下安裝 MongoDB 文檔數(shù)據(jù)庫:
**3.4 RabbitMQ 安裝**
讀者可參考筆者的這篇文章安裝 RabbitMQ:快速入門高級(jí)消息中間件RabbitMQ? 文中囊括了 Windows 平臺(tái)和 Linux 平臺(tái)下消息隊(duì)列 RabbitMQ 的安裝
**4 啟動(dòng)后臺(tái)項(xiàng)目服務(wù)**
**4.1 啟動(dòng) mall-admin 項(xiàng)目服務(wù)**
修改mall-admin項(xiàng)目中`src/main/resource/application.yml` 中的Mysql數(shù)據(jù)庫連接配置信息
```yml
spring:
? datasource:
? ? url: jdbc:mysql://localhost:3306/mall?serverTimezone=UTC&useSSL=false&useUnicode=true&characterEncoding=UTF-8
? ? username: druid
? ? password: druid705
```
修改完成后運(yùn)行 mall-admin 模塊中`AdminApplication`啟動(dòng)類中的Main 方法啟動(dòng)mall-admin服務(wù)疯坤,端口號(hào)為8091
**4.2 啟動(dòng) mall-core 項(xiàng)目服務(wù)**
在 mall-core 項(xiàng)目中的啟動(dòng)配置項(xiàng)中的 redis、mongodb 和 rabbitmq 服務(wù)器連接參數(shù)換成自己安裝時(shí)配置的參數(shù)值
`application.yml`
```yml
spring:
? datasource:
? ? url: jdbc:mysql://localhost:3306/mall?serverTimezone=UTC&useSSL=false&useUnicode=true&characterEncoding=UTF-8
? ? username: druid
? ? password: druid705
? ? druid:
? ? ? initial-size: 5 #連接池初始化大小
? ? ? min-idle: 10 #最小空閑連接數(shù)
? ? ? max-active: 20 #最大連接數(shù)
? ? ? web-stat-filter:
? ? ? ? exclusions: "*.js,*.gif,*.jpg,*.png,*.css,*.ico,/druid/*" #不統(tǒng)計(jì)這些請求數(shù)據(jù)
? ? ? stat-view-servlet: #訪問監(jiān)控網(wǎng)頁的登錄用戶名和密碼
? ? ? ? login-username: druid
? ? ? ? login-password: druid
? data:
? ? mongodb:
? ? ? host: 134.175.187.61
? ? ? uri: mongodb://mongod:<password>@<host>:27017/test
? redis:
? ? host: 134.175.187.61 # Redis服務(wù)器地址
? ? database: 0 # Redis數(shù)據(jù)庫索引(默認(rèn)為0)
? ? port: 6379 # Redis服務(wù)器連接端口
? ? password:? # Redis服務(wù)器連接密碼(默認(rèn)為空)
? ? jedis:
? ? ? pool:
? ? ? ? max-active: 8 # 連接池最大連接數(shù)(使用負(fù)值表示沒有限制)
? ? ? ? max-wait: -1ms # 連接池最大阻塞等待時(shí)間(使用負(fù)值表示沒有限制)
? ? ? ? max-idle: 8 # 連接池中的最大空閑連接
? ? ? ? min-idle: 0 # 連接池中的最小空閑連接
? ? timeout: 3000ms # 連接超時(shí)時(shí)間(毫秒)
? rabbitmq:
? ? host: localhost
? ? port: 5672
? ? virtual-host: /? #mall
? ? username: admin
? ? password: admin123
? ? publisher-confirms: true #如果對(duì)異步消息需要回調(diào)必須設(shè)置為true
```
注意: 上面的mongdb連接的和需要替換成你自己配置mongodb是創(chuàng)建的mongod用戶密碼和mongodb服務(wù)安裝所在的服務(wù)器IP地址或著域名
依次次啟動(dòng)redis服務(wù)深浮、mongodb服務(wù)和rabbitmq服務(wù)压怠,然后運(yùn)行啟動(dòng)類`CoreApplication.java`中的main方法,啟動(dòng) `CoreApplication` 項(xiàng)目飞苇,服務(wù)端口為8081
**4.3 啟動(dòng) mall-search 服務(wù)**
啟動(dòng) elastic-search服務(wù)菌瘫,并修改 `mall-search` 模塊中的應(yīng)用能啟動(dòng)配置文件`application.yml` 中關(guān)于 mysql 數(shù)據(jù)庫和 elasticsearch 的客戶端連接配置信息對(duì)應(yīng)自己安裝時(shí)的參數(shù)值
`application.yml`
```yml
spring:
? datasource:
? ? url: jdbc:mysql://localhost:3306/mall?serverTimezone=UTC&useSSL=false&useUnicode=true&characterEncoding=UTF-8
? ? username: druid
? ? password: druid705
? ? druid:
? ? ? initial-size: 5 #連接池初始化大小
? ? ? min-idle: 10 #最小空閑連接數(shù)
? ? ? max-active: 20 #最大連接數(shù)
? ? ? web-stat-filter:
? ? ? ? exclusions: "*.js,*.gif,*.jpg,*.png,*.css,*.ico,/druid/*" #不統(tǒng)計(jì)這些請求數(shù)據(jù)
? ? ? stat-view-servlet: #訪問監(jiān)控網(wǎng)頁的登錄用戶名和密碼
? ? ? ? login-username: druid
? ? ? ? login-password: druid
? data:
? ? elasticsearch:
? ? ? repositories:
? ? ? ? enabled: true
? ? ? cluster-nodes: localhost:9200
? ? ? cluster-name: elasticsearch
? elasticsearch:
? ? rest:
? ? ? uris: ["http://localhost:9200"]
```
然后再運(yùn)行`SearchApplication`啟動(dòng)類中的main方法,在筆者的本地開發(fā)環(huán)境啟動(dòng)過程中報(bào)了加載 `elasticsearch` 節(jié)點(diǎn)失敗的異常布卡,但并不影響項(xiàng)目正常啟動(dòng),服務(wù)端口為8500雨让。異常信息如下:
```bash
2020-11-28 16:30:31.783 ERROR 24136 --- [? ? ? ? ? main] .d.e.r.s.AbstractElasticsearchRepository : failed to load elasticsearch nodes : org.elasticsearch.client.transport.NoNodeAvailableException: None of the configured nodes are available:
```
異常信息顯示配置的 `elasticsearch` 節(jié)點(diǎn)不可用,這個(gè)問題后面有時(shí)間研究設(shè)計(jì)ES查詢業(yè)務(wù)時(shí)再來解決忿等。到時(shí)解決了筆者再專門發(fā)一篇關(guān)于ES的文章栖忠。
**5 啟動(dòng)后臺(tái)管理前端項(xiàng)目服務(wù)**
關(guān)注筆者的微信公眾號(hào)**碼農(nóng)進(jìn)階之路2020**,發(fā)送關(guān)鍵詞信息【luban--web-admin】即可獲得下載魯班電商項(xiàng)目后臺(tái)管理項(xiàng)目的前端代碼克隆地址
前端項(xiàng)目基于Vue+Element實(shí)現(xiàn)贸街。需要依賴 `nodejs`庵寞,所以需要提前下載安裝`nodejs`。`nodejs` 下載地址: [nodejs安裝包下載地址](https://nodejs.org/dist/v8.9.4/node-v8.9.4-x64.msi)
使用git將 `luban-web-admin`項(xiàng)目克隆至本地后使用 `VScode` 以打開文件夾的方式打開項(xiàng)目薛匪,在 `TERMINAL` 命令行控制臺(tái)中執(zhí)行 `npm install`命令完成項(xiàng)目依賴包的安裝捐川,如果按照過程中出現(xiàn) `node-sass` 安裝失敗的問題,請參考這篇文章解決:node-sass 安裝失敗的各種坑
安裝依賴模塊成功后逸尖,執(zhí)行 `npm run dev` 命令在本地啟動(dòng)前端項(xiàng)目服務(wù)古沥。
項(xiàng)目啟動(dòng)成功后控制臺(tái)顯示服務(wù)運(yùn)行在 `http://localhost:8090`
**6 電商后臺(tái)管理項(xiàng)目效果體驗(yàn)**
前后端項(xiàng)目啟動(dòng)成功后,在谷歌瀏覽器中輸入 ` http://localhost:8090`
會(huì)彈出登錄對(duì)話框冷溶,輸入 admin用戶名渐白,密碼:admin1234尊浓,然后點(diǎn)擊登錄
后臺(tái)用了`spring-security` 技術(shù)對(duì)用戶的操作請求進(jìn)行了認(rèn)證和鑒權(quán)攔截逞频。
登錄成功后,就進(jìn)入了電商后臺(tái)管理系統(tǒng)的主頁面
luban-mall?微電商項(xiàng)目的環(huán)境搭建和本地服務(wù)啟動(dòng)準(zhǔn)備內(nèi)容就講到這里栋齿,文章首發(fā)個(gè)人的微信公眾號(hào)“碼農(nóng)的進(jìn)階之路2020",歡迎初次閱讀筆者文章的讀者朋友們加個(gè)關(guān)注苗胀,筆者會(huì)不定期推送技術(shù)干貨文章襟诸,與讀者粉絲們共同成長。