Spring Boot 2.X(三)：使用 Spring MVC + MyBatis + Thymeleaf 開發 web 應用
### 前言
------------
Spring MVC 是構建在 Servlet API 上的原生框架，並從一開始就包含在 Spring 框架中。本文主要通過簡述 Spring MVC 的架構及分析，並用 Spring Boot + Spring MVC + MyBatis （SSM）+ Thymeleaf（模板引擎） 框架來簡單快速構建一個 Web 專案。
### Web MVC 架構及分析
------------
MVC 三層架構如圖所示，紅色字型代表核心模組。其中 MVC 各分層分別為：
- **Model （模型層）**處理核心業務（資料）邏輯，模型物件負責在資料庫中存取資料。這裡的“資料”不僅限於資料本身，還包括處理資料的邏輯。
- **View（檢視層）**用於展示資料，通常資料依據模型資料建立。
- **Controller（控制器層）**用於處理使用者輸入請求和響應輸出，從試圖讀取資料，控制使用者輸入，並向模型傳送資料。Controller 是在 Model 和 View 之間雙向傳遞資料的中間協調者。
### Spring MVC 架構及分析
------------
Spring MVC 處理一個 HTTP 請求的流程，如圖所示：
整個過程詳細介紹：
1.使用者傳送請求至前端控制器 DispatcherServlet。
2.DispatcherServlet 收到請求呼叫處理器對映器 HandlerMapping。
3.處理器對映器根據請求 URL 找到具體的 Controller 處理器返回給 DispatcherServlet。
4.DispatcherServlet 通過處理器介面卡 HandlerAdapter 呼叫 Controller 處理請求。
5.執行 Controller 處理器的方法。
6.Controller 執行完成返回 ModelAndView。
7.HandlerAdapter 將 Controller 執行結果 ModelAndView 返回給 DispatcherServlet。
8.DispatcherServlet 將 ModelAndView 的 ViewName 傳給檢視解析器 ViewReslover。
9.ViewReslover 解析後返回具體的檢視 View。
10.DispatcherServlet 傳遞 Model 資料給 View，對 View 進行渲染（即將模型資料填充至檢視中）。
11-12.DispatcherServlet 響應使用者。
### Spring Boot + Spring MVC + MyBatis + Thymeleaf
------------
本段我們主要通過構建專案，實現一個分頁查詢。
#### 1.專案構建
專案結構如圖所示：
##### 1.1 pom 引入相關依賴
```xml
<?xml version="1.0" encoding="UTF-8"?>
<project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 https://maven.apache.org/xsd/maven-4.0.0.xsd">
<modelVersion>4.0.0</modelVersion>
<parent>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-parent</artifactId>
<version>2.1.9.RELEASE</version>
<relativePath/> <!-- lookup parent from repository -->
</parent>
<groupId>cn.zwqh</groupId>
<artifactId>spring-boot-ssm-thymeleaf</artifactId>
<version>0.0.1-SNAPSHOT</version>
<name>spring-boot-ssm-thymeleaf</name>
<description>spring-boot-ssm-thymeleaf</description>
<properties>
<java.version>1.8</java.version>
</properties>
<dependencies>
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-web</artifactId>
</dependency>
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-test</artifactId>
<scope>test</scope>
</dependency>
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-jdbc</artifactId>
</dependency>
<!-- 熱部署模組 -->
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-devtools</artifactId>
<optional>true</optional> <!-- 這個需要為 true 熱部署才有效 -->
</dependency>
<!-- mysql 資料庫驅動. -->
<dependency>
<groupId>mysql</groupId>
<artifactId>mysql-connector-java</artifactId>
<scope>runtime</scope>
</dependency>
<!-- mybaits -->
<dependency>
<groupId>org.mybatis.spring.boot</groupId>
<artifactId>mybatis-spring-boot-starter</artifactId>
<version>2.1.0</version>
</dependency>
<!-- pagehelper -->
<dependency>
<groupId>com.github.pagehelper</groupId>
<artifactId>pagehelper-spring-boot-starter</artifactId>
<version>1.2.12</version>
</dependency>
<!-- thymeleaf -->
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-thymeleaf</artifactId>
</dependency>
</dependencies>
<build>
<plugins>
<plugin>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-maven-plugin</artifactId>
</plugin>
</plugins>
</build>
</project>
```
##### 1.2 WebMvcConfig 配置
```java
package cn.zwqh.springboot.config;
import org.springframework.context.annotation.Configuration;
import org.springframework.core.Ordered;
import org.springframework.web.servlet.config.annotation.ResourceHandlerRegistry;
import org.springframework.web.servlet.config.annotation.ViewControllerRegistry;
import org.springframework.web.servlet.config.annotation.ViewResolverRegistry;
import org.springframework.web.servlet.config.annotation.WebMvcConfigurationSupport;
@Configuration
public class WebMvcConfig extends WebMvcConfigurationSupport {
/**
* 靜態資源配置
*/
@Override
public void addResourceHandlers(ResourceHandlerRegistry registry) {
registry.addResourceHandler("/statics/**").addResourceLocations("classpath:/statics/");//靜態資源路徑 css,js,img等
registry.addResourceHandler("/templates/**").addResourceLocations("classpath:/templates/");//檢視
registry.addResourceHandler("/mapper/**").addResourceLocations("classpath:/mapper/");//mapper.xml
super.addResourceHandlers(registry);
}
/**
* 檢視控制器配置
*/
@Override
public void addViewControllers(ViewControllerRegistry registry) {
registry.addViewController("/").setViewName("/index");//設定預設跳轉檢視為 /index
registry.setOrder(Ordered.HIGHEST_PRECEDENCE);
super.addViewControllers(registry);
}
/**
* 檢視解析器配置 控制controller String返回的頁面 檢視跳轉控制
*/
@Override
public void configureViewResolvers(ViewResolverRegistry registry) {
// registry.viewResolver(new InternalResourceViewResolver("/jsp/", ".jsp"));
super.configureViewResolvers(registry);
}
}
```
##### 1.3 application.properties 配置
```
#thymeleaf
spring.thymeleaf.cache=false
#datasource
spring.datasource.driver-class-name=com.mysql.cj.jdbc.Driver
spring.datasource.url=jdbc:mysql://127.0.0.1:3306/db_test?useUnicode=true&characterEncoding=UTF-8&useSSL=true
spring.datasource.username=root
spring.datasource.password=root
#mybatis
mybatis.mapper-locations=classpath:/mapper/*.xml
#logging
logging.path=/user/local/log
logging.level.cn.zwqh=debug
logging.level.org.springframework.web=info
logging.level.org.mybatis=error
```
##### 1.4 Controller
```java
@Controller
@RequestMapping("/user")
public class UserController {
@Autowired
private UserService userService;
@GetMapping("/list")
public ModelAndView showUserList(int pageNum, int pageSize) {
PageInfo<UserEntity> pageInfo = userService.getUserList(pageNum, pageSize);
ModelAndView modelAndView=new ModelAndView();
modelAndView.setViewName("index");
modelAndView.addObject("pageInfo",pageInfo);
return modelAndView;
}
}
```
##### 1.5 Service 及 ServiceImpl
UserService
```java
public interface UserService {
PageInfo<UserEntity> getUserList(int pageNum, int pageSize);
}
```
UserServiceImpl
```java
@Service
public class UserServiceImpl implements UserService{
@Autowired
private UserDao userDao;
@Override
public PageInfo<UserEntity> getUserList(int pageNum, int pageSize) {
PageHelper.startPage(pageNum, pageSize);
List<UserEntity> list=userDao.getAll();
PageInfo<UserEntity> pageData= new PageInfo<UserEntity>(list);
System.out.println("當前頁："+pageData.getPageNum());
System.out.println("頁面大小："+pageData.getPageSize());
System.out.println("總數："+pageData.getTotal());
System.out.println("總頁數："+pageData.getPages());
return pageData;
}
}
```
##### 1.6 Dao
```java
public interface UserDao {
/**
* 獲取所有使用者
* @return
*/
List<UserEntity> getAll();
}
```
記得在啟動類里加上**@MapperScan**
```java
@SpringBootApplication
@MapperScan("cn.zwqh.springboot.dao")
public class SpringBootSsmThymeleafApplication {
public static void main(String[] args) {
SpringApplication.run(SpringBootSsmThymeleafApplication.class, args);
}
}
```
##### 1.7 Mapper.xml
```xml
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE mapper PUBLIC "-//mybatis.org//DTD Mapper 3.4//EN"
"http://mybatis.org/dtd/mybatis-3-mapper.dtd">
<mapper namespace="cn.zwqh.springboot.dao.UserDao">
<resultMap type="cn.zwqh.springboot.model.UserEntity" id="user">
<id property="id" column="id"/>
<result property="userName" column="user_name"/>
<result property="userSex" column="user_sex"/>
</resultMap>
<!-- 獲取所有使用者 -->
<select id="getAll" resultMap="user">
select * from t_user
</select>
</mapper>
```
##### 1.8 實體 UserEntity
```java
public class UserEntity {
private Long id;
private String userName;
private String userSex;
public Long getId() {
return id;
}
public void setId(Long id) {
this.id = id;
}
public String getUserName() {
return userName;
}
public void setUserName(String userName) {
this.userName = userName;
}
public String getUserSex() {
return userSex;
}
public void setUserSex(String userSex) {
this.userSex = userSex;
}
}
```
##### 1.9 html 頁面
```html
<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
<p>Thymeleaf是一個用於Web和獨立環境的現代伺服器端Java模板引擎。SpringBoot推薦使用Thymeleaf。</p>
<p>下面是表格示例：</p>
<table border="1">
<thead>
<tr>
<th width="100">ID</th>
<th width="100">姓名</th>
<th width="100">性別</th>
</tr>
</thead>
<tbody>
<tr th:each="user:${pageInfo.list}">
<td th:text="${user.id}"></td>
<td th:text="${user.userName}"></td>
<td th:text="${user.userSex}"></td>
</tr>
</tbody>
</table>
<p>
<a th:href="${'/user/list?pageNum='+(pageInfo.pageNum-1>=1?pageInfo.pageNum-1:1)+'&pageSize=10'}">上一頁</a>
<a th:href="${'/user/list?pageNum='+(pageInfo.pageNum+1<=pageInfo.pages?pageInfo.pageNum+1:pageInfo.pages)+'&pageSize=10'}">下一頁</a>
總數：<span th:text="${pageInfo.total}"></span>
</p>
</body&