前面几篇介绍了返回json数据提供良好的RESTful api，下面我们介绍如何把处理完的数据渲染到页面上。

Spring Boot 使用模板引擎

Spring Boot 推荐使用Thymeleaf、FreeMarker、Velocity、Groovy、Mustache等模板引擎。不建议使用JSP。

Spring Boot 对以上几种引擎提供了良好的默认配置，默认 src/main/resources/templates 目录为以上模板引擎的配置路径。

一、Spring Boot 中使用Thymeleaf模板引擎

简介：Thymeleaf 是类似于Velocity、FreeMarker 的模板引擎，可用于Web与非Web环境中的应用开发，并且可以完全替代JSP 。

1、pom.xml 添加依赖

<!-- thymeleaf 模板引擎-->

<dependency>

    <groupId>org.springframework.boot</groupId>

    <artifactId>spring-boot-starter-thymeleaf</artifactId>

</dependency>

2、编写controller

/**

 * @author sam

 * @since 2017/7/16

 */

@Controller

public class HomeController {

    @RequestMapping("/home")

    public String home(ModelMap modelMap) {

        modelMap.put("name", "Magical Sam");

        List<String> list = new ArrayList<>();

        list.add("sam a");

        list.add("sam b");

        list.add("sam c");

        list.add("sam d");

        modelMap.put("list", list);

        return "home";

    }

}

3、编写html代码，其中th:text="${name}" 为thymeleaf的语法，具体可参考：Thymeleaf 官方文档

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.thymeleaf.org">

<head>

    <meta charset="UTF-8"/>

    <title>Home</title>

</head>

<body>

    <span th:text="${name}"></span>

    <ul>

        <li th:each="item : ${list}" th:text="${item}"></li>

    </ul>

</body>

</html>

启动应用，访问：http://localhost:8080/home ，可以得到相应结果。

如需修改 thymeleaf 的默认配置，可以在application.properties中添加：

# ================================================

#                   Thymeleaf配置

# ================================================

# 是否启用thymeleaf模板解析

spring.thymeleaf.enabled=true

# 是否开启模板缓存（建议：开发环境下设置为false，生产环境设置为true）

spring.thymeleaf.cache=false

# Check that the templates location exists.

spring.thymeleaf.check-template-location=true

# 模板的媒体类型设置，默认为text/html

spring.thymeleaf.content-type=text/html

# 模板的编码设置，默认UTF-8

spring.thymeleaf.encoding=UTF-8

# 设置可以被解析的视图，以逗号,分隔

#spring.thymeleaf.view-names=

# 排除不需要被解析视图，以逗号,分隔

#spring.thymeleaf.excluded-view-names=

# 模板模式设置，默认为HTML5

#spring.thymeleaf.mode=HTML5

# 前缀设置，SpringBoot默认模板放置在classpath:/template/目录下

spring.thymeleaf.prefix=classpath:/templates/

# 后缀设置，默认为.html

spring.thymeleaf.suffix=.html

# 模板在模板链中被解析的顺序

#spring.thymeleaf.template-resolver-order=

二、Spring Boot 中使用FreeMarker模板引擎

1、pom.xml 添加依赖

<!-- freemarker 模板引擎 -->

<dependency>

    <groupId>org.springframework.boot</groupId>

    <artifactId>spring-boot-starter-freemarker</artifactId>

</dependency>

2、编写controller

同上。

3、templates 下新建 home.ftl文件编写html代码，freemarker语法 可参考：FreeMarker 官方文档

home.ftl
<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>Title</title>

</head>

<body>

    <span>${name}</span>

    <ul>

    <#list list as item >

        <li>${item}</li>

    </#list>

    </ul>

</body>

</html>

启动应用，访问：http://localhost:8080/home ，可以得到相应结果。

如需修改 freemarker 的默认配置，可以在application.properties中添加：

# ================================================

#                   FreeMarker配置

# ================================================

# 是否开启模板缓存

spring.freemarker.cache=true

# 编码格式

spring.freemarker.charset=UTF-8

# 模板的媒体类型设置

spring.freemarker.content-type=text/html

# 前缀设置 默认为 ""

spring.freemarker.prefix=

# 后缀设置 默认为 .ftl

spring.freemarker.suffix=.ftl

#spring.freemarker.allow-request-override=false

#spring.freemarker.check-template-location=true

#spring.freemarker.expose-request-attributes=false

#spring.freemarker.expose-session-attributes=false

#spring.freemarker.expose-spring-macro-helpers=false

#spring.freemarker.request-context-attribute=

#spring.freemarker.template-loader-path=classpath:/templates/

#spring.freemarker.view-names=

附： application.properties 全部配置项，点击查看Spring Boot 所有配置说明

版权声明：本文为博主原创文章，转载请注明出处。

Spring Boot 系列（五）web开发-Thymeleaf、FreeMarker模板引擎的更多相关文章

  1. Spring MVC 学习总结（七）——FreeMarker模板引擎与动态页面静态化

    模板引擎可以让程序实现界面与数据分离,业务代码与逻辑代码的分离,这就提升了开发效率,良好的设计也使得代码复用变得更加容易.一般的模板引擎都包含一个模板解析器和一套标记语言,好的模板引擎有简洁的语法规则 ...

  2. spring boot(二)：web综合开发

    上篇文章介绍了Spring boot初级教程:spring boot(一):入门篇,方便大家快速入门.了解实践Spring boot特性:本篇文章接着上篇内容继续为大家介绍spring boot的其它 ...

  3. （转）Spring Boot(二)：Web 综合开发

    http://www.ityouknow.com/springboot/2016/02/03/spring-boot-web.html 上篇文章介绍了 Spring Boot 初级教程:Spring ...

  4. Spring Boot(二)：Web 综合开发

    详见:http://www.ityouknow.com/springboot/2016/02/03/spring-boot-web.html Web 开发 Spring Boot Web 开发非常的简 ...

  5. Spring Boot 系列（六）web开发-Spring Boot 热部署

    Spring Boot 热部署 实际开发中,修改某个页面数据或逻辑功能都需要重启应用.这无形中降低了开发效率,所以使用热部署是十分必要的. 什么是热部署? 应用启动后会把编译好的Class文件加载的虚 ...

  6. Spring Boot入门(四)：开发Web Api接口常用注解总结

    本系列博客记录自己学习Spring Boot的历程,如帮助到你,不胜荣幸,如有错误,欢迎指正! 在程序员的日常工作中,Web开发应该是占比很重的一部分,至少我工作以来,开发的系统基本都是Web端访问的 ...

  7. Spring Boot(十五)：spring boot+jpa+thymeleaf增删改查示例

    Spring Boot(十五):spring boot+jpa+thymeleaf增删改查示例 一.快速上手 1,配置文件 (1)pom包配置 pom包里面添加jpa和thymeleaf的相关包引用 ...

  8. spring boot系列（五）spring boot 配置spring data jpa (查询方法)

    接着上面spring boot系列(四)spring boot 配置spring data jpa 保存修改方法继续做查询的测试: 1 创建UserInfo实体类,代码和https://www.cnb ...

  9. Spring Boot☞ 使用freemarker模板引擎渲染web视图

    效果图 代码 package com.wls.integrateplugs.hello.controller; /** * Created by wls on 2017/8/24. */ import ...

随机推荐

  1. java 与操作系统同步问题（三）————父亲儿子女儿水果问题

    问题描述:父亲每次都会放一个水果在桌子上,女儿喜欢吃香蕉(只吃香蕉), 儿子喜欢吃苹果(只吃苹果).父亲每次只会随机往桌子上放一个水果(苹果或香蕉),儿子,女儿会来取.使用p.v操作来完成父亲.儿子. ...

  2. js设置，获取，删除Cookie

    //JS操作cookies方法! //写cookies function setCookie(name,value) {     var Days = 30;     var exp = new Da ...

  3. 将数据的初始化放到docker中的整个工作过程(问题记录)

    将数据的初始化放到docker中的整个工作过程 由于是打算作为个人博客,所以对于install这个步骤,我从一开始就打算删掉的,前面一个多星期一直在修bug,到前天才开始做这个事情. 过程中也是碰到了 ...

  4. 使用r.js来打包模块化的javascript文件

    前面的话 r.js(下载)是requireJS的优化(Optimizer)工具,可以实现前端文件的压缩与合并,在requireJS异步按需加载的基础上进一步提供前端优化,减小前端文件大小.减少对服务器 ...

  5. pod出现include of non-modular header inside framework module 错误

    今天打包pod 的时候 出现的错误 -> AFNetworking+RX (3.1.0.18) - ERROR | [iOS] xcodebuild: Returned an unsuccess ...

  6. 用 BeautifulSoup爬取58商品信息

    最近对Python爬虫比较迷恋,看了些爬虫相关的教程 于是乎跟着一起爬取了58上面的一些商品信息,并存入到xlsx文件中,并通过xlsxwirter的方法给表格设置了一些格式.好了,直接贴代码吧~ # ...

  7. angular2/angular4 如何通过$http的post方法请求下载二进制的Excel文件

    时间有限,废话就不多说了,直接上干货! 下面给大家介绍一下我遇到的一个坑,如果你也遇到了,那恭喜你,你一定能找到答案:angular2/angular4 如何通过$http的post方法请求下载二进制 ...

  8. 模拟jquery底层链式编程

    //特点1:快级作用域,程序启动自动执行 //内部的成员变量,外部无法访问(除了var) //简单的函数链式调用 function Dog(){ this.run=function(){ alert( ...

  9. 工作流调度引擎---Oozie

    Oozie使用教程 一．   Oozie简介 Apache Oozie是用于Hadoop平台的一种工作流调度引擎. 作用 - 统一调度hadoop系统中常见的mr任务启动hdfs操作.shell调度. ...

  10. mac 安装mysqldb组件包及mac中安装mysql-python遇到的问题

    错误1:mysql_config not found 问题描述:在执行sudo pip install mysql-python安装时报错误:EnvironmentError: mysql_confi ...