引入模板引擎 · Spring6.x（1）

SpringBoot 默认不是 Web 项目，而且使用的是嵌入式的 Tomcat，所以默认是不支持 jsp 视图的。 <br/> 但是有替代方案，比如使用 Velocity.、Freemarker.、Thymeleaf 等这些模板引擎。所有的模板引擎的思想都是大同小异，就是将数据与模板结合，然后通过引擎渲染出最终结果。 :-: ![](https://img.kancloud.cn/43/28/432827414fd4fa2abeba4b022e18a4ae_718x349.png) 模板引擎原理 <br/> >[info]SpringBoot 官方推荐使用 Thymeleaf 模板引擎。 [TOC] # 1. 引入Thymeleaf模板引入 Thymeleaf 模板的步骤如下： **1. 引入thymeleaf** ```xml <dependency> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-starter-thymeleaf</artifactId> </dependency> <dependency> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-starter-web</artifactId> </dependency>  <dependency> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-devtools</artifactId> <optional>true</optional> </dependency> ``` **2. `application.yml`** ```yml spring: thymeleaf: cache: false #关闭页面缓存，否则开发时看不到页面变化 ```` **3. Thymeleaf模板文件位置：`resources/templates/index.html`** ```html <!DOCTYPE html>  <html xmlns:th="http://www.thymeleaf.org"> <head> <meta charset="UTF-8"> <title>Title</title> </head> <body> <h1>欢迎来到Thymeleaf!</h1> </body> </html> ``` **4. controller层** ```java @Controller public class DemoController { @GetMapping("/v1/index") public String index() { //会自动找到templates/index.html文件 return "index"; } } ``` **5. 测试，访问 http://localhost:8080/v1/index ，将看到如下页面** ![](https://img.kancloud.cn/73/08/73083f7a5f5666ce490251f493e0e423_1816x284.png) **** Thymeleaf官网：https://www.thymeleaf.org/index.html Thymeleaf语法文档地址：[10 Attribute Precedence](https://www.thymeleaf.org/doc/tutorials/3.0/usingthymeleaf.html#attribute-precedence) Thymeleaf表达式文档地址：[4 Standard Expression Syntax](https://www.thymeleaf.org/doc/tutorials/3.0/usingthymeleaf.html#standard-expression-syntax) 案例代码：https://gitee.com/flymini/codes03/tree/master/learn-boot-thymeleaf <br/> # 2. 引入Freemarker模板引入 Freemarker 模板的步骤如下： **1. 引入Freemarker** ```xml <dependency> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-starter-freemarker</artifactId> </dependency> <dependency> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-starter-web</artifactId> </dependency>  <dependency> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-devtools</artifactId> <optional>true</optional> </dependency> ``` **2. `application.yml`** ```properties spring: freemarker: #指定freemarker模板的后缀名，freemarker默认的文件后缀为 .ftl，但是也可以指定为 .html suffix: .html #关闭页面缓存，否则开发时看不到页面变化 cache: false ``` **3. 添加`.html`为后缀的freemarker模板** 如果你在`application.yml`中指定了 Freemarker 模板的后缀名为`.html`，为了支持 Freemarker 的语法，在 IDEA 添加`*.html`。 File -> Settings -> ![](https://img.kancloud.cn/3b/41/3b410c9563e5313aa9bf2b9684833151_1224x558.png) **4. Freemarker模板文件位置：`resources/templates/index.html`** ```html <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.thymeleaf.org" xmlns:sec="http://www.thymeleaf.org/thymeleaf-extras-springsecurity3"> <head> <meta charset="UTF-8"> <title>Index</title> </head> <body> <h1>欢迎来到Freemarker!</h1> </body> </html> ``` **5. controller层** ```java @Controller public class DemoController { @GetMapping("/v1/index") public String index() { //会自动找到templates/index.html文件 return "index"; } } ``` **6. 测试，访问 http://localhost:8080/v1/index ，将看到如下页面** ![](https://img.kancloud.cn/b1/cf/b1cffd6ac3ef2188127038d2f61bf658_1504x280.png) **** 案例代码：https://gitee.com/flymini/codes03/tree/master/learn-boot-freemarker