SpringBoot整合Thymeleaf与FreeMarker视图层技术

目录
  • 整合Thymeleaf
    • 1. 创建工程添加依赖
    • 2. 配置Thymeleaf
    • 3. 配置控制器
    • 4. 创建视图
    • 5. 运行
  • 整合FreeMarker
    • 1. 创建项目添加依赖
    • 2. 配置FreeMarker
    • 3. 控制器
    • 4. 创建视图
    • 5. 运行

整合Thymeleaf

Thymeleaf是新一代Java模板引擎,类似于Velocity、FreeMarker等传统Java模板引擎。与传统Java模板引擎不同的是,Thymeleaf支持HTML原型,既可以让前端工程师在浏览器中直接打开查看样式,也可以让后端工程师结合真实数据查看显示效果。同事,Spring Boot提供了Thymeleaf自动化配置解决方案,因此在Spring Boot中使用Thymeleaf 非常方便。Spring Boot整合Thymeleaf 主要可通过如下步骤

1. 创建工程添加依赖

新建一个Spring Boot工程,然后添加spring-boot-starter-web 和spring-boot-starter-thymeleaf 依赖

<dependency>
  <groupId>org.springframework.boot</groupId>
  <artifactId>spring-boot-starter-web</artifactId>
</dependency>
<!--    整合Thymeleaf    -->
<dependency>
  <groupId>org.springframework.boot</groupId>
  <artifactId>spring-boot-starter-thymeleaf</artifactId>
</dependency>

2. 配置Thymeleaf

Spring Boot为Thymeleaf提供了自动化配置类ThymeleafAutoConfiguration,相关的配置属性在ThymeleafProperties 类中,ThymeleafProperties类部分源码如下:

@ConfigurationProperties(prefix = "spring.thymeleaf")
public class ThymeleafProperties {
	private static final Charset DEFAULT_ENCODING = StandardCharsets.UTF_8;
	public static final String DEFAULT_PREFIX = "classpath:/templates/";
	public static final String DEFAULT_SUFFIX = ".html";
}

由此配置可以看到,默认的模板位置在classpath:/templates/,默认的模板后缀名为.html。如果使用IDEA创建Spring Boot 项目,templates文件夹默认会创建。如需对默认的Thymeleaf 配置参数进行自定义配置,可以在application.properties 中进行配置,部分常见配置如下:

#是否开启缓存,开发时可设置为false,默认为true
spring.thymeleaf.cache=false
#检查模版是否存在,默认为true
spring.thymeleaf.check-template=true
#检查模版位置是否存在,默认为true
spring.thymeleaf.check-template-location=true
#模版文件编码
spring.thymeleaf.encoding=UTF-8
#模版文件位置
spring.thymeleaf.prefix=classpath:/templates/
#Content-Type配置
spring.thymeleaf.servlet.content-type=text/html
#模版文件后缀
spring.thymeleaf.suffix=.html

3. 配置控制器

创建Book实体类,然后在Controller中返回ModelAndView,如下:

public class Book {
    private int id;
    private String name;
    private String author;
    public int getId() {
        return id;
    }
    public void setId(int id) {
        this.id = id;
    }
    public String getName() {
        return name;
    }
    public void setName(String name) {
        this.name = name;
    }
    public String getAuthor() {
        return author;
    }
    public void setAuthor(String author) {
        this.author = author;
    }
}
@RestController
public class BookController {
    @GetMapping(value = "/books")
    public ModelAndView books(){
        List<Book> books = new ArrayList<>();
        Book b1 = new Book();
        b1.setId(1);
        b1.setAuthor("唐家三少");
        b1.setName("斗罗大陆Ⅰ");
        Book b2 = new Book();
        b2.setId(2);
        b2.setAuthor("唐家三少");
        b2.setName("斗罗大陆Ⅱ");
        books.add(b1);
        books.add(b2);
        ModelAndView modelAndView = new ModelAndView();
        modelAndView.addObject("books",books);
        modelAndView.setViewName("books");
        return modelAndView;
    }
}

4. 创建视图

在resources目录下的templates目录中创建books.html,如下:

<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>图书列表</title>
</head>
<body>
<table border="1">
    <tr>
        <td>图书编号</td>
        <td>图书名称</td>
        <td>图书作者</td>
    </tr>
    <tr th:each="book:${books}">
        <td th:text="${book.id}"></td>
        <td th:text="${book.name}"></td>
        <td th:text="${book.author}"></td>
    </tr>
</table>
</body>
</html>

代码解释:

  • 首先在第二行导入Thymeleaf 的名称空间
  • 通过遍历将books中的数据展示出来,Thymeleaf中通过th:each进行集合遍历,通过th:text展示数据

5. 运行

浏览器输入"http://localhost:8081/books",查看运行结果,如图:

整合FreeMarker

FreeMarker 是一个非常古老的模板引擎,可以用在Web环境或者非Web环境中。FreeMarker 需要经过解析才能在浏览器中展示出来。FreeMarker 不仅可以用来配置HTML页面模板,也可以作为电子邮件模板、配置文件模板以及源码模板。整合步骤如下:

1. 创建项目添加依赖

创建Spring Boot项目,然后添加spring-boot-starter-web和spring-boot-starter-freemarker依赖,如下:

<dependency>
  <groupId>org.springframework.boot</groupId>
  <artifactId>spring-boot-starter-web</artifactId>
</dependency>
<!--    整合FreeMarker    -->
<dependency>
  <groupId>org.springframework.boot</groupId>
  <artifactId>spring-boot-starter-freemarker</artifactId>
</dependency>

2. 配置FreeMarker

Spring Boot对FreeMarker 也提供了自动化配置类FreeMarkerAutoConfiguration,相关的配置属性在FreeMarkerProperties中,FreeMarkerProperties的部分源码如下:

@ConfigurationProperties(prefix = "spring.freemarker")
public class FreeMarkerProperties extends AbstractTemplateViewResolverProperties {
	public static final String DEFAULT_TEMPLATE_LOADER_PATH = "classpath:/templates/";
	public static final String DEFAULT_PREFIX = "";
	public static final String DEFAULT_SUFFIX = ".ftl";
    ...
}

FreeMarker 默认模板位置和Thymeleaf 一样,都在classpath:/templates/中,默认文件后缀是.ftl,开发者可以在application.properties 中对这些默认配置进行修改,如下:

3. 控制器

控制器和Thymeleaf 中的控制器一样,这里不再重复

4. 创建视图

在resources目录下的templates目录中创建books.ftl 文件,如下:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>图书列表FreeMarker</title>
</head>
<body>
<table border="1">
    <tr>
        <td>图书编号</td>
        <td>图书名称</td>
        <td>图书作者</td>
    </tr>
    <#if books ?? && (books?size>0)>
    <#list books as book>
        <tr>
            <td>${book.id}</td>
            <td>${book.name}</td>
            <td>${book.author}</td>
        </tr>
    </#list>
    </#if>
</table>
</body>
</html>

代码解释:

先判断model中的books部位可控并且books中有数据,然后再进行遍历

5. 运行

浏览器输入"http://localhost:8081/books",查看运行结果,如图:

到此这篇关于SpringBoot整合Thymeleaf与FreeMarker视图层技术的文章就介绍到这了,更多相关SpringBoot整合视图层内容请搜索我们以前的文章或继续浏览下面的相关文章希望大家以后多多支持我们!

(0)

相关推荐

  • Springboot整合Freemarker的实现详细过程

    基本配置.测试 1.导入依赖 <dependency> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-starter-freemarker</artifactId> </dependency> 2.准备一个Freemarker模板(.ftl) 3.注入Configuration对象(freemarker.template包下) 4.生成商品详情模

  • Springboot整合FreeMarker的实现示例

    目录 一.项目搭建 1.新建模块 2.导入依赖 :将不相关的依赖删掉 3.新建软件包,放入student实体类 4.新建StudentMapper接口 5.Springboot04Application内引用mapper 6.application.yml文件配置 7.测试 8.将切面.util包.启动器导入 9.新建service层 10.新建controller层 11.运行启动类Springboot04Application,访问localhost:8080网址 二.freemarker介

  • Springboot详解如何整合使用Thymeleaf

    目录 引入Thymeleaf 取值 有无转义 循环 模板引擎的作用就是我们来写一个页面模板,比如有些值呢,是动态的,我们写一些表达式.而这些值,从哪来呢,就是我们在后台封装一些数据.然后把这个模板和这个数据交给我们模板引擎,模板引擎按照我们这个数据帮你把这表达式解析.填充到我们指定的位置,然后把这个数据最终生成一个我们想要的内容给我们写出去,这就是我们这个模板引擎 如果我们没有模板引擎的话,在页面中会提示500 引入Thymeleaf 在项目中加入依赖 <!--thymeleaf--> <

  • SpringBoot整合Freemarker的基本步骤

    添加pom依赖 <!-- springboot整合freemarker --> <dependency> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-starter-freemarker</artifactId> </dependency> 在application.yml中添加相关配置 # 配置freemarker spring:

  • Springboot整合freemarker和相应的语法详解

    FreeMarker 是⼀款 模板引擎: 即⼀种基于模板和要改变的数据, 并⽤来⽣成输出⽂本(HTML⽹⻚,⼦邮件,配置⽂件,源代码等)的通⽤⼯具. 是⼀个Java类库. FreeMarker 被设计⽤来⽣成 HTML Web ⻚⾯,特别是基于 MVC 模式的应⽤程序,将视图从业务逻辑抽离处理,业务中不再包括视图的展示,⽽是将视图交给 FreeMarker 来输出.虽然 FreeMarker 具有些编程的能⼒,但通常由 Java 程序准备要显示的数据,由 FreeMarker ⽣成⻚⾯,通过模板

  • springboot整合freemarker的踩坑及解决

    目录 springboot整合freemarker踩坑 报错 问题原因 解决方法 springboot freemarker基础配置及使用 1.基础配置 2.基础使用 springboot整合freemarker踩坑 报错 2021-04-23 02:01:18.148 ERROR 9484 --- [nio-8080-exec-1] o.a.c.c.C.[.[.[/].[dispatcherServlet]    : Servlet.service() for servlet [dispatc

  • SpringBoot中使用Thymeleaf模板详情

    目录 一.什么是Thymeleaf 二.SpringBoot中使用Thymeleaf模板 1.pom.xml中添加thymeleaf依赖 2.关闭thymeleaf缓存 3.创建thymeleaf模板页面 4.创建一个类(用于与上述html页面交互) 5.访问服务路径 一.什么是Thymeleaf 官网原话:Thymeleaf是适用于Web和独立环境的现代服务器端Java模板引擎,能够处理HTML,XML,JavaScript,CSS甚至纯文本. Thymeleaf的主要目标是提供一种优雅且高度

  • SpringBoot详细讲解视图整合引擎thymeleaf

    目录 1. 支持的视图技术 2. Thymeleaf 2.1 Thymeleaf语法 2.2 标准表达式 1. 变量表达式 ${…} 2. 选择变量表达式 *{…} 3. 消息表达式 #{…} 4. 链接表达式 @{…} 5. 片段表达式 ~{…} 3. 基本使用 3.1 Thymeleaf模板基本配置 3.2 静态资源的访问 3.3 完成数据的页面展示 1. 创建Spring Boot项目 2. 编写配置文件 3. 创建web控制类 4. 创建模板页面并引入静态资源文件 5.效果测试 1. 支

  • SpringBoot超详细讲解Thymeleaf模板引擎

    Jsp是最早的模板技术,用来处理视图层的,用来做数据显示的模板 B S结构: B:浏览器:用来显示数据,发送请求,没有处理能力 发送一个请求,访问a.jsp,a.jsp在服务器端变成Servlet,在将输出的数据返回给浏览器,浏览器就可以看到结果数据,jsp最终翻译过来也是个html页面 模板技术你就可以把它们当成字符串的替换,比如说:这里{data}这里有一个字符串,你把它换成固定值其他值,但是这个替换有一些附加的功能,通过模板技术处理视图层的内容 第一个例子: pom.xml:Thymele

  • SpringBoot整合Thymeleaf与FreeMarker视图层技术

    目录 整合Thymeleaf 1. 创建工程添加依赖 2. 配置Thymeleaf 3. 配置控制器 4. 创建视图 5. 运行 整合FreeMarker 1. 创建项目添加依赖 2. 配置FreeMarker 3. 控制器 4. 创建视图 5. 运行 整合Thymeleaf Thymeleaf是新一代Java模板引擎,类似于Velocity.FreeMarker等传统Java模板引擎.与传统Java模板引擎不同的是,Thymeleaf支持HTML原型,既可以让前端工程师在浏览器中直接打开查看样

  • SpringBoot整合Thymeleaf的方法

    简介: 在目前的企业级应用开发中 前后端分离是趋势,但是视图层技术还占有一席之地, Spring Boot 对视图层技术提供了很好的支持,官方推荐使用的模板引擎是 Thymeleaf 不过像 FreeMarker 也支持, JSP 技术在这里并不推荐使用. Thymeleaf 是新一代 Java 模板引擎,类似于 Velocity.FreeMarker 等传统 Java 模板引擎.与传统 Java 模板引擎不同的是 Thymeleaf 支持 HTML 原型,既可 以让前端工程师在浏览器中直接打

  • SpringBoot整合Thymeleaf小项目及详细流程

    目录 1.项目简绍 2.设计流程 3.项目展示 4.主要代码 1.验证码的生成 2.userController的控制层设计 3.employeeController控制层的代码 4.前端控制配置类 5.过滤器 6.yml配置 7.文章添加页面展示 8.POM.xml配置类 9.employeeMapper配置类 10.UserMapper配置类 1.项目简绍 本项目使用SpringBoot开发,jdbc5.1.48 Mybatis 源码可下载 其中涉及功能有:Mybatis的使用,Thymel

  • SpringBoot整合thymeleaf 报错的解决方案

    近日 在springboot项目中使用thymeleaf时,莫名报了以下错误: 在网上查找文章明白了报错的原因,这是由于如果使用thymeleaf 为模板,那么解析时就要求html必须为严格的html5格式,即必须有完整的结束标记, 不然就会报错. 在html页面中,诸如input,meta,link等标签 ,是可以不用闭合就可以被解析的(自闭合的),但是由于这里严格要求html5格式 于是解决办法如下: 1) 在报错的标签上加入 结束标签. 2) 修改为不严格的模式. 在配置文件中加入如下配置

  • SpringBoot整合freemarker的讲解

    freemarker和thymeleaf是模板引擎.在早前我们使用Struts或者SpringMVC等框架的时候,使用的都是jsp,jsp的本质其实就是一个Servlet,其中的数据需要在后端进行渲染,然后再在客户端显示,效率比较低下.而模板引擎恰恰相反,其中的数据渲染是在客户端,效率方面比较理想一点.前后端不分离的话用模板引擎比较好,前后端分离的话其实用处并不大很大.Spring官方比较推荐的是thymeleaf,其文件后缀是html.本篇文章我们主要来看看SpringBoot整合freema

  • SpringBoot深入刨析数据层技术

    目录 前置导入 数据源技术 持久化技术 数据库技术 前置导入 之前做SSMP整合的时候数据层解决方案涉及到了,MySQL数据库与MyBatisPlus框架,后面又涉及到了Druid数据源的配置,所以现在数据层解决方案可以说是Mysql+Druid+MyBatisPlus.而三个技术分别对应了数据层操作的三个层面: 数据源技术:Druid 持久化技术:MyBatisPlus 数据库技术:MySQL ​ 下面的研究就分为三个层面进行研究,对应上面列出的三个方面,咱们就从第一个数据源技术开始说起. 数

  • SpringBoot整合模板引擎过程代码实例

    一.SpringBoot整合freemarker: 1.引入freemarker模板依赖: <dependency> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-starter-freemarker</artifactId> <version>1.5.9.RELEASE</version> </dependency> 2

  • Spring Boot 整合 Thymeleaf 实例分享

    目录 一.什么是 Thymeleaf 二.整合过程 准备过程 添加 Thymeleaf 依赖 编写实体类和 Controller 创建Thymeleaf 模板 三.测试 一.什么是 Thymeleaf Thymeleaf 是新一代的 Java 模板引擎,类似于 Velocity.FreeMarker 等传统引擎,其语言和 HTML 很接近,而且扩展性更高: Thymeleaf 的主要目的是将优雅的模板引入开发工作流程中,并将 HTML 在浏览器中正确显示.同时能够作为静态引擎,让开发成员之间更方

  • SpringBoot整合freemarker实现代码生成器

    目录 一.介绍 二.代码实践 2.1.首先我们添加 freemarker 依赖包 2.2.然后创建一个代码模版 2.3.最后生成目标代码 三.小结 一.介绍 在实际的软件项目开发过程中,我可以很负责任的跟大家说,如果你真的实际写代码的时间超过5年,你对增删改查这类简单的功能需求开发,可以说已经完全写吐了,至少我就是这种类型的. 但是呢,不可否认,绝大多数的软件功能,向下追随到最基本的单元,也基本都是单表的增.删.改.查! 只是随着用户需求不断增多,原来可能一个张单表就可以搞定的事情,现在可能需要

  • springboot整合freemarker代码自动生成器

    手撸一个代码自动生成器!! 实现功能:MyBatis 逆向工程 技术架构 页面是用 Vue ,element-ui开发:网络请求是 Axios. 服务端是 Spring Boot 页面模版是 Freemarker: 开发步骤: 一.创建工程 二.数据库连接操作 1.所需包结构 2.在model包中创建Db类 作用:用于接受前端传来数据库连接相关的值(username,password,url) package com.example.generate_code.model; /** * @aut

随机推荐