【SpringBoot】Thymeleaf助力Web项目

Thymeleaf是个XML/XHTML/HTML5模板引擎，模版引擎怎么理解呢，想想jsp就可以理解。顺便声明一点的是Thymeleaf的发音：[taɪm lif]。

一说到Java Web的模版引擎，我们第一反应往往是jsp，但是如果你是基于Springboot搭建Java Web，官方建议尽量避免jsp哦：

|If possible, JSPs should be avoided. There are several known limitations when using them with embedded servlet containers.

对于Thymeleaf

**目录结构
Thymeleaf模版基于HTML或XML文件，学习成本与阅读成本相对较低，在工程项目resource中创建两个文件夹:static和template，其中static中存在静态文件，如项目所需的js、css文件，template中则存放后缀为html的模版文件。

image.png

当Springboot在启动过程中，会自动加载这两个文件夹中的对应文件。什么意思呢？从使用效果上看，Thymeleaf管理下的模版文件和Springboot中的业务代码是前后端分离的，这种机制实现了业务逻辑层和展示层的解耦，既然是分离，我们不妨思考一下它们两者之间如何实现数据交互。数据交互的方向是两条，一是后端Controller如何找到对应template并传送相应数据，二是template将业务请求给到Controller进而实现逻辑计算。

• 后 to 前
  因为是前后端分离，后端对前端的返回，是通过制定模版路径的方式，前面已经说到，在SpringBoot启动过程中会加载template和static下的文件，当然你也可以自定义路径。在Controller层定义的模版地址不需要指定classpath/template，只用返回这个路径以下的相对位置。当然比较常见的情况，在制定模版路径的同时，希望传给模版相应的变量值，这个过程可以通过model对象来传递，如果你参考其他教程，还会发现通过@ModelAttribute传值，它们的原理是一致的(可参照ModelAttribute注解的网上教程)，就是在制定MVC模型当中的View层。

    public String getSampleResult(Model model) {
        model.addAttribute("name", "tony");
        return "customizeFolderUnderTemplate/index"
    }

有一个坑在这里提醒大家，在SpringBoot中我们使用注解时，如果有View层的渲染，应该使用@Cotroller类而非@RestCntroller，因为后者默认支持Restful，所以返回的数据形式是json而非View。以上实现了从后到前的页面渲染和数据传输。在渲染这个方面还存在fragment的渲染方式，这一点下一章进行介绍。

• 前 to 后
  因为前后端分离，我们通过Restful的方式进行数据交换，所以在对后端服务做请求这方面，常见的方式是两种：页面跳转和Ajax请求。根据Url自然会触发对应的Controller方法，从而进行业务逻辑的计算；Ajax请求无论你采用任何前端js栈，都能找到对应的请求方式。

说说Thymeleaf的坏话
暂且不从性能方面考虑（Thymeleaf在性能方面比FreeMarker弱，比Enjoy要强，之后文章会介绍性能方面的测试方法）。但从程序员使用体验来讲，Thymeleaf不能算是很好的选择。其中主要体现在于引擎模版对于Javascript的使用。因为Thymeleaf模版基于Html，所以在展示曾没有问题，使用起来挺顺手。但是在Js方面，Thymeleaf直接使用js，必须是内联的方式，也就是必须通过以下方式进行封装

    <script th:inline="javascript"></script>

也就是说前端的显示（html）和逻辑层（js）不方便分离，因为必须在template中用内联的方式进行声明，举个例子：当我们对一个从后端传到前端的变量，希望经过前端处理之后展示在页面上时，按照Thymeleaf的设计，对这个变量的处理操作必须在html中完成，也就是在html的<script>中完成。当然我们可以通过调用external js中的方法的方式，把这个变量用传参的方式，给到对应的前端处理逻辑，但是在coding层面，我们需要在html手写调用的过程，从这个方面看是比较tricky的。
对Thymeleaf的使用，在第一篇中我是介绍了大概的流程和印象，接下来，我会从使用的方面来介绍支持一般的Web开发场景，如何使用Thymeleaf，尤其是使用过程中的坑及解决方法。