慢慢来比较快，虚心学技术
前言：视图解析器可以将逻辑视图名转换成物理实现
一、视图解析器
Spring提供了13个基本的视图解析器，能够将逻辑视图名转换为物理实现，如上一篇中提到的InternalResourceViewResolver。
此处我们只了解其中几个比较常用的视图解析器：
- FreeMarkerViewResolver：将视图解析为 FreeMarker 模板
- InternalResourceViewResolver：将视图解析为Web应用的内部资源
- TilesViewResolver：将视图解析为 Apache Tile 定义，其中 tile ID 与视图名称相同。注意有两个不同的TilesViewResolver实现，分别对应于 Tiles 2.0 和Tiles 3.0
- ThymeleafViewResolver： 将逻辑视图名称解析为 Thymeleaf 模板视图
使用不同的解析器可以实现将视图解析成不同类型的内容展现
二、具体视图解析器分析Demo
Ⅰ、创建JSP视图
基础实现如上一章《Spring实战》-第五章:Web中的Spring（SpringMVC注解实现）
)所述，InternalResourceViewResolver还支持将逻辑视图名转换成JstlView，我们只需要修改其viewClass为org.springframework.web.servlet.view.JstlView.class即可
@Bean
public ViewResolver viewResolver(){
InternalResourceViewResolver resourceViewResolver = new InternalResourceViewResolver();
resourceViewResolver.setPrefix("/WEB-INF/view/");
resourceViewResolver.setSuffix(".jsp");
resourceViewResolver.setExposeContextBeansAsAttributes(true);
resourceViewResolver.setViewClass(org.springframework.web.servlet.view.JstlView.class);
return resourceViewResolver;
}
Ⅱ、使用Apache Tile视图定义布局
如果一个应用多个视图需要使用很多重复性的内容，如头部，尾部等，或许我们会一个个的去复制使用，但是一旦做了任何更改，将需要同步进行多次更改，效率是很低的。
Apache Tiles是一个JavaEE应用的页面布局框架。Tiles框架提供了一种模板机制，可以为某一类页面定义一个通用的模板，该模板定义了页面的整体布局。布局由可以复用的多个块组成，每个页面可以有选择性的重新定义块而达到组件的复用。
SpringMVC结合Tile使用，案例如下：
引入tiles支持jar包：
<!--tiles-->
<dependency>
<groupId>org.apache.tiles</groupId>
<artifactId>tiles-jsp</artifactId>
<version>3.0.5</version>
</dependency>
①创建TilesConfig配置类，同时定义视图解析器TilesViewResolver
@Configuration
@EnableAspectJAutoProxy
@ComponentScan(basePackages = {"com.my.spring.controller"})
@EnableWebMvc /*<mvc:annotation-driven> 开启mvc配置*/
public class TilesConfig {
/**
* 定义默认处理器
*/
@Bean
public TilesConfigurer tilesConfigurer(){
TilesConfigurer tilesConfigurer = new TilesConfigurer();
//指定tiles的位置
tilesConfigurer.setDefinitions(new String[]{"/WEB-INF/layout/tiles.xml"});
//开启刷新功能
tilesConfigurer.setCheckRefresh(true);
return tilesConfigurer;
}
//定义使用TilesViewResolver
@Bean
public ViewResolver viewResolver(){
return new TilesViewResolver();
}
}
②定义Tiles
由上述配置代码中可以，Tiles文件是一个xml文件，创建位于/WEB-INF/layout/tiles.xml，使用<tiles-definitions>作为根节点,使用<definition>节点包裹一个Tile
<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE tiles-definitions PUBLIC
"-//Apache Software Foundation//DTD Tiles Configuration 3.0//EN"
"http://tiles.apache.org/dtds/tiles-config_3_0.dtd">
<tiles-definitions>
<!--定义一个名为base的tile，其模板文件时WEB-INF/layout下的base.jsp-->
<definition name="base" template="/WEB-INF/layout/base.jsp">
<!--定义属性header，指向视图/WEB-INF/layout/header.jsp-->
<put-attribute name="header" value="/WEB-INF/layout/header.jsp"/>
<!--定义属性footer，指向视图/WEB-INF/layout/header.jsp-->
<put-attribute name="footer" value="/WEB-INF/layout/footer.jsp"/>
</definition>
<!--定义一个名为home的tile，继承了名为base的tile，自动继承header和footer属性-->
<definition name="home" extends="base" >
<!--定义属性body，指向视图/WEB-INF/layout/home.jsp-->
<put-attribute name="body" value="/WEB-INF/view/home.jsp"/>
</definition>
</tiles-definitions>
③编写主模板base.jsp
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<!--引入tiles标签库-->
<%@ taglib uri="http://tiles.apache.org/tags-tiles" prefix="t"%>
<html>
<head>
<title>base</title>
</head>
<body>
<div id = "header">
<!--此处引入上tiles.xml文件中定义的属性header，实际上就是将header属性指向的header.jsp引入此处-->
<t:insertAttribute name="header"></t:insertAttribute>
</div>
<div id="content">
<!--此处引入属性body，一般来说这个地方都是用来作为空占位，所以base tile才没有body属性，此处是被继承者填充的-->
<t:insertAttribute name="body"></t:insertAttribute>
</div>
<div id="footer">
<!--此处引入上tiles.xml文件中定义的属性footer，实际上就是将footer属性指向的footer.jsp引入此处-->
<t:insertAttribute name="footer"></t:insertAttribute>
</div>
</body>
</html>
④编写属性模板文件：header.jsp和footer.jsp这两个文件作为模板文件都是十分简洁的
header.jsp:
<div style="font-size: medium;font-weight: bolder">TestDemo</div>
footer.jsp:
<span style="align-content: center">@create by Mr D</span>
⑤编写目标文件：home.jsp
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib uri="http://tiles.apache.org/tags-tiles" prefix="t"%>
<h1>Hello World</h1>
[图片上传中...(image-bd63b2-1553308187599-15)]
⑥编写基本Controller方法home()，方法返回一个逻辑视图名“home”，经过TilesViewResolver后被解析为完整视图：base.jsp中的body属性由home.jsp填充
@Controller
public class HomeController {
@RequestMapping(method = RequestMethod.GET,value = "/home")
public String home(){
//返回试图名为home的视图
return "home";
}
}
⑦浏览器访问结果如下：
Ⅲ、使用Thymeleaf
尽管JSP和Tiles十分便捷，但是终究建立在Servlet的基础之上，有时候很多代码并不是完全的前端代码，使其变得很混乱。Thymeleaf模板是原生的，不依赖于标签库。它能在接受原始 HTML 的地方进行编辑和渲染
案例如下：
引入Thymeleaf支持jar包：
<!-- https://mvnrepository.com/artifact/org.thymeleaf/thymeleaf-spring4 -->
<dependency>
<groupId>org.thymeleaf</groupId>
<artifactId>thymeleaf-spring4</artifactId>
<version>3.0.9.RELEASE</version>
</dependency>
①创建ThymeleafConfig配置类，装配ThymeleafViewResolver用于将逻辑视图名称解析为 Thymeleaf 模板视图,SpringTemplateEngine用于处理模板并渲染结果；TemplateResolver 用于加载 Thymeleaf 模板
@Configuration
public class ThymeleafConfig implements WebMvcConfigurer {
@Autowired
private ApplicationContext applicationContext;
/**
* 装配模板引擎（解析器），用于处理模板并渲染结果
*/
@Bean
public SpringResourceTemplateResolver templateResolver() {
SpringResourceTemplateResolver templateResolver = new SpringResourceTemplateResolver();
templateResolver.setCharacterEncoding("UTF-8");
templateResolver.setApplicationContext(applicationContext);
templateResolver.setPrefix("/WEB-INF/view/");//指定视图前缀
templateResolver.setSuffix(".html");//指定视图后缀
return templateResolver;
}
/**
* 装配模板引擎，用于处理模板并渲染结果
*/
@Bean
public SpringTemplateEngine templateEngine() {
SpringTemplateEngine templateEngine = new SpringTemplateEngine();
templateEngine.setTemplateResolver(templateResolver());
templateEngine.setEnableSpringELCompiler(true);
return templateEngine;
}
/**
* 装配视图解析器
*/
@Override
public void configureViewResolvers(ViewResolverRegistry registry) {
ThymeleafViewResolver resolver = new ThymeleafViewResolver();
resolver.setCharacterEncoding("UTF-8");
resolver.setTemplateEngine(templateEngine());
registry.viewResolver(resolver);
}
}
②编写基本页面：ThymeleafHtml.html,绑定bean对象，将bean对象属性作为输出
<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org"><!--引入thymeleaf支持-->
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>SpringMVC5+Thymeleaf示例</title>
</head>
<body>
<h1>Spring MVC + Thymeleaf Hello World example</h1>
<p th:text="${bean.id}"></p>
<p th:text="${bean.name}"></p>
</body>
</html>
③编写基础Controller方法，返回逻辑视图名指向ThymeleafHtml.html，并将数据封装返回
@RequestMapping(method = RequestMethod.GET,value = "/getBean")
public String getBeanByParam(String data, Model model){
JSONObject jo = JSON.parseObject(data);
Integer id = jo.getInteger("id");
BaseBean bean = this.baseService.findBean(id);
model.addAttribute("bean",bean);
return "ThymeleafHtml";
}
④浏览器访问结果：可以看到，返回的bean成功被绑定到页面属性中
但是，Thymeleaf更出色的地方是实现表单绑定，将表单和对象绑定到一起
⑤创建一个AddBeanHtml.html文件，其中包含一个表单文件
<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<form method="post" action="addBean" th:object="${baseBean}">
<div class="error" th:if="${#fields.hasErrors('*')}">
<ul>
<li th:each="err: ${#fields.errors('*')}" th:text="${err}">
Input is incorrect
</li>
</ul>
</div>
<label th:class="${#fields.hasErrors('id')}?'error'">Id</label>
<input type="text" th:field="*{id}" th:class="${#fields.hasErrors('id')}?'error'"/><br>
<label th:class="${#fields.hasErrors('name')}?'error'">Name</label>
<input type="text" th:field="*{name}" th:class="${#fields.hasErrors('name')}?'error'"/><br>
<button type="submit">提交</button>
</form>
</body>
</html>
⑥编写基本控制方法，将上述代码提交的类展示到ThymeleafHtml.html中去
@RequestMapping(method = RequestMethod.POST,value = "/addBean")
public String addBean(BaseBean baseBean, Model model){
model.addAttribute("bean",baseBean);
//返回试图名为home的视图
return "ThymeleafHtml";
}
网页请求如下：
