目 錄
**篇 系統介紹篇
第1章 權限管理系統介紹 3
1.1 系統簡介 3
1.2 系統架構 4
1.2.1 前端架構 4
1.2.2 后端架構 4
1.3 系統界面 5
1.3.1 登錄頁面 5
1.3.2 系統主頁 5
1.3.3 用戶管理 6
1.3.4 機構管理 6
1.3.5 角色管理 7
1.3.6 菜單管理 7
1.3.7 字典管理 8
1.3.8 系統配置 8
1.3.9 登錄日志 8
1.3.10 操作日志 9
1.3.11 注冊中心 9
1.3.12 接口文檔 9
1.3.13 數據監控 10
1.3.14 服務監控 11
1.3.15 備份還原 11
1.3.16 主題切換 11
第2章 安裝指南 13
2.1 前端安裝指南 13
2.1.1 開發環境 13
2.1.2 技術選型 13
2.1.3 項目結構 13
2.1.4 編譯運行 14
2.2 后端安裝指南 14
2.2.1 開發環境 14
2.2.2 技術選型 15
2.2.3 項目結構 15
2.2.4 編譯運行 15
第3章 關鍵技術 17
3.1 Spring Boot 17
3.2 Spring Cloud 17
3.2.1 Spring Cloud簡介 17
3.2.2 Spring Cloud架構 17
3.2.3 Spring Cloud組件 18
3.2.4 參考教程 19
3.3 Spring Security 19
3.4 MyBatis 19
3.5 Vue.js 19
3.6 Element 20
第二篇 后端實現篇
第4章 數據庫設計 23
4.1 數據庫表設計 23
4.2 數據庫表關系 23
4.3 數據庫表結構 24
4.3.1 用戶表（sys_user） 24
4.3.2 角色表（sys_role） 25
4.3.3 機構表（sys_dept） 25
4.3.4 菜單表（sys_menu） 26
4.3.5 用戶角色表（sys_user_role） 26
4.3.6 角色菜單表（sys_role_menu） 26
4.3.7 角色機構表（sys_role_dept） 27
4.3.8 字典表（sys_dict） 27
4.3.9 配置表（sys_config） 28
4.3.10 操作日志表（sys_log） 28
4.3.11 登錄日志表（sys_login_log） 28
第5章 搭建開發環境 30
5.1 開發環境準備 30
5.1.1 安裝JDK環境 30
5.1.2 安裝Eclipse開發工具 30
5.1.3 安裝MySQL數據庫 30
5.1.4 安裝Maven構建工具 31
5.2 生成項目模板 31
5.3 導入Maven項目 31
5.4 編譯打包運行 34
5.4.1 編譯打包 34
5.4.2 啟動應用 35
5.4.3 修改啟動端口 35
5.4.4 自定義Banner 35
5.4.5 接口測試 37
第6章 集成Swagger文檔 38
6.1 添加依賴 38
6.2 配置類 39
6.3 頁面測試 39
第7章 集成MyBatis框架 41
7.1 添加依賴 41
7.2 添加配置 42
7.2.1 添加MyBatis配置 42
7.2.2 添加數據源配置 42
7.2.3 修改啟動類 43
7.3 生成MyBatis模塊 43
7.4 編寫服務接口 44
7.5 配置打包資源 46
7.6 編譯運行測試 47
第8章 集成Druid數據源 48
8.1 Druid介紹 48
8.2 添加依賴 49
8.3 添加配置 49
8.4 配置Servlet和Filter 51
8.5 編譯運行 53
8.6 查看監控 54
8.6.1 登錄界面 54
8.6.2 監控首頁 55
8.6.3 數據源 55
8.6.4 SQL監控 55
第9章 跨域解決方案 57
9.1 什么是跨域 57
9.2 CORS 技術 57
9.2.1 簡單請求 57
9.2.2 非簡單請求 58
9.3 CORS實現 59
第10章 業務功能實現 60
10.1 工程結構規劃 60
10.1.1 mango-admin 60
10.1.2 mango-common 62
10.1.3 mango-core 63
10.1.4 mango-pom 63
10.1.5 打包測試 63
10.2 業務代碼封裝 65
10.2.1 通用CURD接口 65
10.2.2 分頁請求封裝 66
10.2.3 分頁結果封裝 67
10.2.4 分頁助手封裝 68
10.2.5 HTTP結果封裝 69
10.3 MyBatis分頁查詢 70
10.3.1 添加依賴 70
10.3.2 添加配置 71
10.3.3 分頁代碼 71
10.3.4 接口測試 73
10.4 業務功能開發 74
10.4.1 編寫DAO接口 74
10.4.2 編寫映射文件 74
10.4.3 編寫服務接口 75
10.4.4 編寫服務實現 75
10.4.5 編寫控制器 77
10.5 業務接口匯總 78
10.5.1 用戶管理 78
10.5.2 機構管理 79
10.5.3 角色管理 79
10.5.4 菜單管理 80
10.5.5 字典管理 81
10.5.6 系統配置 82
10.5.7 登錄日志 82
10.5.8 操作日志 83
10.6 導出Excel報表 83
10.6.1 添加依賴 83
10.6.2 編寫服務接口 84
10.6.3 編寫服務實現 84
10.6.4 編寫控制器 85
10.6.5 工具類代碼 86
10.6.6 接口測試 87
第11章 登錄流程實現 89
11.1 登錄驗證碼 89
11.1.1 添加依賴 89
11.1.2 添加配置 89
11.1.3 生成代碼 90
11.1.4 接口測試 91
11.2 Spring Security 91
11.2.1 添加依賴 91
11.2.2 添加配置 92
11.2.3 登錄認證過濾器 93
11.2.4 身份驗證組件 96
11.2.5 認證信息查詢 97
11.2.6 添加權限注解 99
11.2.7 Swagger添加令牌參數 100
11.3 登錄接口實現 101
11.4 接口測試 105
11.5 Spring Security執行流程剖析 108
第12章 數據備份還原 109
12.1 新建工程 109
12.2 添加依賴 109
12.3 添加配置 110
12.4 自定Banner 111
12.5 啟動類 111
12.6 跨域配置 111
12.7 Swagger配置 112
12.8 數據源屬性 112
12.9 備份還原接口 113
12.10 備份還原實現 114
12.11 備份還原邏輯 114
12.11.1 數據備份服務 115
12.11.2 數據還原服務 116
12.12 備份還原控制器 117
12.12.1 數據備份接口 117
12.12.2 數據還原接口 117
12.12.3 查找備份接口 118
12.12.4 刪除備份接口 119
12.13 接口測試 119
第13章 系統服務監控 123
13.1 新建工程 123
13.2 添加依賴 123
13.3 添加配置 124
13.4 自定義Banner 124
13.5 啟動類 125
13.6 啟動服務端 125
13.7 監控客戶端 125
13.8 啟動客戶端 126
第14章 注冊中心（Consul） 128
14.1 什么是Consul 128
14.2 Consul安裝 128
14.3 monitor改造 129
14.3.1 添加依賴 129
14.3.2 配置文件 130
14.3.3 啟動類 130
14.3.4 測試效果 131
14.4 backup改造 132
14.4.1 添加依賴 132
14.4.2 配置文件 132
14.4.3 啟動類 133
14.4.4 測試效果 134
14.5 admin改造 134
14.5.1 添加依賴 134
14.5.2 配置文件 135
14.5.3 啟動類 136
14.5.4 測試效果 137
第15章 服務消費（Ribbon、Feign） 138
15.1 技術背景 138
15.2 服務提供者 138
15.2.1 新建項目 138
15.2.2 配置文件 139
15.2.3 啟動類 140
15.2.4 自定義Banner 140
15.2.5 添加控制器 140
15.3 服務消費者 142
15.3.1 新建項目 142
15.3.2 添加配置 143
15.3.3 啟動類 144
15.3.4 自定義Banner 144
15.3.5 服務消費 144
15.3.6 負載均衡器（Ribbon） 147
15.3.7 修改啟動類 148
15.3.8 添加服務 149
15.3.9 頁面測試 149
15.3.10 負載策略 149
15.4 服務消費（Feign） 150
15.4.1 添加依賴 150
15.4.2 啟動類 150
15.4.3 添加Feign接口 151
15.4.4 添加控制器 151
15.4.5 頁面測試 152
第16章 服務熔斷（Hystrix、Turbine） 153
16.1 雪崩效應 153
16.2 熔斷器（CircuitBreaker） 153
16.3 Hystrix特性 153
16.3.1 斷路器機制 153
16.3.2 fallback 154
16.3.3 資源隔離 154
16.4 Feign Hystrix 154
16.4.1 修改配置 154
16.4.2 創建回調類 155
16.4.3 頁面測試 155
16.5 Hystrix Dashboard 156
16.5.1 添加依賴 156
16.5.2 啟動類 157
16.5.3 自定義Banner 157
16.5.4 配置文件 158
16.5.5 配置監控路徑 158
16.5.6 頁面測試 159
16.6 Spring Cloud Turbine 161
16.6.1 添加依賴 161
16.6.2 啟動類 162
16.6.3 配置文件 162
16.6.4 測試效果 163
第17章 服務網關（Zuul） 164
17.1 技術背景 164
17.2 Spring Cloud Zuul 164
17.3 Zuul工作機制 165
17.3.1 過濾器機制 165
17.3.2 過濾器的生命周期 165
17.3.3 禁用指定的Filter 167
17.4 實現案例 167
17.4.1 新建工程 167
17.4.2 添加依賴 168
17.4.3 啟動類 168
17.4.4 配置文件 169
17.4.5 頁面測試 169
17.4.6 配置接口前綴 170
17.4.7 默認路由規則 170
17.4.8 路由熔斷 171
17.4.9 自定義Filter 172
第18章 鏈路追蹤（Sleuth、ZipKin） 174
18.1 技術背景 174
18.2 ZipKin 174
18.3 Spring Cloud Sleuth 174
18.4 實現案例 175
18.4.1 下載鏡像 175
18.4.2 編寫啟動文件 175
18.4.3 啟動服務 176
18.4.4 添加依賴 177
18.4.5 配置文件 178
18.4.6 頁面測試 178
第19章 配置中心（Config、Bus） 180
19.1 技術背景 180
19.2 Spring Cloud Config 180
19.3 實現案例 181
19.3.1 準備配置文件 181
19.3.2 服務端實現 181
19.3.3 客戶端實現 185
19.3.4 Refresh機制 188
19.3.5 Spring Cloud Bus 191
第三篇 前端實現篇
第20章 搭建開發環境 201
20.1 技術基礎 201
20.2 開發環境 201
20.2.1 Visual Studio Code 201
20.2.2 Node JS 202
20.2.3 安裝 webpack 203
20.2.4 安裝vue-cli 203
20.2.5 淘寶鏡像 203
20.2.6 安裝 Yarn 203
20.3 創建項目 204
20.3.1 生成項目 204
20.3.2 安裝依賴 205
20.3.3 啟動運行 206
第21章 前端項目案例 207
21.1 導入項目 207
21.2 安裝Element 207
21.2.1 安裝依賴 207
21.2.2 導入項目 208
21.3 頁面路由 210
21.3.1 添加頁面 210
21.3.2 配置路由 210
21.4 安裝 SCSS 212
21.4.1 安裝依賴 212
21.4.2 添加配置 212
21.4.3 如何使用 212
21.4.4 頁面測試 212
21.5 安裝 axios 213
21.5.1 安裝依賴 213
21.5.2 編寫代碼 213
21.5.3 頁面測試 214
21.6 安裝 Mock.js 214
21.6.1 安裝依賴 215
21.6.2 編寫代碼 215
21.6.3 頁面測試 216
第22章 工具模塊封裝 217
22.1 封裝 axios 模塊 217
22.1.1 封裝背景 217
22.1.2 封裝要點 217
22.1.3 文件結構 217
22.1.4 代碼說明 218
22.1.5 安裝 js-cookie 222
22.1.6 測試案例 223
22.2 封裝 mock 模塊 225
22.2.1 文件結構 225
22.2.2 登錄界面 228
22.2.3 主頁界面 229
22.2.4 頁面測試 229
第23章 第三方圖標庫 230
23.1 使用第三方圖標庫 230
23.2 Font Awesome 230
23.2.1 安裝依賴 230
23.2.2 項目引入 230
23.2.3 頁面使用 231
23.2.4 頁面測試 231
第24章 多語言國際化 232
24.1 安裝依賴 232
24.2 添加配置 232
24.3 字符引用 234
24.4 頁面測試 235
第25章 登錄流程完善 236
25.1 登錄界面 236
25.1.1 界面設計 236
25.1.2 關鍵代碼 236
25.2 主頁面 237
25.2.1 界面設計 237
25.2.2 關鍵代碼 237
25.3 頁面測試 240
第26章 管理應用狀態 241
26.1 安裝依賴 241
26.2 添加store 241
26.2.1 index.js 242
26.2.2 app.js 242
26.3 引入Store 243
26.4 使用Store 243
26.5 收縮組件 244
26.5.1 文件結構 244
26.5.2 關鍵代碼 244
26.6 頁面測試 245
第27章 頭部功能組件 247
27.1 主題切換組件 247
27.1.1 編寫組件 247
27.1.2 頁面測試 250
27.2 語言切換組件 250
27.2.1 編寫組件 250
27.2.2 頁面測試 251
27.3 用戶信息面板 252
27.3.1 編寫組件 252
27.3.2 頁面測試 253
27.4 系統通知面板 254
27.4.1 編寫組件 254
27.4.2 頁面測試 255
27.5 用戶私信面板 255
27.5.1 編寫組件 255
27.5.2 頁面測試 256
第28章 動態加載菜單 258
28.1 添加Store 258
28.2 登錄頁面 259
28.3 導航守衛 259
28.4 導航樹組件 262
28.5 頁面測試 263
第29章 頁面權限控制 264
29.1 權限控制方案 264
29.1.1 菜單類型 264
29.1.2 權限標識 264
29.1.3 菜單表結構 264
29.2 導航菜單實現思路 265
29.2.1 用戶登錄系統 265
29.2.2 根據用戶加載導航菜單 265
29.2.3 導航欄讀取菜單樹 265
29.3 頁面按鈕實現思路 265
29.3.1 用戶登錄系統 265
29.3.2 加載權限標識 266
29.3.3 頁面按鈕控制 266
29.4 權限控制實現 266
29.4.1 導航菜單權限 266
29.4.2 頁面按鈕權限 267
29.5 標簽頁功能 270
29.6 系統介紹頁 273
29.7 頁面測試 274
第30章 功能管理模塊 276
30.1 字典管理 276
30.1.1 關鍵代碼 276
30.1.2 頁面截圖 279
30.2 角色管理 279
30.2.1 關鍵代碼 279
30.2.2 頁面截圖 281
30.3 菜單管理 281
30.3.1 表格列組件 282
30.3.2 創建表格樹 283
30.3.3 頁面截圖 284
第31章 嵌套外部網頁 285
31.1 需求背景 285
31.2 實現原理 285
31.3 代碼實現 285
31.3.1 確定菜單URL 285
31.3.2 創建嵌套組件 287
31.3.3 綁定嵌套組件 288
31.3.4 菜單路由跳轉 290
31.4 頁面測試 290
第32章 數據備份還原 293
32.1 需求背景 293
32.2 后臺接口 293
32.3 備份頁面 294
32.4 頁面引用 296
32.5 頁面測試 298