springboot集成thymeleaf Spring Boot 集成 FreeMarker 详解案例 | 泥瓦匠BYSocket

springboot集成thymeleaf

Thymeleaf 是一个用于渲染 XML/XHTML/HTML5 内容的模板引擎，它可以让你在浏览器中预览你的模板，而无需启动应用服务器。Spring Boot 集成 Thymeleaf 是一个很好的选择，因为它可以帮助我们快速开发 Web 应用程序。

要在 Spring Boot 中集成 Thymeleaf，首先需要在 pom.xml 文件中添加依赖：

<dependency>
    <groupId>org.springframework.boot</groupId>
    <artifactId>spring-boot-starter-thymeleaf</artifactId>
    <version>2.1.3.RELEASE</version>
</dependency>

然后，我们需要在 application.properties 文件中配置 Thymeleaf 的相关属性：

# THYMELEAF (ThymeleafAutoConfiguration) 
spring.thymeleaf.check-template-location=true  # 检查模板位置 
spring.thymeleaf.prefix=classpath:/templates/ # 指定前缀 
spring.thymeleaf.suffix=.html # 指定后缀 
spring.thymeleaf.mode=HTML5 # 设置渲染模式

有了这些基本的配置之后，我们就可以创建一个 Thymeleaf 模板文件了。Thymeleaf 的语法很容易理解，它使用 XML 语法来表达 HTML 元素。例如，下面是一个使用 Thymeleaf 语法创建的 HTML 页面：

上述代码表明 head 和 body 元素将会被 fragments 目录中的 head 和 body 文件替代。Thymeleaf 还具有一些内置的表达式语法，可用于处理数据、迭代、条件判断、URL 生成、片断包含、国际化处理等。例如：

  

     Hello, User Name.  

 

上述代码表明如果 user 变量不为 null ，则会显示“Hello, User Name”字样。此外，Thymeleaf 还具有对 Spring MVC 的集成能力，可由 Spring MVC 处理 HTTP 请求并渲染 Thymeleaaf 模板。例如：

<@Controller public class HomeController {    

     @RequestMapping("/")    

     public String home(Model model) {        

         model.addAttribute("name", "John");        

         return "home";    

     } }

上述代码表明 HomeController 类将会针对根 URL 处理 HTTP 请求并渲染 home 页面。此外，Spring Boot 还具有对 WebJars 的集成能力。WebJars 是 JavaScript 和 CSS 库的 JAR 形式封装版本，可帮助我们快速引入 JavaScript 和 CSS 库到应用中去。例如要使用 jQuery ：

Spring Boot 集成 FreeMarker 详解案例 | 泥瓦匠BYSocket

二、运行 springboot-freemarker 工程
git clone 下载工程 springboot-learning-example ，项目地址见 GitHub – https://github.com/JeffLi1993/springboot-learning-example。下面开始运行工程步骤（Quick Start）：

1.数据库准备

a.创建数据库 springbootdb：
1
CREATE DATABASE springbootdb;

b.创建表 city ：(因为我喜欢徒步)

1
2
3
4
5
6
7
8
DROP TABLE IF EXISTS  `city`;
CREATE TABLE `city` (
  `id` int(10) unsigned NOT NULL AUTO_INCREMENT COMMENT '城市编号',
  `province_id` int(10) unsigned  NOT NULL COMMENT '省份编号',
  `city_name` varchar(25) DEFAULT NULL COMMENT '城市名称',
  `description` varchar(25) DEFAULT NULL COMMENT '描述',
  PRIMARY KEY (`id`)
) ENGINE=InnoDB AUTO_INCREMENT=1 DEFAULT CHARSET=utf8;



c.插入数据
1
INSERT city VALUES (1 ,1,'温岭市','BYSocket 的家在温岭。');



2. 项目结构介绍
项目结构如下图所示：

org.spring.springboot.controller – Controller 层
org.spring.springboot.dao – 数据操作层 DAO
org.spring.springboot.domain – 实体类
org.spring.springboot.service – 业务逻辑层
Application – 应用启动类
resources/application.properties – 应用配置文件，应用启动会自动读取配置
resources/web – *.ftl文件，是 FreeMarker 文件配置路径。在 application.properties 配置
resources/mapper – DAO Maper XML 文件



3.改数据库配置
打开 application.properties 文件， 修改相应的数据源配置，比如数据源地址、账号、密码等。（如果不是用 MySQL，pom 自行添加连接驱动依赖，然后修改驱动名配置。）


4.编译工程
在项目根目录 springboot-learning-example，运行 maven 指令：
mvn clean install


5.运行工程
右键运行 springboot-freemarker 工程 Application 应用启动类的 main 函数，然后在浏览器访问：
获取 ID 编号为 1 的城市信息页面：

1
localhost:8080/api/city/1
获取城市列表页面：

1
localhost:8080/api/city


6.补充
运行环境：JDK 7 或 8，Maven 3.0+

技术栈：SpringBoot、Mybatis、FreeMarker

三、 springboot-freemarker 工程配置详解
具体代码见 GitHub – https://github.com/JeffLi1993/springboot-learning-example
1.pom.xml 依赖

pom.xml 代码如下：
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
<?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 http://maven.apache.org/xsd/maven-4.0.0.xsd">
    <modelVersion>4.0.0</modelVersion>
    <groupId>springboot</groupId>
    <artifactId>springboot-freemarker</artifactId>
    <version>0.0.1-SNAPSHOT</version>
    <name>springboot-freemarker :: Spring Boot 集成 FreeMarker 案例</name>
    <!-- Spring Boot 启动父依赖 -->
    <parent>
        <groupId>org.springframework.boot</groupId>
        <artifactId>spring-boot-starter-parent</artifactId>
        <version>1.5.1.RELEASE</version>
    </parent>
    <properties>
        <mybatis-spring-boot>1.2.0</mybatis-spring-boot>
        <mysql-connector>5.1.39</mysql-connector>
    </properties>
    <dependencies>
        <!-- Spring Boot Freemarker 依赖 -->
        <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-starter-freemarker</artifactId>
        </dependency>
        <!-- Spring Boot Web 依赖 -->
        <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-starter-web</artifactId>
        </dependency>
        <!-- Spring Boot Test 依赖 -->
        <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-starter-test</artifactId>
            <scope>test</scope>
        </dependency>
        <!-- Spring Boot Mybatis 依赖 -->
        <dependency>
            <groupId>org.mybatis.spring.boot</groupId>
            <artifactId>mybatis-spring-boot-starter</artifactId>
            <version>${mybatis-spring-boot}</version>
        </dependency>
        <!-- MySQL 连接驱动依赖 -->
        <dependency>
            <groupId>mysql</groupId>
            <artifactId>mysql-connector-java</artifactId>
            <version>${mysql-connector}</version>
        </dependency>
        <!-- Junit -->
        <dependency>
            <groupId>junit</groupId>
            <artifactId>junit</artifactId>
            <version>4.12</version>
        </dependency>
    </dependencies>
</project>


在 pom.xml 依赖中增加 Spring Boot FreeMarker 依赖。

2.配置 FreeMarker

然后在 application.properties 中加入 FreeMarker 相关的配置：
1
2
3
4
5
6
7
8
9
10
11
## Freemarker 配置
## 文件配置路径
spring.freemarker.template-loader-path=classpath:/web/
spring.freemarker.cache=false
spring.freemarker.charset=UTF-8
spring.freemarker.check-template-location=true
spring.freemarker.content-type=text/html
spring.freemarker.expose-request-attributes=true
spring.freemarker.expose-session-attributes=true
spring.freemarker.request-context-attribute=request
spring.freemarker.suffix=.ftl



这是我这块的配置，如果需要更多的 FreeMarker 配置，可以查看下面的详解：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
spring.freemarker.allow-request-override=false # Set whether HttpServletRequest attributes are allowed to override (hide) controller generated model attributes of the same name.
spring.freemarker.allow-session-override=false # Set whether HttpSession attributes are allowed to override (hide) controller generated model attributes of the same name.
spring.freemarker.cache=false # Enable template caching.
spring.freemarker.charset=UTF-8 # Template encoding.
spring.freemarker.check-template-location=true # Check that the templates location exists.
spring.freemarker.content-type=text/html # Content-Type value.
spring.freemarker.enabled=true # Enable MVC view resolution for this technology.
spring.freemarker.expose-request-attributes=false # Set whether all request attributes should be added to the model prior to merging with the template.
spring.freemarker.expose-session-attributes=false # Set whether all HttpSession attributes should be added to the model prior to merging with the template.
spring.freemarker.expose-spring-macro-helpers=true # Set whether to expose a RequestContext for use by Spring's macro library, under the name "springMacroRequestContext".
spring.freemarker.prefer-file-system-access=true # Prefer file system access for template loading. File system access enables hot detection of template changes.
spring.freemarker.prefix= # Prefix that gets prepended to view names when building a URL.
spring.freemarker.request-context-attribute= # Name of the RequestContext attribute for all views.
spring.freemarker.settings.*= # Well-known FreeMarker keys which will be passed to FreeMarker's Configuration.
spring.freemarker.suffix= # Suffix that gets appended to view names when building a URL.
spring.freemarker.template-loader-path=classpath:/templates/ # Comma-separated list of template paths.
spring.freemarker.view-names= # White list of view names that can be resolved.



3.展示层 Controller 详解

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
@Controller
public class CityController {
    @Autowired
    private CityService cityService;
    @RequestMapping(value = "/api/city/{id}", method = RequestMethod.GET)
    public String findOneCity(Model model, @PathVariable("id") Long id) {
        model.addAttribute("city", cityService.findCityById(id));
        return "city";
    }
    @RequestMapping(value = "/api/city", method = RequestMethod.GET)
    public String findAllCity(Model model) {
        List<City> cityList = cityService.findAllCity();
        model.addAttribute("cityList",cityList);
        return "cityList";
    }
}
a.这里不是走 HTTP + JSON 模式，使用了 @Controller 而不是先前的 @RestController
b.方法返回值是 String 类型，和 application.properties 配置的 Freemarker 文件配置路径下的各个 *.ftl 文件名一致。这样才会准确地把数据渲染到 ftl 文件里面进行展示。
c.用 Model 类，向 Model 加入数据，并指定在该数据在 Freemarker 取值指定的名称。