寫在前面

這個項目大概是20天的課程，斷斷續續地跟著視頻敲，自己完善一些簡單的增刪改查等等，算是基本完成了。其實只是完成了主流程，即用戶搜索——放入購物車——注冊——登錄——下單——支付。也算是體會到了一個商城開發的不易了。這次學習全是前后端分離的，即后端只提供接口，前端調用接口。也是一種當下十分流行的結構了。在這個項目中使用了很多微服務框架(SpringCloud)，很多框架都是大概知道了怎么用，有什么用就上手了。如果日后再有這方面的需求或許會加深一些理解吧。

項目架構

首先來看架構圖:

Tips:大致解釋:前端主要使用了vue及其相關的框架來構建界面，通過nodejs來部署到服務器，請求的發送通過nginx進行轉發，全部請求都要經過網關進行處理，在網關處需要進行權限的鑒定和處理，確定有對應權限后才可以轉發訪問微服務集群。微服務集群有很多，不同權限的用戶可以訪問不同的微服務。所有的請求都是由網關進行轉發的，使用了相應的框架做了負載均衡，并有熔斷處理。微服務與微服務之間的通知調用使用了消息隊列框架來實現。最終使用了redis,mysql等來存儲不同類型的數據。使用了elasticsearch來當索引庫，作為搜索服務的數據庫。

使用的技術要點

前端技術：

基礎的HTML、CSS、JavaScript(基于ES6標準)

Vue.js 2.0以及基于Vue的UI框架：Vuetify

前端構建工具：WebPack

前端安裝包工具：NPM

Vue腳手架：Vue-cli

Vue路由：vue-router

ajax框架：axios

基于Vue的富文本框架：quill-editor

后端技術：

基礎的SpringMVC、Spring 5.0和MyBatis3

Spring Boot 2.0.1版本

Spring Cloud 最新版 Finchley.RC1

Redis-4.0

RabbitMQ-3.4

Elasticsearch-5.6.8

nginx-1.10.2

FastDFS - 5.0.8

Thymeleaf

JWT

踩坑記錄

1.在使用PageHelper插件做分頁模糊查詢時，由于數據庫連接參數沒有正確設置導致中文參數無法被識別。

解決方案：

url: jdbc:mysql://localhost:3306/leyou?useUnicode=true&characterEncoding=UTF-8&serverTimezone=Asia/Shanghai

以后每次寫jdbc連接路徑時都要寫上后面的編碼格式設置參數和時區設置參數

2.在使用了最新版本的spring-cloud和springboot后,eureka會自動導入一個jackson的解析包，使得我們的返回值都變成了xml.只需要在發起請求的類注解寫上produces,里面寫上JSON前綴即可。

@RequestMapping(value = "brand",produces = MediaType.APPLICATION_JSON_VALUE)

3.vue的相關命令:

npm init -y # 進行項目初始化

npm install vue --save # 安裝vue

npm install # 安裝依賴

npm run dev # 啟動項目

4.2020.7.2號晚11點，出現了莫名其妙的BUG，最后莫名其妙的好了。仔細思考后應該是因為前端的變量名沒有寫好，導致后端接收不正確。這也提醒了我以后一定要先寫好后端代碼再去寫前端，，，同時也要把邏輯理清楚，不然會出現很多莫名其妙的錯誤。

前端的v-model和script里面的變量名稱一定要對應起來，不然會出現意想不到的錯誤，同時也必須和后臺接口接收的變量名對應起來。處理的時候要理清前端和前端的關系，不要太著急，要仔細理清前后端的邏輯。

5.2020.7.3號晚11點 配置FastDFS配置了三個小時。從這次的配置里我學到了很多時候版本不同要配置的也不同，所以一定要跟著自己教程里的東西去配置，不要去下載最新版本什么的，因為網上的資料太層次不齊，搜到的不一定正確。還是要按照資料里給的配置去配置。同時一定要注意，配置linux的各種東西都十分繁瑣，一不小心會漏掉一步，因此一定要細心細心再細心。也算對linux的一些操作有了一些了解吧。或許會在以后自己的項目中用這個配置好的FastDFS。

6.關于vue里的watch執行周期:根據官方API文檔所說,如下回調:

// 該回調會在任何被偵聽的對象的 property 改變時被調用，不論其被嵌套多深

c: {

handler: function (val, oldVal) { /* ... */ },

deep: true

},

這樣的回調會在改變時調用，而我遇到的問題是在改變時卻沒有被調用，因此可以使用以下的情況:

// 該回調將會在偵聽開始之后被立即調用

d: {

handler: 'someMethod',

immediate: true

},

會在偵聽開始后立即被調用，這樣的handler方法一定會被執行。再結合deep屬性即可做到立即獲取對象了。

注：我在自定義的層級選擇器中和修改的表單中都加了該選項,頁面就會顯示完全了。

7.修改品牌的業務邏輯:先把中間表的所有相關部分刪除，再插入新的即可(想不到我會想這么久這玩意，好菜啊我)

8.在使用axios傳遞數據到后臺時,要使用$qs把Request Payload數據轉換成表單數據,不然后臺無法接收

9.在vue中的方法里的賦值語句可以使用js的表達式來進行操作,如name : name == 0?null:1 這樣的表達式

10.非坑 在學習完該項目后去補習一下java的lamda表達式和一些其他的基礎。java基礎太差了.

11.在redis中配置了配置文件后,需要使用

```sh

redis-server redis.conf

```

來啟動已配置好的redis

總結

通過這次的大型項目，也算是了解到真正的項目是有多么的復雜。在這次的項目中，很多技術我都是第一次聽說。而且很多技術都只是粗略地了解的一下，權當日后入門了吧。在這次編碼過程中，發現自己的java基礎還是很薄弱，暑假會再學習一下java的基礎，對java的基礎特性加強訓練。

源碼分享

總結

以上是生活随笔為你收集整理的乐优商城服务器部署_黑马乐优商城项目总结的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。