前言
準備工作
數據庫表分為實體表和關系表
第一，建數據庫表
然后導入前端頁面
創建公共模塊
就是統一返回值，異常那些東西
自己造一個自定義異常
普通類
mapper
獲取全部博客
我們只需要返回id，title，content，userId，updateTime就可以了
所以我們直接定義一個返回的類
但是這個時間展示不太好看
我們可以設置一下，就是改一下get方法
這個是方法一，設置get方法，但是注意的是，這個get方法只對date類型的有效，對這個類型沒有效果
方法二就是用注解
如果是date類型的話，就要設置時區，就是上面的那個注解
前端
這樣就成功了
獲取博客詳情
博客詳情我們還是和上面的接口返回一樣的類
如果要實現全部列表展示部分數據，詳情列表展示全部數據，可以在get方法那里做文章，那么這樣的話，兩個接口的返回類型就不一樣了，因為get方法都不一樣
但是我們這樣寫還沒有判斷查出來是否為null
我們判斷是否為null也可以用注解
@NotNull表示不能為null
@NotEmpty表示不能null，且不為空
@NotBlank表示不為空
表示id不能為null
如果參數id為null，就會報這個異常HandlerMethodValidationException
可以捕獲一下
前端
這樣就OK了
Jwt令牌
如果我們使用cookie和session的話
這個負載均衡的作用就是根據網速配置那些東西去讓客戶端去選擇用哪個服務器，這些服務器都是部署的同一個項目
如果用session1的話，如果下一次請求負載均衡換了服務器的話，session就失效了，就找不到了，因為不同的服務器有不同的sessionId
所以在多機多集群的部署下，session就失效了
我們的處理方法之一就是設置一個公共的服務器，專門去存儲session這些東西，比如redis，session都存儲在這個redis里面，而不是對應的服務器里面
方法二就是生成Jwt令牌
用戶第一次訪問服務器的時候，就會帶著用戶信息去訪問
然后服務器就會給客戶端返回一個令牌，這下有了這個令牌，就是token，就可以攜帶令牌token去訪問不同的服務器了
令牌的有點就是解決了集群環境的認證問題
但是我們需要自己去實現令牌，令牌傳遞，令牌校驗
Jwt官網
這個就是token，這個不是加密的
第一個是header，聲明一個頭，說明算法是什么等等
第二個是載荷，聲明我們的信息是什么
第三個是簽名，
現在開始使用Jwt令牌
先引入依賴
以點來進行分割的
復制到官網去
上面這個沒有簽名
現在開始設置簽名
簽名就是一個key，所以我們還要定義一個key
但是報錯了，這個是因為我們的簽名太短了
但是我們的這個簽名是非法的
我們專門來定義一個方法去生成key
這個就是生成的簽名
現在開始校驗token
我們在重新生成一個token
我們來把簽名改一下
用戶輸入賬戶密碼，生成token，返回給前端，前端存儲起來，每次訪問都要攜帶token，每次訪問攔截器都要去判斷token，校驗token
登錄
登錄的請求和響應數據都可以設置為單獨的類
請求就是用戶名和密碼
響應就是userId，和token
這樣就成功了
傳入的參數是類的話就用注解Validated
然后類里面的成員變量就用具體的限制注解
如果傳入的參數直接就是基本類型，那么就可以用具體的注解限制了
在完善一下條件的判斷
前端
我們在前端把token存儲在localStorage這里，這樣就會一直存著了
登錄成功這樣就存儲好了
而且這個不會隨著服務器的重啟而清空
不會改變
只會隨著登錄信息的改變而改變
我們這就把token放在header里面了，這樣的話，后端只需要用request就可以得到token了
而且每次請求都會攜帶token
攔截器
這樣我們的攔截器就寫成功了
現在開始配置攔截器
就是配置路徑那些
這樣我們就成功了
但是值得注意的就是，當我們用postman測試的時候，就要手動添加對應的header才可以測試成功，手動添加user_token
因為poatman沒有前端添加header的操作
還有一個點就是localStorage并不是header，localStorage是存儲在瀏覽器中的，長期長達24h
而header是每次請求發出的請求體
所以每次發生請求
每次ajax的時候，都要把localStorage中的token添加到header中
每次ajax，這個我們就要用新的知識了
這串代碼的意思就是每次ajax都把token設置到header中
但是你把這串代碼放在一個html中，那么這串代碼就只在這個html中生效
所以我們把這個代碼放在一個js文件中
然后每個html頁面都要引入這個頁面
<script src="js/common.js"></script>
所以這里也要改一下
所以每次請求都會ajax，都會帶入token
都會去攔截器中判斷，成功的話就正常controller
如果token校驗失敗的話
就會返回狀態碼401
意思就是ajax失敗了
所以每個ajax失敗的請求都要判斷一下
我們這里重點判斷401狀態碼
每次ajax失敗
所以我們還是寫在一個公共的js文件中
我們去前端頁面測試的時候，直接把localStorage刪完就可以了
然后就成功了
博客列表頁與博客詳情頁獲取個人信息
定義一個返回的類
注意postman測試的時候，一定要手動添加header
這樣就OK了
在加上一些限制
前端
或者這樣也可以
由于博客詳情頁面也要定義getUserInfo這個方法，而且只有url不同
所以我們把這個方法也放在一個公共的js文件中
這樣就可以了
注銷
右上角有一個注銷按鈕
注銷按鈕就是要退出登錄
而且每個頁面除了登錄頁面，都有這個功能
所以我們還是寫在common.js中
退出登錄就是在localstorage中刪除token就可以了
這樣就可以了沒有后端的操作
發布博客
還是要添加一個請求類
我們這個設計有點缺陷
就是博客列表那里會顯示不是自己的博客，但是沒有關系
我們自己寫的博客，作者還是自己的
這個可以不用設置，因為有默認值
完善一下
前端
這樣寫是不可以的
因為makedown有mk的獲取方式
markdown
這個就是markdown網站
這個就是對應的組件
這個是對markdown組件的樣式修改
參數對應組件的id即editor
我們這樣寫就可以了
但是博客列表那里顯示正文的時候，顯示了井號，我們可以不用顯示的
所以我們可以把博客列表和博客詳情返回的類分別處理一下
而且博客列表的內容可以不用顯示完全
這樣就好看多了
還有一個問題就是博客詳情頁的時候要用markdown的格式來展示
這個就是前端的問題了
用markdown來展示
這個可以去看官網來展示
我們這樣寫
但是這樣寫是id選擇器
所以還要增加一個detail的id
所以前端這樣寫就可以了
樣子好多了
但是markdown自己具有樣式
我們還要搞一下這個樣式
我們自己去設置了背景
就不會去用markdown的樣式了
這個背景設置的是透明狀態
那么就默認會用父組件的背景
這樣就正確了
編輯和刪除
顯示
因為我們登錄會顯示所有的博客
不管是不是自己寫的，都會顯示
所以當我們查看不是自己的博客的時候
就不要顯示刪除和編輯按鈕了
怎么判斷呢
就在博客詳情頁面
用返回的數據中的userId與登錄的useId進行判斷就可以了
不相等的話，就不顯示了
所以要求返回的數據中要有userId
然后前端就可以判斷了
OK了
記得還要把原來的按鈕刪掉
成功了
后端
還是要創建新的類
前端
這個沒有問題
這樣就OK了
對了
我們的刪除采用邏輯刪除
所以改一下
這樣就OK了
還有一個問題就是有些時候不會顯示完全
是因為我們給contenet的賦值不規范
給markdown的賦值，不能這么草率
這樣賦值才規范，就不會出現有些時候顯示，有些時候不顯示的問題了
加密加鹽
對稱：就是加密與解密的密鑰是一樣的
非對稱：加密與解密的密鑰是不一樣的
公鑰是所有人都可以看到，鎖
私鑰就是我們可以看到，鑰匙
摘要算法：CRC算法，把一段字符串變成固定長度的字符串
MD5就是摘要算法
摘要算法是無法解密的
其他兩個可以解密
我們用MD5加密
非對稱效率比較低
MD5加密，如果字符串很復雜就無法解密了
如果密碼簡單，就可以很容易解密了
所以要讓密碼變的復雜
所以可以加上隨機的字符串
這個就是鹽值
代碼測試
我們用的MD5是spring提供的
我們可以去解密軟件去解密一下
使用同樣的字符串，加密出來的字符串都是一樣的
總共長度是32位，這個就是鹽值的長度
一般不會重復的
基本不會重復
極低的概率會重復
這個是根據用戶的mac地址去生成的uuid
明文與鹽值直接拼接就可以了
看得出來最后加出來的還是32位
這個是無法解密的
我們只需要存儲最后的密碼和鹽值就可以了
注意鹽值和最后的密文都是16進制的32位的
工具類
我們現在寫一個工具類
分別代表加密和解密
這樣我們就成功了
數據庫存儲的就是鹽和密文
后端
我們沒有注冊操作
所以直接加密去修改數據庫
然后就是修改后端登錄代碼
只需要校驗就可以了
登錄接口主要是修改這里
就是判斷密碼的那里
我輸入的123456就成功了
這樣就失敗了，問題主要是后端數據庫存儲的密碼沒有64位
在改一下
這里密碼錯誤會拋出異常，然后被全局異常處理
這個ajax請求是失敗的
我們要處理一下前端
注意我們可以把這個我們自定義異常的狀態碼取消掉
這樣就是正常返回給前端了
前端就會sucess了，不會err了
因為如果設置為其他狀態碼
前端就會err
然后res可能就不是簡簡單單的Result了
