springboot 模板引擎 thymeleaf和freemarker

thymeleaf

thymeleaf可以很好的和SpringBoot集成，而且本身也包含了spring-boot-starter-web,不需要写版本，pom.xml文件里会自动添加parent结点。

引入依赖

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

另外，它本身也自动配置了常用的默认配置

      spring:
      thymeleaf:
        cache: false
    # 以下是默认配置
    #    prefix: classpath:/templates/
    #    suffix: .html
    #    mode: HTML5
    #    encoding: UTF-8
    #    content-type: text/html

后台接口

    @GetMapping("/start")
    public ModelAndView hello(ModelAndView model){
        // templates下的文件名
        model.setViewName("hello");
        // 添加内容
        model.addObject("name", "ThymeLeaf");
        return model;
    }

前端页面

<!DOCTYPE html>
<html lang="zh-CN" xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    <title>hello</title>
</head>
<body>
<!-- 拿到后台定义的key去取值 -->
<!--/*@thymesVar id="name" type="java.lang.String"*/-->
<h1 th:text="'Hello, ' + ${name}"></h1>
</body>
</html>

一个基本的示例就结束了，当然，还有更复杂的用法，不过既然都做前后端分离了，我觉得前端的东西还是让专业的前端去做吧，如果实在有这方面需求的，也可以自行百度

freemarker

freemarker也是SpringBoot常用的模板引擎之一，只是听说效率还是不如thymeleaf。点击打开链接

添加依赖

        <dependency>
            <groupId>org.freemarker</groupId>
            <artifactId>freemarker</artifactId>
            <version>2.3.28</version>
        </dependency>

添加配置

    freemarker:
        cache: false
        template-loader-path: classpath:/templates/ftl/

其他配置

    ## 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

编写模板

hello.ftl

<!DOCTYPE html>

<html lang="en">

<body>
<h1>Hello ${name}</h1>
</body>

</html>

编写controller

    // freemarker
    @GetMapping("/freemarker")
    public String helloFreeMarker(Model model){
        // 添加内容
        model.addAttribute("name", "FreeMarker");
        return "hello";
    }

有几个需要说明的：

这里最好别用@RestController，直接用@Controller即可
thymeleaf和freemarker同时使用的时候，最好别在同一个目录下，避免混淆，参考上面的配置，重新设置一下模板目录地址

模板引擎总结

pom.xml中添加相应的依赖包

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

<dependency>
  <groupId>org.freemarker</groupId>
  <artifactId>freemarker</artifactId>
  <version>2.3.28</version>
</dependency>

application配置文件中添加配置信息，开发过程中建议关闭缓存

spring:
    thymeleaf:
        cache: false
    freemarker:
        cache: false

编写模板文件，thymeleaf默认.html， freemarker 默认.ftl
编写访问模板文件的controller建立请求映射地址
thymeleaf和freemarker 可以并存

springboot 模板引擎 thymeleaf和freemarker

freemarker

模板引擎总结

猜你喜欢