一、引入 Thymeleaf 依赖

　　　　 <!-- Spring boot - thymeleaf -->

        <dependency>

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

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

        </dependency>

        <!-- 引入此依赖，再设置 spring.thymeleaf.mode=LEGACYHTML5，可以解决 thymeleaf 严格模式问题 -->

        <dependency>

            <groupId>net.sourceforge.nekohtml</groupId>

            <artifactId>nekohtml</artifactId>

        </dependency>

二、在 application.properties 中对 Thymeleaf 进行配置

# Thymeleaf
spring.thymeleaf.prefix=/WEB-INF/views/
spring.thymeleaf.suffix=.html
spring.thymeleaf.content-type=text/html
spring.thymeleaf.cache=false
spring.thymeleaf.mode=LEGACYHTML5

　　设置后台返回视图url的前缀、后缀、以及 contentType

　　设置thymeleaf是否缓存以及其模式（HTML 和 LEGACYHTML5）。

当我们使用 HTML 模式的时候，你在 thymeleaf 模板的 html 中如果使用了没有闭合的 dom 标签，那么他就会报错，因此需要加入上述所说的  nekohtml 依赖，以及设置对应的 mode为 LEGACYHTML5。

三、创建 index.html

<!DOCTYPE html>

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

<head>

<meta charset="UTF-8" />

<meta http-equiv="X-UA-Compatible" content="IE=edge" />

<meta name="viewport" content="width=device-width, initial-scale=1" />

<meta name="author" content="ChengRuan" />

<title>title</title>

</head>

<body>

    <h1>Hello RCDDUP!!!</h1>

</body>

</html>

四、创建 PageController.java

<!DOCTYPE html>

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

<head>

<meta charset="UTF-8" />

<meta http-equiv="X-UA-Compatible" content="IE=edge" />

<meta name="viewport" content="width=device-width, initial-scale=1" />

<meta name="author" content="ChengRuan" />

<title>title</title>

</head>

<body>

    <h1 th:text="'Hello RCDDUP!!!'"></h1>

</body>

</html>

五、启动 App.java

　　由于我将 server.port设置为9090，所以启动的url为：http://localhost:9090/index

　　好了，我们成功使用了 Thymeleaf。

六、解决静态资源（css、js等）问题

　　在 CustomWebMvcConfigurer.java 中重写 addResourceHandlers() 方法。

　　可以简写为：registry.addResourceHandler("/images/**","/css/**","/js/**").addResourceLocations("/images/","/css/","/js/");

package org.rcddup.app.config;

import org.mybatis.spring.annotation.MapperScan;

import org.springframework.context.annotation.Configuration;

import org.springframework.web.servlet.config.annotation.ResourceHandlerRegistry;

import org.springframework.web.servlet.config.annotation.WebMvcConfigurerAdapter;

@Configuration

@MapperScan(basePackages = { "org.rcddup.app.dao" })

public class CustomWebMvcConfigurer extends WebMvcConfigurerAdapter {


　　// 静态资源处理

    @Override

    public void addResourceHandlers(ResourceHandlerRegistry registry) {

        registry.addResourceHandler("/images/**").addResourceLocations("/images/");

        registry.addResourceHandler("/css/**").addResourceLocations("/css/");

        registry.addResourceHandler("/js/**").addResourceLocations("/js/");

        super.addResourceHandlers(registry);

    }

}

　　1.创建 main.css

　　然后我们访问：http://localhost:9090/css/main.css

　　在 index.html 中引入 main.css

<!DOCTYPE html>

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

<head>

<meta charset="UTF-8" />

<meta http-equiv="X-UA-Compatible" content="IE=edge" />

<meta name="viewport" content="width=device-width, initial-scale=1" />

<meta name="author" content="ChengRuan" />

<link href="/css/main.css" rel="stylesheet">

<title>title</title>

</head>

<body>

    <h1 th:text="'Hello RCDDUP!!!'"></h1>

</body>

</html>

　　然后我们访问 index 页面，http://localhost:9090/index

　　这样我们就解决了静态资源的问题，可以很好的在 html 中引入你的静态资源了。

SpringBoot 7.SpringBoot 结合 Thymeleaf的更多相关文章

  1. SpringBoot整合Jsp和Thymeleaf (附工程)

    前言 本篇文章主要讲述SpringBoot整合Jsp以及SpringBoot整合Thymeleaf,实现一个简单的用户增删改查示例工程.事先说明,有三个项目,两个是单独整合的,一个是将它们整合在一起的 ...

  2. java框架之SpringBoot(4)-资源映射&thymeleaf

    资源映射 静态资源映射 查看 SpringMVC 的自动配置类,里面有一个配置静态资源映射的方法: @Override public void addResourceHandlers(Resource ...

  3. SpringBoot Web开发(4) Thymeleaf模板与freemaker

    SpringBoot Web开发(4) Thymeleaf模板与freemaker 一.模板引擎 常用得模板引擎有JSP.Velocity.Freemarker.Thymeleaf SpringBoo ...

  4. SpringBoot 使用JPA+MySQL+Thymeleaf 总结 二

    SpringBoot 使用JPA+MySQL+Thymeleaf 总结 一 SpringBoot 使用JPA+MySQL+Thymeleaf 总结 二 方法一 使用原生sql查询 或者 为方法名增加 ...

  5. SpringBoot 使用JPA+MySQL+Thymeleaf 总结 一

    SpringBoot 使用JPA+MySQL+Thymeleaf 总结 一 SpringBoot 使用JPA+MySQL+Thymeleaf 总结 二 pom引用 <?xml version=& ...

  6. springboot框架中集成thymeleaf引擎，使用form表单提交数据，debug结果后台获取不到数据

    springboot框架中集成thymeleaf引擎,使用form表单提交数据,debug结果后台获取不到数据 表单html: <form class="form-horizontal ...

  7. Springboot】Springboot整合邮件服务(HTML/附件/模板-QQ、网易)

    介绍 邮件服务是常用的服务之一,作用很多,对外可以给用户发送活动.营销广告等:对内可以发送系统监控报告与告警. 本文将介绍Springboot如何整合邮件服务,并给出不同邮件服务商的整合配置. 如图所 ...

  8. 【SpringBoot】SpringBoot 国际化（七）

    本周介绍SpringBoot项目的国际化是如何处理的,阅读本章前请阅读[SpringBoot]SpringBoot与Thymeleaf模版(六)的相关内容 国际化原理 1.在Spring中有国际化Lo ...

  9. 【SpringBoot】SpringBoot配置与单元测试（二）

    SpringBoot项目创建参考[SpringBoot]SpringBoot快速入门(一) 本文介绍SpringBoot项目的POM文件.配置与单元测试 POM文件 1.SpringBoot的pom文 ...

  10. SpringBoot(四) -- SpringBoot与Web开发

    一.发开前准备 1.创建一个SpringBoot应用,引入我们需要的模块 2.SpringBoot已经默认将这些场景配置好了,只需要在配置文件中指定少量配置,就能运行起来 3.编写业务代码 二.静态资 ...

随机推荐

  1. SNAT和DNAT

    1.SNAT iptables防火墙 Centos6.6 64位 iptables 内网:eth0 172.16.4.1 外网:eth 112.112.112.112/24 当有用户访问公网时,修改用 ...

  2. [转载]FFmpeg中使用libx264进行码率控制

    1.  X264显式支持的一趟码率控制方法有:ABR, CQP, CRF. 缺省方法是CRF.这三种方式的优先级是ABR > CQP > CRF. if ( bitrate )       ...

  3. day64

    Day64 Django学习篇一 1.web应用 2.C/S和B/S架构 3.python中的web框架 ​ a:socket ​ b:路由跟视图函数的匹配关系 ​ c:模板渲染 ​ django: ...

  4. Table Generator 表格样式生成代码

    <style type="text/css"> .tg {border-collapse:collapse;border-spacing:0;} .tg td{font ...

  5. 20155306 白皎 免考实践总结——0day漏洞

    本次免考实践提纲及链接 第一部分 基础知识 1.1 0day漏洞概述 1.2二进制文件概述 1.3 必备工具 1.4 crack实验 第二部分 漏洞利用 2.1栈溢出利用 2.1.1 系统栈工作原理 ...

  6. # 2017-2018-2 20155319 『网络对抗技术』Exp8：Web基础

    2017-2018-2 20155319 『网络对抗技术』Exp8:Web基础 一.原理与实践说明 1.实践具体要求 (1).Web前端HTML(0.5分) 能正常安装.启停Apache.理解HTML ...

  7. WPF编程，通过Double Animation动态更改控件属性的一种方法。

    原文:WPF编程,通过Double Animation动态更改控件属性的一种方法. 版权声明:我不生产代码,我只是代码的搬运工. https://blog.csdn.net/qq_43307934/a ...

  8. 【第四课】Linux的基础命令使用

    目录 一.passwd重置密码 二.单用户模式 三.救援模式 四.设置SElinux 五.Linux的常用基础命令详解 5.1.mkdir命令 5.2.ls命令 5.3.cd命令 5.4.chmod命 ...

  9. python3获取指定目录内容的详细信息

    不同平台获取指定目录内容的详细信息命令各不相同: Linux中可以通过ls -al获取获取 windows中可以通过dir命令获取 下面是我写的一个通用获取目录内容详细信息的python3脚本: #! ...

  10. idea Cannot Resolve Symbol 问题解决

    总结:要多根据有问题的提示来进行百度搜索,这一次我就是搜索了 idea 提示的错误信息 Cannot Resolve Symbol ,才找到的解决方案,所以说出现问题,如果不是很复杂的场景或者原因很多 ...