zoukankan      html  css  js  c++  java
  • SpringBoot学习笔记(4)----SpringBoot中freemarker、thymeleaf的使用

    1. freemarker引擎的使用

      如果你使用的是idea或者eclipse中安装了sts插件,那么在新建项目时就可以直接指定试图模板

      如图:

      勾选freeMarker,此时springboot项目中就会自动引入freemarker的依赖如下:

      

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

    如果不是idea且eclipse也没有插件,那么就需要手动添加这个依赖到pom文件中。

      springboot存放模板和静态文件目录结构如下:

      

      templates中存放模板文件,static中存放一些静态文件,如图片,css,js等

      templates在springboot中默认为模板根目录,static默认为静态文件根目录,所以我们在写路径的时候不用将这两个目录路径写到访问目录中。

      不需要任何配置,只需要一个controller接口,就可以直接使用controller和模板直接进行交互,直接上代码

      IndexController接口:

     
    package com.wangx.boot.controller;
    
    import org.springframework.stereotype.Controller;
    import org.springframework.web.bind.annotation.RequestMapping;
    
    import java.util.Map;
    
    @Controller
    @RequestMapping("/index")
    public class IndexController {
    
        @RequestMapping("/index")
            public String hello(Map<String,Object> map){
                //传递数据到freemaker模板中
                map.put("name", "[Angel -- 守护天使]");
                return "index";
    
        }
    }
     

      freemarker模板文件的默认后缀名为ftl.

      index.ftl

     
    <!DOCTYPE html>
    
    <html xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.thymeleaf.org"
    
          xmlns:sec="http://www.thymeleaf.org/thymeleaf-extras-springsecurity3">
    
    <head>
    
        <title>Hello World!</title>
    
    </head>
    
    <body>
    
    <p>
        <!--获取后台传过来的数据-->
        <p>${name}</p>
    </p>
    </body>
    </html>
     

      当请求返回index时,springboot会根据这个路径到templates目录下自动匹配这个模板引擎,这样就完成了后台到模板的整合和数据交互。

      结果如下:

      如果想要访问静态资源时,如图片,直接写上绝对路径<img src="/1.jpg">即可(注意在Controller方法返回值中尽量写相对路径,即不要带/,否则在linux环境下中可能会出错)。

    2. thymeleaf

      thymeleaf的使用与freemarker很相似,简单的使用只需要将示例1中的ftl改为html文件,取值方式改为thymeleaf即可,这里只展示thymeleaf的html代码,其他的代码跟freemarker一样,只是在创建项目时选择thymeleaf或在pom文件中添加thymeleaf依赖即可。

      index.html:

     
    <!DOCTYPE html>
    
    <html xmlns:th="http://www.thymeleaf.org">
    
    <head>
    
        <title>Hello World!</title>
    
    </head>
    
    <body>
    <p th:text="${name}">
    <img src="1.jpg">
    </p>
    </body>
    
    </html>
     

    启动项目,访问http://localhost:8080/index/index,结果与1相同。

    这里只是简单的展示怎么整合springboot和模板引擎的整合,模板引擎的具体使用方式请参照官网。

    freemarker官方文档:https://freemarker.apache.org/docs/

    thymeleaf:官方文档:https://www.thymeleaf.org/

    在springboot官方推荐使用的是thymeleaf模板,因为现在的趋势都是前后端分离的架构,所以使用thymeleaf耦合性会更低。

    原文 SpringBoot学习笔记(4)----SpringBoot中freemarker、thymeleaf的使用

  • 相关阅读:
    【高并发】面试官问我:为什么局部变量是线程安全的?
    Java中的String到底占用多大的内存空间?你所了解的可能都是错误的!!
    【高并发】学好并发编程,关键是要理解这三个核心问题
    【高并发】高并发分布式锁架构解密,不是所有的锁都是分布式锁!!
    12张图带你彻底理解分布式事务产生的场景和解决方案!!
    【高并发】面试官:讲讲高并发场景下如何优化加锁方式?
    【高并发】秒杀系统架构解密,不是所有的秒杀都是秒杀(升级版)!!
    十一长假我肝了这本超硬核PDF,现决定开源!!
    一文搞懂PV、UV、VV、IP及其关系与计算
    我把这个贼好用的Excel导出工具开源了!!
  • 原文地址:https://www.cnblogs.com/xiaoshen666/p/10843930.html
Copyright © 2011-2022 走看看