? 技術棧

后端

• Java 8
• 開發框架：SpringBoot 2.x
• 數據訪問：MyBatis Plus
• 項目管理：Maven
• 接口文檔：Knife4j

存儲

• 數據庫：MySQL（微信云托管平臺）
• 對象存儲：Tencent COS
• CDN：Tencent CDN

項目進度

數據庫搭建（遠程開通）

微信云托管：https://cloud.weixin.qq.com/cloudrun

作用：可以幫助用戶快速地托管后端的服務，可以快速地托管項目，幫助用戶運維開發，提供數據庫之類的服務

但是，這東西是要錢的

現在已經讓微信云托管配合騰訊云幫助我們初始化好了數據庫，并且現在我們可以可視化地在任何電腦上對數據庫進行管理

現成的云服務會比本地的數據庫方便很多

搭建基礎demo，整合框架

jar包：直接運行

war包：配合Tomcat等服務器進行訪問

Lombok：團隊中最好不要使用

? 原因：在企業的團隊開發中，如果有隊友、同事用的編輯器跟你的不一樣，那他可能會報錯；再或者沒裝插件、或者你在服務器上安裝，在服務器上編譯也有可能出問題（主要就是為了統一團隊的開發）

搭建好后運行一下

數據庫沒有指定數據源

原因：因為我們引入了數據庫的驅動，所以必須要指定這東西

不管了，一頓操作猛如虎，先把它的架構搭建起來

刪掉：

因為這些都是前后端項目一體化的遺留物

啟動web項目，可以在網頁中訪問

新建一個HealthController（心跳檢測Controller）：用來檢測我們的項目能否成功運行

然后改一下配置文件（properties的語法稍微麻煩，就用yml）

接下來還沒法運行，因為上面那個數據庫的報錯還沒解決

我們可以先把數據庫關掉（一個防止數據庫注入的注解）

拿報錯一搜就出來了https://blog.csdn.net/qq_45498460/article/details/112860809

@SpringBootApplication(exclude = DataSourceAutoConfiguration.class)

沒有訪問路徑的話它默認是根路徑了

我們也可以自己去配置它的訪問路徑

加一個后端的標識，再去把心跳檢測的路徑改為health

要用requestMapping來指定路徑

整合數據庫

這一步呢，我們去配置一下數據庫的配置就可以了，如果是在企業中開發，最好是要去用一個連接池

這里我們可以使用Druid，我們先去GitHub上找一下配置，搜索Druid spring boot starter

加上我們的URL，用戶名和密碼（URL記得加上MySQL協議名）

接下來我們將屏蔽MySQL的注解去掉，跑一下

引入Mybatis-Plus框架，實現數據庫的增刪改查

首先我們先去一下它的官網，他這東西可以很方便地簡化開發

它是一個數據訪問層的二次封裝的框架

我們直接快速開始

最新版本是3.4.3.4

使用就跟著官網來

它其實就是幫你掃描出來mybatis-plus幫助你生成的mapper

2. 編寫實體類

   先搞一下庫表，在通過逆向工程自動生成實體類，具體操作步驟看官方文檔

編寫Controller類

接下來創建controller類，打上注解

寫上增刪改查

首先寫插入表情

先判斷一下條件，如果為空就返回個-1以示尊敬

再return一個emojiService.save方法

這里我們注意到一個問題，就是它這個save方法它返回的是一個布爾類型

我們看一眼官網有沒有提供返回其他類型的方法

、

可見全部都是返回的布爾值

所以我們可以當它成功插入到數據庫后，我們就直接返回它的id，看它有沒有被賦值為在數據庫中新插入的數據主鍵值

然后是更新表情

我們依然是判斷一下，如果emoji是空或者getid他兩之間有一個是空的話嗎，就返回一個-1

然后我們還是調用現成的方法啊

看它返回的類型。還是布爾值

update返回一個布爾值也是合情合理的，所有我們干脆都返回布爾值吧

然后接下來寫搜索表情

搜索表情我們可以允許它搜索出來返回值是空，所以我們就不需要判斷它是否為空了

我們先看看官網有沒有分頁查詢的方法

下面兩個是map的啊，那我們就用第二個吧

它這個方法首先接收一個page參數，那就只能new 一個page

看看page接收哪些值啊

ceurrent:就是當前是第幾頁

size：每頁有多少條

后面就是我們的查詢參數

我們看看能不能寫一個queryWrapper

把emoji這個實體類注入進來 return 一個Ipage吧

最后再加一個GetMapping

這里我們再加一個條件判斷

如果前端傳來的它不是null，而是一個空字符串，那我們直接把emoji.setName設置為空，因為如果我們不去處理這個空字符串的話，它也會把這個空字符串塞到這個查詢條件里的，這樣就什么都查不出來了

而且還有一個點要提一下

emoji.getName().equals("")

這是我之前很容易犯的一個很經典的錯誤，這個我們要把它反過來

因為這個emoji.getName()這個屬性它有可能為null，如果它為null的話，他是沒有equals方法的，equits方法是Object對象才會有的方法 。也就是說，當它為null的時候，它沒有equits方法，它就會直接報錯

最后是刪除表情

這里我們可以引入一個邏輯刪除的插件，避免我們在采取removebyid的時候真實地把這條數據給刪除了。

我們可以來看看數據庫

這個isdelete字段就是判斷我們的這條數據是否是有效的，0表示這條數據是有效的，1表示這條數據是無效的。而我們在刪除數據時，我們只需要把這個0改成1就可以了

還是去官網看看怎么引入mybatis-plus的邏輯刪除插件

在application.yml 這個springboot項目的全局配置里，去引入插件的配置

來都來了，順便有一個問題解決一下，

這里我們漏加了個 /father 順帶加上

第二步加上 注解表示邏輯刪除

找到我們的實體類

這里我們已經引入了

現在我們邏輯刪除就完成了。這個邏輯刪除插件安裝之后，mybatis-plus就會自動幫我們把這個removebyid從真實刪除改為邏輯刪除，

把isdelete從0改為1

最后別忘了加上postmapping

其實除了查詢之外，其他的都可以用PostMapping,問題不大

然后我們啟動一下項目，這個時候我們只能調用getMapping查詢，因為post請求沒有辦法在瀏覽器的地址里面直接測，所以我們來試一下

這個時候 會發現total為0，這里就出了點問題

我們去試著去官網找一個分頁插件

最新版的使用了一個攔截器

我們就來寫一個config，讓springboot mybatis-plus starter自動注入

復制粘貼一下，把舊版刪了

H2記得改成MYSQL

再運行一次

明顯發現，這次total正常了

然后回到剛剛這個MYSQL這里，這其實是一些方言，這是一種設計模式，我們可以通過不同的方言來改變這個設計模式的行為。設計模式就是幫你寫出更通用，更好維護的代碼

方言就是指，比如這個過濾器，它是用來處理SQL的。但是它SQL有很多種SQL，有MySQL，有SQL Server，有Oracle，這些都是屬于SQL的方言，他們雖然說SQL的語法都比較像，但他們都有一些特殊的地方，和我們現實中的方言是一樣的

統一返回類型

現在我們的增刪改查已經寫完了

接下來我們會發現一個問題：

就是我們會發現controller里這樣返回好像有點不優雅

在企業中貌似也不會像這樣直接返回一個int類型，一個bool類型這樣，我們一般可以統一返回類型，封裝一個響應類BaseResponse,這里再加一個泛型< T >

這個T表示就是Java的泛型，這個T可以代表任何類型。

在實際情況下我們要把它替換為controller返回的int類型，bool類型等等 這是一個通用的返回基類

這里我們也給它加一個Lombok和一個構造函數，但是實際上是不建議的，使用快捷鍵一樣很簡單

我們再生成一個ResultUtils，利用這個去給它生成一個成功或者失敗的響應類

打上注釋：響應工具類

寫一個靜態方法

這里的code用0比較好，200一般是第三方調用傳入的時候用的

再來寫一個返回失敗

數據data就不需要傳入了，傳入一個自己定義的錯誤碼和錯誤信息就好了

整好后我們可以去controller里面改一改

Integer:泛型是不支持基本類型的，所以我們要把它改為封裝類

code：40000相當于從客戶端傳來的請求是有問題的

增刪改查都是一樣的，復制粘貼就行

在我們使用了這個ResultUtils工具類之后，我們就不用重復地去填充code是0，返回消息是成功等等這些信息了，直接用ResultUtils.succes這一行代碼就搞定了

現在我們再運行一下

會發現多了一個code，這個是響應碼；data，我們真實響應的數據；message ok 這是我們傳遞給前端的信息

引入接口插件

因為我們現在沒有辦法去測試增刪改接口，只能去測試查詢接口。

（post請求沒有辦法在瀏覽器的地址里面直接測）

所以我們接下來引入一個swagger接口插件，去生成一個接口文檔。

這里我們不去直接引入swaagger，一個是swagger學springboot的都會接觸到，還有一個原因是swagger的默認頁面沒這個好看，所以我們去引入一個項目，叫knife4j

接口文檔有很多，swagger是一個老牌的接口文檔，還是比較穩定的。而這個knife4j就是在swagger的基礎上給你封裝了一層界面，也挺好用的

我們可以來看看它的文檔

直接跟著快速開始來

導包，粘貼配置

以下反正都是寫不寫都行

這里要指定它要掃描的接口它在那個目錄下，我們要指定包名到controller

現在差不多就可以用了，我們可以直接執行看一下

http://localhost:8080/api/doc.html

Knife4j 接口文檔

這個接口文檔已經自動生成了，我們沒有在這個controller里增加任何一個注解，它全部交給swagger幫助我們生成了

如果要補充一些什么的話，我們就用@API這些注解去給他打上什么注解就可以了，這點都是一樣的

我們測試一下

這也證明了我們通過這個save方法向數據庫插入數據之后，這個mybatis就會自動地給我們將數據庫中這個新創建的emoji的主鍵值注入到這個id對象里面，我們只要通過emoji獲取id，就能拿到最先插入的這個id值

這個controller可以說差不多搞完了

我們前后端對接一般用的http+JSON格式，然后如果說你要前端給后端發送JSON格式的話,你如果使用springmvc框架，你這里要打上一個注解，叫@RequestBody注解，要不然它是沒辦法識別出來你前端請求的JSON數據的，必須要加上這么個注解

然后你在controller類的這么一個開頭加上@RestController注解的話，它就能給你這個類里面編寫的所有的接口的返回值，都去返回JSON格式

這里我們給所有的值都加上@RequestBody注解，getMapping我記得好像是不用加的

JSON格式它會自動映射到這個對象，然后給這個對象賦值，這樣就可以接收這個參數了。

接下來我們去做文件上傳功能

文件上傳

關于文件上傳，我們可以先去看一篇文章，分享了一些文件上傳的思路，我們可以先去看看

? https://blog.csdn.net/weixin_41701290/article/details/119673689?spm=1001.2014.3001.5501

最好理解的就是里面的這個秒傳

就是有一個現象，當你第一次上傳一個很大的文件時，它也許上傳的賊慢，但是如果當你第二次上傳這個文件的時候，它會1秒鐘刷的一下就給你上傳上去了。這個現象就是秒傳

原因是因為這個文件，只要我們傳過一次，它就傳到了別人的服務器上了，我們再去傳相同的文件時呢，它會先根據這個文件，去計算一個唯一的值，只要這個唯一的值，它和我們之前存儲過的文件它的值匹配上了，我們就不用重復上傳了，它會告訴我們上傳成功了，然后把我們的這個文件，它的目錄，它的文件名，去指向這個，去建立一個映射，去指向那個我們之前已經上傳過的那個文件的本體，就好了

總之就是一句話，自己寫文件存儲文件上傳很難頂，而用別人的就是相對來講比較高可用，會比我們用一個單臺服務器來的要穩定安全一些

所以我們用現成的，這里現成的對象存儲我們也有很多選擇，有騰訊的，有百度的，有阿里的，有七牛云啥的

現在我們是需要一個現成的文件上傳服務，就是它給我們一個工具包，我們寫幾行代碼就能直接使用人家的文件上傳服務了，至于這個文件它存在那里，怎么管理都不用我們自己操心了

這里我們用騰訊云

我們先去看看最新活動，它這個一般都是有免費體驗的

我們來找一下對象存儲，cos就是對象存儲服務，就是存儲文件，存儲音視頻什么的

這個0元試用，先來白嫖它6個月

領取完這個對象存儲資源包之后我們再去整一個流量資源包

領完我們再去領個CDN，就在免費領取COS的旁邊

領取完之后，有了對象存儲，有了CDN，我們這套服務算是開通完了

我們現在開始正式搞這個文件上傳啊

• 首先是接入對象存儲的SDK，寫一個demo，實現文件上傳

• 然后是寫一個接口，支持接受文件，上傳到對象存儲服務中

首先是接入對象存儲的SDK，寫一個demo，實現文件上傳

我們看看這個對象存儲怎么用，我們點擊這個開始學習，去看看它的這個文檔

越好的SDK就是寫最少的代碼，有同樣的功能，給你一些現成的代碼去實現功能

導入依賴

引入依賴之后，我們繼續往下看初始化客戶端

這是一個類似門面模式的東西，就是說我們提供一個統一的類或者對象，然后用來集中提供一些API，用來提供給其他開發者調用。這用就可以把一些實現的細節屏蔽掉了，我們開發者不需要關注他們是怎么實現的這些細節，只需要知道我要給它什么值，它會給我返回什么值，基本上知道這些就夠了

我們現在來寫一個demo試一下，最簡單的就是搞一個main函數

我們來整一個單元測試

對象存儲屬于一個第三方的服務，我們寫一個manager包，然后新建一個TencentCOSManager

寫一個test，一個beforeTestAll

我們可以來測試一下這個beforeall注解

就是說:這個beforeAll我們在執行其他測試之前，先執行這個注解下的方法,我們可以在這里面先執行初始化等的操作

如果我們是說想要在執行每個測試方法之前都去執行一遍這個方法的話，我們可以打一個beforeEach注解，再把static去掉

這樣就是執行了兩邊before class了

現在我們改回beforeAll，我們現在可以在beforeAll里面初始化這個客戶端

我們去把文檔里面的這段代碼給它粘過來

這段都是別人給我們的SDK，沒必要我們自己寫

引入的包是qcloud的包

整理一下

首先是用我們的id和密碼去初始化一個COS認證對象

然后第二步是設置這個存儲桶的地域，就是說你這個COS存儲的地址實在上海還是在北京還是在哪些地方

然后我們去創建一下客戶端的配置，

再利用這個客戶端的配置去生成一個COS客戶端訪問對象

好，現在我們現在就在騰訊云的對象存儲上去新建一個桶吧

對象存儲它一般都是把文件先去分桶去進行存儲和管理的

我們先去控制臺，進入到對象存儲服務，進入存儲桶列表

創建存儲桶

那么現在問題來了，這個地域我們要填到哪里呢？

應該是離得近的吧

那是離自己近呢，還是離誰近呢

這個主要是要考慮，如果這個你是要給用戶用的，那就把這個桶放在離用戶近的地方，

再另外，一線城市一般來說也是要比二線城市有限考慮的

所以我們就填廣州吧

名稱就叫emoji

訪問權限的話，共有讀私有寫會更適合一點

就是不能誰都能往這個里面寫入文件，但是呢，大家都能去訪問到

默認警告就是如果一份鐘之內流量轟的一下就滋上來了，它可以警告我，不然一下子就把我搞窮了

內容安全就是如果有人往這個表情包網站中上傳黃賭毒內容的話，它能夠給你進行一個自動識別，如果有問題就會給你報錯，不讓你上傳

版本控制：就比如說你文件昨天上傳的，然后今天又更新了，它會給你同時保存昨天和今天兩個版本的文件

容災：這個舉個例子就是，你的文件是存在廣州的嘛，現在廣州的電線我給你挖斷了，你如果開了這個多個數據中心的容災的話，那說不定上海也會有你的源文件，這樣你的文件就不容易丟失

現在存儲桶就創建好了，我們可以上傳文件上去了

接下來呢，我們不是要手動地上傳文件，而是要自動地上傳文件

創建完后，我們要去demo中接入它

我們想要通過SDK將文件上傳到騰訊云的服務上，肯定要通過用戶校驗

可以新建一個Constant存儲身份信息

去網址查找id和key

填入id和key

現在我們設置好了，得到了一個身份驗證的對象，接下來呢就是要設置我們這個存儲桶的地域

去文檔中查一下地域的簡稱

我們拿到后把它粘貼到我們的代碼上

然后再往下，就是初始化一個客戶端的配置，這里默認的協議我們就不用管了

OK了

我們來試一下這個客戶端能不能用

我們去文檔里面找一個來試一下

試一下這個查詢功能能不能使用

復制粘貼試一下 打個斷點debug跑一下

懸停在bucket一會點擊加號

就可以出來了

兩個桶，剛剛好

說明它已經幫我們把這個桶查詢出來了

我們還可以查出名字地域什么的

說明前面的這個客戶端我們已經接入成功了

接下來就可以開始新建文件，上傳文件就可以了

我們到快速開始中找到上傳對象

直接基礎款

把這個代碼直接粘過來就可以了

這里我們指定一下要上傳到的存儲桶的名字

還有上傳的文件地址：

現在我們要指定一下文件上傳的路徑，也就是文件名再加上一個統一的前綴

我們可以指定一個Path，以后我們的項目文件都統一上傳到他的這個目錄下

比如說叫emoji，先用項目名，再加上一個文件類型

path = emoji/img

然后我們上傳文件是吧，我們就可以用我們上傳的這個文件名稱作為路徑

我們現在可以在這個里面隨便放一個文件

改個名字：

test-img

現在我們去把它的這個路徑粘貼過來

然后這個key，就是最終要上傳到這個存儲桶的路徑，就是

寫成

我們在輸出一下

好，現在我們來運行一下

再去騰訊云里面刷新看一眼

可以看到 我們這里這個目錄出來了！我們可以點擊預覽一下，這個圖片就出來了

那么我們這個demo就完成了

接下來我們來做下一步

寫一個接口，支持前端上傳文件到對象存儲服務中

首先，我們是不是要在啟動項目的時候，提供一個唯一的客戶端對象啊

那我們怎么去提供這樣一個唯一的客戶端對象呢？

我們可以去寫一個bean或者一個config

那我們選擇去初始化一個bean，這里可以用到單例模式

但是我們這里不自己去寫單例，我們可以利用spring的依賴注入，它可以幫我們去生成一個唯一的對象，不用自己去寫單例了

打個注解讓他可以注入進去

提供一個bean，讓他返回一個COSClient

再把test里面的代碼粘貼進去

把這個constant復制上去

好，我們現在在這里得到這個客戶端對象，我們直接返回就好了

之后呢我們就可以用spring依賴注入的方式去使用客戶端了

接下來我們去controller里面去試一下啊

之前我們是實現了表情的增刪改查

現在我們去新增一個接口叫上傳文件，返回值還是BaseResponse，整一個布爾值

把之前的代碼復制過來

然后呢，我們在這里注入一下

然后這里傳入一個什么對象呢

百度搜索一下：springboot 文件上傳 controller

這個file就是前端接收過來的文件對象

就是前端傳來的文件，我們那這樣的一個參數去接收

我們去看看這個博客是怎么處理這個文件的

好像，他這里好像是先把文件上傳到了本地

它是先從前端傳來的這個文件中，拿到了這個實際的文件名，

然后自己定義了一個文件存儲目錄，去創建了一個文件 也就是說，他是先接收到前端傳過來的文件，再把它放到后臺的這樣一個臨時目錄，然后再得到一個file對象，最后再把它上傳到對象存儲中

復制過來，輸出一下

我們來測試一下它給我們傳入的這個文件名字是什么樣子的

debug一下，我們去接口文檔去給他傳一個文件試試

可以看出它就是一個文件名，是沒有根路徑的

好，接下來我們就來把這個文件真實地上傳到文件存儲中

我們先把這個文件路徑名拼一下

這就是我們要上傳到后臺的路徑

那它是怎么把這個文件接收到臨時目錄再得到這個file的呢

再看回博客的下一行代碼

它是先new一個空的文件dest，然后用transferTo方法把前端接收的這個文件上傳上去

所以我們先來定義一個本地的路徑用來臨時存儲

然后我們再使用transferTo這個方法，把前端傳來的有數據的這個文件，傳到我們的dest文件中

第一行可以刪掉了 把dest傳下去，通過這個COS客戶端把有數據的文件上傳到遠程就好了

別忘了最后返回一個success

好，我們試著來運行一下，去接口文檔傳一個文件看一眼

報錯了

它說系統找不到指定的文件

那我們怎么整呢

我們先在這里，臨時新建一個temp 我們就不讓它幫我創建目錄了，我們自己在本地創建一個目錄

復制一下地址，給這個localpath改一下路徑

我們再運行試一下

上傳上去了

最后做一點收尾工作就結束了

我們在文件上傳之后，應該去拿到文件存儲的地址

我們簡單點，直接域名加key啊

我們去騰訊云配一個CDN

這里有一個域名，我們復制一下

下面還有一個默認CDN加速，我們也配置一下

把這個默認CDN加速給它開啟

然后我們保存一下

現在就有了一個CDN加速域名

我們保存一下域名，看一下能不能訪問到我們之前的文件

CDN的文件就是我們都有一個源站，CDN是多個不同的節點，離用戶近的一些節點。從這個源站中去領取，去讀取一些文件，把這些文件提前搬到CDN上，用戶只要訪問CDN，就可以得到更快的訪問

我們去試著看能不能訪問到這個圖片

用域名加圖片路徑

那我們Controller這里就直接返回給前端一個上傳文件的地址就可以了，這個我們來自己拼

emoji-1308058119.file.myqcloud.com+key

OK，圓滿結束！