当前位置： 首页 > news >正文

41、springboot 整合 FreeMarker 模版技术

news 2025/11/1 13:15:55

springboot 整合 FreeMarker 模版技术

★ 整合FreeMarker的自动配置：

FreeMarkerAutoConfiguration：负责整合Spring容器和获取FreeMarkerProperties加载的配置信息。FreeMarkerServletWebConfiguration/FreeMarkerReactiveWebConfiguration：整合FreeMarker的自动配置类。FreeMarkerProperties类则对应application.properties文件中关于FreeMarker的配置属性，它负责读取该文件并设置FreeMarker。

★ 添加整合FreeMarker的starter：

在pom.xml文件中导入spring-boot-starter-freemarker 
如要使用Bootstrap，则添加org.webjars:boostrap
如要使用版本无关的WebJar，则添加org.webjars:webjars-locator-core依赖

配置文件配置 Freemarker 的属性
在这里插入图片描述

★ 页面变化

 FreeMarker需要在页面模板中添加自己的指令，而且表达式还要写在HTML元素中，例如下面代码
<div class=“alert alert-danger”>${error}</div>，${error}就写在了HTML的<div.../>元素内，这就对原有HTML页面形成了污染；Thymeleaf则只需为HTML标签中添加th:xxx属性，在模板被解析之前，这些属性会被浏览器直接忽略，
因此它不会对原有HTML页面形成污染。

代码演示：

拷贝上一份springboot整合 thymeleaf的代码，修改成 freemarker
springboot整合Thymeleaf
pom.xml 和 compiler.xml 文件里面需要把名字换成新的项目名，my_freemarker.iml 文件只需要修改文件名
在这里插入图片描述

1、修改依赖。，添加整合FreeMarker的starter

在这里插入图片描述

2、修改配置文件，整合freemarker 的一些配置属性

在这里插入图片描述

3、前端页面名字的后缀都改成 .ftlh

引入js文件的写法改变
在这里插入图片描述
index页面
在这里插入图片描述

main页面
在这里插入图片描述
books页面
在这里插入图片描述

效果也一样能出来：
在这里插入图片描述

代码：
index

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>登录页面</title><!--  引入css样式，用 link 元素  ,  stylesheet 样式单 , .gz表示是打包的，但是springboot会自动解包 --><!--  引入 Bootstrap 的 Web Jar 中的 CSS 样式  --><link rel="stylesheet" href="/webjars/bootstrap/css/bootstrap.min.css"><!--  jquery 放在 bootstrap 前面，因为 bootstrap 需要依赖到 jquery  --><!--  引入 jQuery 的 Web Jar 中的 js 脚本  --><script type="text/javascript" src="/webjars/jquery/jquery.min.js"></script><!--  引入 Bootstrap 的 Web Jar 中的 js 脚本  --><script type="text/javascript" src="/webjars/bootstrap/js/bootstrap.bundle.min.js"></script><!--  引入 popper 的 Web Jar 中的 Js 脚本  --><script type="text/javascript" src="/webjars/popper.js/umd/popper.min.js"></script></head>
<body>
<div class="container"><img src="/logo.jpg" width="100px" height="100px" class="rounded mx-auto d-block"><h4>用户登录</h4><#if error?exists><div class="alert alert-danger"}>${error}</div></#if><form method="post" action="/login"><div class="form-group row"><label for="username" class="col-sm-3 col-form-label">用户名：</label><div class="col-sm-9"><input type="text" id="username" name="username"class="form-control" placeholder="输入用户名"></div></div><div class="form-group row"><label for="password" class="col-sm-3 col-form-label">密码：</label><div class="col-sm-9"><input type="password" id="password" name="password"class="form-control" placeholder="输入密码"></div></div><div class="form-group row"><div class="col-sm-6 text-right"><button type="submit" class="btn btn-primary">登录</button></div><div class="col-sm-6"><button type="reset" class="btn btn-danger">重设</button></div></div></form>
</div>
</body>
</html>

main

<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head><meta charset="UTF-8"><title>首页</title><!--  引入css样式，用 link 元素  ,  stylesheet 样式单 , .gz表示是打包的，但是springboot会自动解包 --><!--  引入 Bootstrap 的 Web Jar 中的 CSS 样式  --><link rel="stylesheet" href="/webjars/bootstrap/css/bootstrap.min.css"><!--  jquery 放在 bootstrap 前面，因为 bootstrap 需要依赖到 jquery  --><!--  引入 jQuery 的 Web Jar 中的 js 脚本  --><script type="text/javascript" src="/webjars/jquery/jquery.min.js"></script><!--  引入 Bootstrap 的 Web Jar 中的 js 脚本  --><script type="text/javascript" src="/webjars/bootstrap/js/bootstrap.bundle.min.js"></script><!--  引入 popper 的 Web Jar 中的 Js 脚本  --><script type="text/javascript" src="/webjars/popper.js/umd/popper.min.js"></script></head>
<body>
<div class="container"><img src="/logo.jpg" width="100px" height="100px" class="rounded mx-auto d-block"><div class="text-info">您好，<span>${Session.username}</span></div><br>职位:<div><#--  springboot规定获取Session对象首字母要大写  --><#switch Session['role']><#case 'admin'><span>管理员</span><#break><#case 'manager'><span>项目经理</span><#break><#default><span>普通员工</span></#switch></div><br><br><a href="/viewBooks" class="btn btn-info">查看图书列表</a>
</div>
</body>
</html>

books

<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head><meta charset="UTF-8"><title>testBranch</title><!--  引入css样式，用 link 元素  ,  stylesheet 样式单 , .gz表示是打包的，但是springboot会自动解包 --><!--  引入 Bootstrap 的 Web Jar 中的 CSS 样式  --><link rel="stylesheet" href="/webjars/bootstrap/css/bootstrap.min.css"><!--  jquery 放在 bootstrap 前面，因为 bootstrap 需要依赖到 jquery  --><!--  引入 jQuery 的 Web Jar 中的 js 脚本  --><script type="text/javascript" src="/webjars/jquery/jquery.min.js"></script><!--  引入 Bootstrap 的 Web Jar 中的 js 脚本  --><script type="text/javascript" src="/webjars/bootstrap/js/bootstrap.bundle.min.js"></script><!--  引入 popper 的 Web Jar 中的 Js 脚本  --><script type="text/javascript" src="/webjars/popper.js/umd/popper.min.js"></script></head>
<body>
<div class="container"><img src="/logo.jpg" width="100px" height="100px" class="rounded mx-auto d-block"><table class="table table-hover"><tr><th>序号</th><th>Id</th><th>书名</th><th>价格</th></tr><#list books  as book><tr><td>${book_index}</td><td>${book.id}</td><td>${book.name}</td><td>${book.price}</td></tr></#list></table>
</div>
</body>
</html>

相关文章：

41、springboot 整合 FreeMarker 模版技术

springboot 整合 FreeMarker 模版技术 ★ 整合FreeMarker的自动配置&#xff1a; FreeMarkerAutoConfiguration&#xff1a;负责整合Spring容器和获取FreeMarkerProperties加载的配置信息。FreeMarkerServletWebConfiguration/FreeMarkerReactiveWebConfiguration&#xff1a…...

编程日记 2023/8/30 14:22:10

每天 26,315 美元罚款？交通安全局要求特斯拉提供 Autopilot数据

根据美国国家公路交通安全管理局&#xff08;NHTSA&#xff09;最近的特别命令&#xff0c;特斯拉公司被要求提供关于其自动驾驶功能Autopilot的相关信息。这一命令是继NHTSA于2021年8月启动初步评估后&#xff0c;在2022年6月升级为正式调查的一部分&#xff0c;NHTSA近期对特…...

编程日记 2023/8/30 14:21:09

3d激光slam建图与定位(2)_aloam代码阅读

1.常用的几种loam算法 aloam 纯激光 lego_loam 纯激光 去除了地面 lio_sam imu激光紧耦合 lvi_sam 激光视觉 2.代码思路 2.1.特征点提取scanRegistration.cpp&#xff0c;这个文件的目的是为了根据曲率提取4种特征点和对当前点云进行预处理 输入是雷达点云话题 输出是 4种特征点…...

编程日记 2023/8/30 14:20:07

Java 8 新特性——Lambda 表达式（2）

一、Java Stream API Java Stream函数式编程接口最初在Java 8中引入&#xff0c;并且与 lambda 一起成为Java开发里程碑式的功能特性&#xff0c;它极大的方便了开放人员处理集合类数据的效率。 Java Stream就是一个数据流经的管道&#xff0c;并且在管道中对数据进行操作&…...

编程日记 2023/8/30 14:19:06

MES管理系统中常用的数据模型有哪些

在MES管理系统项目中&#xff0c;数据建模对于生产过程的监控、分析和管理具有至关重要的作用。本文将介绍一些常见的MES管理系统数据建模方面&#xff0c;并阐述它们在生产过程中的重要性和应用。 1、产品数据模型是MES系统中的基础模块之一。它涵盖了产品的基本信息、规格和属…...

编程日记 2023/8/30 14:18:03

ARM DIY（三）板载串口和 LCD 调试

前言 今天焊接两大关键输入输出设备&#xff1a;串口和屏幕。 串口 串口部分使用 CP2102N 芯片&#xff08;USB 转 TTL&#xff09;&#xff0c;这样用一根数据线连接板子和 PC 就可以直接调试了。 焊接 CP2102 和 Type C 上电调试&#xff0c;串口可以正常输入输出。 看来…...

编程日记 2023/8/30 14:17:02

计算机网络-笔记-第一章-计算机网络概述

目录 一、第一章——计算机网络概述 1、因特网概述 &#xff08;1&#xff09;网络、互联网、因特网 &#xff08;2&#xff09;因特网发展的三个阶段 &#xff08;3&#xff09;因特网服务的提供者&#xff08;ISP&#xff09; &#xff08;4&#xff09;因特网标准化工…...

编程日记 2023/8/30 14:15:59

Oracle-day4：分组查询（带条件）、DDL建表、约束、主从表

一、内容回顾 /*------------------内容回顾------------------------上周内容回顾--1、单表的基础查询--A、select * from emp;--B、列的运算 --数字类型运算 - * /--函数运算 mod ceil floor round upper lower--C、取别名--列、表达书取别名--*表示所有的列和列同时存在时…...

编程日记 2023/8/30 14:14:58

（详解)数据结构-----------栈与队列 c语言实现

本章将会详细讲解以下知识点&#xff1a; 目录 一&#xff1a;栈 1&#xff1a;栈的定义&#xff0c;栈的特点 2&#xff1a;用什么结构来实现栈与原因的分析? 3: (超详解)栈的常用接口并且附上测试用例 二:队列 1:队列的定义&#xff0c;队列的特点 2&#xff1a;用什么结…...

编程日记 2023/8/30 14:13:56

前端文件、图片直传OOS、分片上传、el-upload上传（vue+elementUI）

前言&#xff1a;基于天翼云的面相对象存储(Object-Oriented Storage&#xff0c;OOS),实现小文件的直接上传&#xff0c;大文件的分片上传。 开发文档地址&#xff1a;网址 上传之前的相关操作&#xff1a;注册账户&#xff0c;创建 AccessKeyId 和 AccessSecretKey之后&…...

编程日记 2023/8/30 14:12:54

java自动登录 selenium 自动登录并获取cookie

选择操作网页 我用的edge&#xff0c;谷歌我的版本太高没有对应的驱动… 下载Edge的驱动程序&#xff0c;直接解压就好里面只有一个.exe文件 https://developer.microsoft.com/en-us/microsoft-edge/tools/webdriver/ 复制即用&#xff0c;看注释 import com.alibaba.fastjs…...

编程日记 2023/8/30 14:11:53

vue中 computed()方法详解

在Vue中&#xff0c;computed是一种计算属性&#xff0c;它用于定义一个属性&#xff0c;该属性的值是根据其他属性的值计算而来的。computed属性的值会被缓存&#xff0c;只有当依赖的属性发生变化时&#xff0c;才会重新计算。 computed属性可以在Vue实例的computed选项中定…...

编程日记 2023/8/30 14:10:51

在服务器上搭建Jenkins

目录 1.服务器要求 2.官方文档 3.在服务器上下载Jenkins 3.1 下载war包 3.2 将war包上传到服务器的一个目录下 3.3 启动jenkins 3.3.1 jdk版本升级 1&#xff09;下载jdk17 2&#xff09;解压到当前文件夹 3&#xff09;配置路径 4.jenkins配置 4.1 填写初始密码&a…...

编程日记 2023/8/30 14:09:50

全面解析MES系统中的报工操作

一、报工操作的定义&#xff1a; 报工操作是指在生产过程中&#xff0c;操作员通过MES系统记录和提交生产工序的相关信息&#xff0c;如工时、产量、质量等。报工操作将生产过程中的实际情况反馈给MES系统&#xff0c;实现生产数据的实时采集和记录。 二、报工操作的流程&…...

编程日记 2023/8/30 14:08:49

Harbor 私有仓库迁移

文章目录 一.私有仓库迁移的介绍1.为何要对Harbor 私有仓库的迁移2.Harbor 私有仓库的迁移特点3. Harbor 私有仓库的迁移注意要点 二.私有仓库迁移配置1.源Harbor配置&#xff08;192.168.198.11&#xff09;&#xff08;1&#xff09;接着以下操作查看容器状况及是否可以登录 …...

编程日记 2023/8/30 14:07:48

制造业物联网革命：智慧工厂数据采集与远程监控管理

智慧工厂是指运用现代信息技术和物联网技术&#xff0c;实现制造业生产过程的智能数字化。智慧工厂的工业设备不仅能够自动化运行&#xff0c;还可以通过网络技术帮助企业实现数据采集、远程监控与管理。4G工业网关便成为了智慧工厂通讯的重要组成部分&#xff0c;起到了连接工…...

编程日记 2023/8/30 14:06:46

软考A计划-网络工程师-复习背熟-网络管理和计算机基础知识

点击跳转专栏>Unity3D特效百例点击跳转专栏>案例项目实战源码点击跳转专栏>游戏脚本-辅助自动化点击跳转专栏>Android控件全解手册点击跳转专栏>Scratch编程案例点击跳转>软考全系列点击跳转>蓝桥系列 &#x1f449;关于作者 专注于Android/Unity和各种游…...

编程日记 2023/8/30 14:05:45

springBoot打印精美logo

文章目录 &#x1f412;个人主页&#x1f3c5;JavaEE系列专栏&#x1f4d6;前言&#xff1a;&#x1f380;文本logo &#x1f412;个人主页 &#x1f3c5;JavaEE系列专栏 &#x1f4d6;前言&#xff1a; 本篇博客主要以提供springBoot打印精美logo &#x1f380;文本logo ??…...

编程日记 2023/8/30 14:04:42

kali开启SSH服务(简单无比)

我会一直陪着你 1.切换到管理员用户&#xff1a;2.启动SSH服务3.要在Kali Linux上启用SSH服务并修改配置文件&#xff0c;你可以按照以下步骤进行操作&#xff1a;4.查看SSH服务状态是否正常运行&#xff0c;命令为&#xff1a;注意&#xff1a;配置文件有些地方不同&#xff0…...

编程日记 2023/8/30 14:03:41

Ubuntu20.04如何更换国内源-阿里云源

1.备份源文件 cp /etc/apt/sources.list /etc/apt/sources.list.bak 2.打开源文件&#xff0c;注释默认的源 vim /etc/apt/sources.list ## 注释原本内容 # deb http://mirrors.ivolces.com/ubuntu/ focal main restricted universe multiverse # deb-src http://mirrors.ivolc…...

编程日记 2023/8/30 14:02:39

golang循环变量捕获问题​​

在 Go 语言中&#xff0c;当在循环中启动协程&#xff08;goroutine&#xff09;时&#xff0c;如果在协程闭包中直接引用循环变量&#xff0c;可能会遇到一个常见的陷阱 - ​​循环变量捕获问题​​。让我详细解释一下&#xff1a; 问题背景 看这个代码片段&#xff1a; fo…...

编程新知 2025/7/5 11:03:11

从深圳崛起的“机器之眼”：赴港乐动机器人的万亿赛道赶考路

进入2025年以来&#xff0c;尽管围绕人形机器人、具身智能等机器人赛道的质疑声不断&#xff0c;但全球市场热度依然高涨&#xff0c;入局者持续增加。 以国内市场为例&#xff0c;天眼查专业版数据显示&#xff0c;截至5月底&#xff0c;我国现存在业、存续状态的机器人相关企…...

编程新知 2025/10/27 23:55:09

【磁盘】每天掌握一个Linux命令 - iostat

目录 【磁盘】每天掌握一个Linux命令 - iostat工具概述安装方式核心功能基础用法进阶操作实战案例面试题场景生产场景 注意事项 【磁盘】每天掌握一个Linux命令 - iostat 工具概述 iostat&#xff08;I/O Statistics&#xff09;是Linux系统下用于监视系统输入输出设备和CPU使…...

编程新知 2025/9/30 16:39:11

ffmpeg（四）：滤镜命令

FFmpeg 的滤镜命令是用于音视频处理中的强大工具&#xff0c;可以完成剪裁、缩放、加水印、调色、合成、旋转、模糊、叠加字幕等复杂的操作。其核心语法格式一般如下&#xff1a; ffmpeg -i input.mp4 -vf "滤镜参数" output.mp4或者带音频滤镜&#xff1a; ffmpeg…...

编程新知 2025/10/16 23:42:48

DIY｜Mac 搭建 ESP-IDF 开发环境及编译小智 AI

前一阵子在百度 AI 开发者大会上&#xff0c;看到基于小智 AI DIY 玩具的演示&#xff0c;感觉有点意思&#xff0c;想着自己也来试试。 如果只是想烧录现成的固件&#xff0c;乐鑫官方除了提供了 Windows 版本的 Flash 下载工具 之外&#xff0c;还提供了基于网页版的 ESP LA…...

编程新知 2025/10/27 13:41:23

基于TurtleBot3在Gazebo地图实现机器人远程控制

1. TurtleBot3环境配置 # 下载TurtleBot3核心包 mkdir -p ~/catkin_ws/src cd ~/catkin_ws/src git clone -b noetic-devel https://github.com/ROBOTIS-GIT/turtlebot3.git git clone -b noetic https://github.com/ROBOTIS-GIT/turtlebot3_msgs.git git clone -b noetic-dev…...

编程新知 2025/10/25 22:07:27

A2A JS SDK 完整教程：快速入门指南

目录 什么是 A2A JS SDK?A2A JS 安装与设置A2A JS 核心概念创建你的第一个 A2A JS 代理A2A JS 服务端开发A2A JS 客户端使用A2A JS 高级特性A2A JS 最佳实践A2A JS 故障排除 什么是 A2A JS SDK? A2A JS SDK 是一个专为 JavaScript/TypeScript 开发者设计的强大库&#xff…...

编程新知 2025/9/29 5:00:25

【Nginx】使用 Nginx+Lua 实现基于 IP 的访问频率限制

使用 NginxLua 实现基于 IP 的访问频率限制 在高并发场景下&#xff0c;限制某个 IP 的访问频率是非常重要的&#xff0c;可以有效防止恶意攻击或错误配置导致的服务宕机。以下是一个详细的实现方案&#xff0c;使用 Nginx 和 Lua 脚本结合 Redis 来实现基于 IP 的访问频率限制…...

编程新知 2025/10/22 6:06:44

ubuntu22.04有线网络无法连接，图标也没了

今天突然无法有线网络无法连接任何设备&#xff0c;并且图标都没了 错误案例 往上一顿搜索&#xff0c;试了很多博客都不行&#xff0c;比如 Ubuntu22.04右上角网络图标消失 最后解决的办法 下载网卡驱动&#xff0c;重新安装 操作步骤 查看自己网卡的型号 lspci | gre…...

编程新知 2025/10/30 1:44:58

小木的算法日记-多叉树的递归/层序遍历

&#x1f332; 从二叉树到森林&#xff1a;一文彻底搞懂多叉树遍历的艺术 &#x1f680; 引言 你好&#xff0c;未来的算法大神&#xff01; 在数据结构的世界里&#xff0c;“树”无疑是最核心、最迷人的概念之一。我们中的大多数人都是从 二叉树 开始入门的&#xff0c;它…...

编程新知 2025/7/6 4:23:14