學成線上專案總結 - Day1 CMS服務端搭建

Borris發表於2020-07-24
服務端
系列文章：
學成線上專案總結 - Day1 CMS服務端搭建 學成線上專案總結 - Day2 CMS前端開發 學成線上專案總結 - Day3 CMS頁面管理開發 學成線上專案總結 - Day4 頁面靜態化 學成線上專案總結 - Day5 RabbitMQ訊息佇列

這個專案是模仿一個線上教育網站，使用spring boot 和 spring cloud 來搭建的一個實踐專案。我跟著黑馬程式設計師的網課進行學習，將歷時20天。

架構圖

學成線上專案 - Day1

網站分為五個板塊：

  • 門戶，一個訪問學成線上內容的入口
  • 學習中心，為學生提供學習功能的平臺
  • 教學管理中心，為老師提供教學管理的平臺
  • 社交系統，為師生交流提供一個互動的平臺
  • 系統管理中心，為系統管理員維護管理系統執行

技術架構

學成線上專案總結 - Day1

使用前後端分離架構開發，分層設計，每一層承擔不同職責。

  • 前後端分離的好處：將程式碼分為若干個前後工程，可以將不同的小工程分別部署。

看到技術架構圖的時候，還是有點被嚇到的，雖然條理清晰，分層清楚，但是每層涉及到的內容實在太多，有點看不過來。想到去年暑假自己在小公司實習時做的一個考勤管理系統，實在是太小兒科了。希望做完這個專案之後能夠反思一下之前專案的不足，以便在面試中不被問倒。。

看完之後感覺還是很清晰的。作為Java後端工程師，需要重點掌握微服務層和資料層的一些技術。

使用者層

面向不同方式訪問的使用者。如PC，APP，H5.

CDN (內容分發網路)

是一個快取層，快取靜態資源，提高使用者的訪問效率。

負載均衡

Nginx屬於這一層。由於之後的層有很多不同功能的系統，使用負載均衡，可以將使用者的需求平均分攤到各個不同的節點。

UI層

實現使用者介面，是前後端分離中的前端。針對不同使用者，開發出不同的介面。和微服務層相互獨立，透過網路協議進行通訊。

微服務層**

一套統一的供前端訪問的服務。利於系統的可擴充套件性，可維護性。從結構圖中可以看到，微服務層把功能細分，提高了服務的可獨立性。每一塊功能獨立部署，可以根據具體需求獨立開發某一塊功能。

資料層*

供微服務層訪問，微服務層會將資料持久化到資料庫。使用到了Mysql和MongoDB以及其他一些。

其他的一些層

DevOps: 用於系統開發運維的工具，git, docker, spring cloud 等
外部系統介面：第三方登入，郵件等

技術棧

學成線上專案總結 - Day1

以上是後端需要重點掌握的技術棧。

開發步驟

  • 需求分析
  • 介面定義
  • 服務端和前端並行開發
  • 前後端整合測試

CMS 需求分析

CMS是一個內容管理系統。不同專案具體定位不同。對於這個專案，CMS系統將對各個網站頁面進行管理，根據不同內容快速進行頁面開發，上線。

準備工作

  • 下載安裝 WebStorm
  • 下載啟動 Nginx
    • 說明：使用Nignx時需要使用命令列開啟和終止服務。終止服務時，如果使用 git bash 的話，需要在 nginx 命令前加 ./，否則會報 command not found 錯誤。（這個錯誤折磨了我好久）看這裡
  • 搭建靜態門戶工程
    • 由於前端程式碼已經搭建，直接匯入WebStorm即可。
    • 在nginx資料夾裡配置虛擬主機，以便透過前端工程路徑用瀏覽器訪問頁面
    • 在windows的C:\Windows\System32\drivers\etc\host中新增一個域名，使得輸入自定義網址也可以訪問前端介面

SSI技術

SSI技術，Server Side Include，服務端包含。
主頁面包含很多板塊，比如導航欄，側邊欄，輪播圖等等。我們可以將這些內容分為一個個小的板塊，再用Ngnix支援的SSI技術把這些板塊拼裝到主頁面上。

使用服務端包含技術，可以更方便管理不同板塊小頁面內容。

  • 具體使用：
    • 在Nginx配置檔案中開啟SSI支援
      ssi on;
ssi_silent_errors on;
    • 在需要新增小版塊的介面使用 <!--#include virtual="/include/header.html"-->新增小版塊的內容

頁面管理需求

  • 建立站點
    • 主站點，子站點。確定好之後，才能確定不同頁面的歸屬
  • 建立模板
    • 很多頁面的佈局，版式相同，不同的只是其中的內容。透過建立模板，以及對其中內容的填充，可以提升頁面構建的效率。
  • 建立頁面
  • 頁面預覽
  • 頁面釋出

匯入工程

  • 使用JDK1.8版本，並且將編碼格式統一為UTF-8
  • 分別匯入父工程和其他基礎工程，我們未來新建的微服務工程都可以依賴基礎工程
  • 匯入基於MongoDB的CMS資料

模型定義*

需求分析

以定義頁面查詢為例，我們有如下需求：

  • 分頁查詢MongoDB資料庫中cms_page集合下的資料
  • 根據站點Id、模板Id、頁面別名查詢頁面資訊
  • 介面基於Http Get請求，響應Json資料（使用Spring MVC中的方法）

三種模型類：
CmsSite - 站點模型
CmsTemplate - 頁面模板
CmsPage - 頁面資訊。定義一個頁面需要定義其所屬的站點和使用的模板。

以上三個模型類位於..\xc-framework-model\src\main\java\com\xuecheng\framework\domain\cms中，並使用到了三個註解：
- @Data，@ToString 是 Lombok 提供的註解，編譯時自動生成成員變數 getter/setter 以及 toString 方法。
- @Document 和 MongoDB 資料庫中的對應表格建立連線

介面定義*？（重點理解）

我們要開發頁面查詢服務端，需要先定義一個頁面查詢介面。
我們需要定義一個請求模型QueryPageRequest，使其繼承 RequestData 用來識別介面請求響應的資料模型。

接下來介面的定義將在api工程下建立，這樣可以使介面集中管理，使之後的微服務呼叫介面時更加方便。

所有列表查詢結果的介面，返回值都要定義為QueryResponseResult，因為QueryResponseResult繼承了ResponseResult，會返回一個列表和查詢結果資訊。

如何定義一個介面？

  • 明確需求：請求什麼？響應什麼？由此定義一個模型
  • 定義模型類響應介面

在定義完成介面後，我們需要新建一個微服務工程編寫此介面的實現類。

頁面查詢服務端開發*

這是今天開發的重中之重，所有的開發步驟也將在之後經常用到，所以需要熟練理解掌握。

前面的工作以及建立好了所需的介面，於是我們現在可以建立一個新的基於 spring boot 的 maven 工程，來實現介面的功能，這個工程的父工程是 xc‐framework‐parent 。

開發步驟及注意事項如下：

1. 在pom.xml中新增所需依賴

2. 配置 application.yml 來提供連結 MongoDB 的配置資訊，並新增logback-spring.xml作為日誌配置資訊

3. 建立 SpringBoot 啟動類

  • 這個啟動類需要在所建工程的根目錄下，這樣才可以掃描到同級別包的類及其子類。
  • 使用@SpringBootApplication表示這是一個啟動類
  • 使用@EntityScan掃描 com.xuecheng.framework.domain.cms下的實體類，使用@ComponentScan掃描 com.xuecheng.framework.api 介面
  • 注意主方法中執行SpringBoot呼叫的是SpringApplication中的run方法，而不是SpringBootApplication。這個錯誤使我耽誤了十幾分鍾。

    4. 定義Dao中的分頁查詢介面

  • 由於我們使用MongoDB作為分頁查詢的資料庫，我們要使持久層介面繼承MongoRepository，並定義其實體型別和主鍵型別分別為CmsPage和String。
  • 在介面中新增成員方法，我們也可以根據findByXXX，findByXXXAndYYY、countByXXXAndYYY等規則自定義方法
  • 定義完成後，可以在測試類中編寫測試程式碼來測試介面

    5. 在Controller中建立業務層實現類

本作品採用《CC 協議》，轉載必須註明作者和本文連結

相關文章