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

Thymeleaf

替代jsp

功能:服务器渲染(就是将服务器的数据展示在网页上)

1、MVC概念
  • model 模型

javaBean(User/Book/Order...)

  • View视图

html + 服务器的动态数据

  • Controller控制器

Servlet

MVC是在表述层开发运用的一种设计理念。主张把封装数据的【模型】、显示用户界面的【视图】、协调调度的【控制器】分开。

好处:

  • 进一步实现各个组件之间的解耦
  • 让各个组件可以单独维护
  • 将视图分离出来后,我们后端工程师和前端工程师的对接更方便

MVC和层架构之间关系

 2、Thymeleaf的简介

概念:

Thymeleaf是一款用于渲染 XML/XHTML/HTML5 内容的模板引擎。类似 JSP、Velocity、FreeMaker等,他也可以轻易的与Spring MVC等Web框架进行集成作为Web应用的模板引擎。它的主要作用是在静态页面上渲染显示动态数据。

优势:

  • SpringBoot官方推荐使用的视图模板技术,和SpringBoot完美结合
  • 不经过服务器运算仍然可以直接查看原始数据,对前端工程师更友好
<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head><meta charset="UTF-8"><title>Title</title>
</head>
<body><p th:text="${username}">Original Value</p></body>
</html>
3、Thymeleaf的HelloWorld

①加入jar包

②配置上下文路径

<!-- 在上下文参数中配置视图前缀和视图后缀 -->
<context-param><param-name>view-prefix</param-name><param-value>/WEB-INF/view/</param-value>
</context-param>
<context-param><param-name>view-suffix</param-name><param-value>.html</param-value>
</context-param>

在web.xml中配置

③创建Servlet基类 ViewBaseServlet类

这个类复制粘贴过来,将来使用框架后,这些代码将被取代。

上面①②③步我们完成了配置工作,然后

④创建index.html文件

⑤index.html编写超链接访问Servlet

<a href="hello">点击访问HelloServlet</a>

⑥ 创建HelloServlet,并在web.xml配置

    <servlet><servlet-name>HelloServlet</servlet-name><servlet-class>com.atguigu.servlet.HelloServlet</servlet-class></servlet><servlet-mapping><servlet-name>HelloServlet</servlet-name><url-pattern>/hello</url-pattern></servlet-mapping>

⑦修改Servlet让其继承ViewServlet,并给请求域中设置参数

public class HelloServlet extends ViewBaseServlet {protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {doGet(request,response);}protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {//给响应(跳转至admin.html,并且将msg的数据展示在网页上)String msg = "这是服务器的数据";//取到Thymeleaf让Themeleaf对页面做渲染操作request.setAttribute("msg",msg);this.processTemplate("admin",request,response);//原理也是转发}
}

⑧跳转到Thymeleaf页面

<!DOCTYPE html>
<html lang="en" xmlns:th="http://thymeleaf.org">
<head><meta charset="UTF-8"><title>Title</title>
</head>
<body>
<h1>admin</h1>
<h2 th:text="${msg}">放服务器传过来的msg数据</h2>
</body>
</html>

admin.html页面结果:

 网页一开始访问到了index.html页面,在点击超链接后,程序进入到HelloServlet类,再给请求域设置一个msg参数,由于继承了ViewBaseServlet类且调用父类的processTemplate()方法,将渲染好的网页(msg参数)转发给浏览器页面,我们就看到了“这是服务器的数据”。

4、Thymeleaf的基本语法

①名称空间

thymeleaf所有的的表达是都是通过属性的方法添加,th:表达式内容

位置:html标签的属性上  xmlns:th="http://www.thymeleaf.org"

②修改标签的文本值(双标签)

th:text="新值"
案例:<h2 th:text="${msg}">放服务器传来的msg数据</h2>

③修改标签的属性值(单标签和双标签)

th:属性名="新值"
案例:<input type="text"  th:value="${msg}" value="这是原始值" />

④解析url中的上下文路径:

 @{/}
用途:a.用在base标签上<base href="/day07_Thymeleaf_war_exploded123/" th:href="@{/}">b.作为请求的路径<a th:href="@{/root(id=101,name='jack',age=20)}">RootServlet02</a>

如果你的网页想使用thymeleaf表达式的话,必须经过Servlet然后再经过Thymeleaf进行渲染才可以

项目内所有的网页都需要thymeleaf渲染(都需要过Servlet再过Thymeleaf模板引擎)

相关文章:

Thymeleaf

替代jsp 功能&#xff1a;服务器渲染&#xff08;就是将服务器的数据展示在网页上&#xff09; 1、MVC概念 model 模型 javaBean(User/Book/Order...) View视图 html 服务器的动态数据 Controller控制器 Servlet MVC是在表述层开发运用的一种设计理念。主张把封装数据…...

网络学习(一)|深入了解API网关:定义、功能和关键术语

文章目录 定义主要功能关键术语 定义 API 网关&#xff08;API Gateway&#xff09;是一个核心的服务架构组件&#xff0c;用于管理、路由和保护对后端服务的访问。它充当了系统内外的接口&#xff0c;负责接收来自客户端的请求&#xff0c;并将其路由到相应的后端服务&#x…...

基于yolov8+flask搭建一个web版本的网页模型预测系统

测试环境&#xff1a; anaconda3python3.8 torch1.9.0cu111 ultralytics8.2.2 首先我们将训练好的权重放在weights目录下面 并将名字改成yolov8n.pt&#xff0c;如果不想改可以在代码app.py都把路径改过来即可。然后我们打开 python app.py之后看到 我们点击选择文件支持图…...

【北京迅为】《iTOP-3588从零搭建ubuntu环境手册》-第8章 安装编译所需要的依赖包

RK3588是一款低功耗、高性能的处理器&#xff0c;适用于基于arm的PC和Edge计算设备、个人移动互联网设备等数字多媒体应用&#xff0c;RK3588支持8K视频编解码&#xff0c;内置GPU可以完全兼容OpenGLES 1.1、2.0和3.2。RK3588引入了新一代完全基于硬件的最大4800万像素ISP&…...

牛客热题:合并二叉树

牛客热题&#xff1a;二叉树与双向链表> &#x1f4df;作者主页&#xff1a;慢热的陕西人 &#x1f334;专栏链接&#xff1a;力扣刷题日记 &#x1f4e3;欢迎各位大佬&#x1f44d;点赞&#x1f525;关注&#x1f693;收藏&#xff0c;&#x1f349;留言 文章目录 牛客热题…...

conda 常用20个命令

conda常用20个命令 这些命令涵盖了Conda环境管理和包管理的常用功能&#xff0c;可帮助你有效地管理Python环境和软件包。 创建环境&#xff1a; conda create --name myenv这个命令用于创建一个名为myenv的新环境。你可以在--name后面指定环境的名称&#xff0c;并在其后加上…...

Git泄露(续)

接上一篇补充 git config --global user.name " " git config --global user.email 邮箱地址 配置用户名和邮箱 git commit 使其处于交互区&#xff0c;没有使用 -m&#xff0c;默认用vim 来编辑和提交信息 输入要提交的内容&#xff0c;然后按ESC建回到命令…...

clickhouse卸载与安装

ClickHouse是一个用于联机分析&#xff08;OLAP&#xff09;的列式数据库管理系统&#xff08;DBMS&#xff09;&#xff0c;来自于俄罗斯本土搜索引擎企业Yandex公司。它是为处理大规模数据集而设计的&#xff0c;并提供高性能和低延迟的查询支持。 注意&#xff1a;此教程的运…...

npm install [Error]

npm install 依赖的时候报错 依赖版本问题的冲突&#xff0c;忽视即可 使用 npm install --legacy-peer-deps...

Redisson分布式锁全解析:从基础到红锁,锁定高并发解决方案

1. 介绍Redisson和分布式锁的概念 1.1 Redisson简介 Redisson是一个在Redis的基础上实现的Java驻内存数据网格(In-Memory Data Grid, IMDG)。它不仅提供了对分布式和可伸缩数据结构的支持&#xff0c;还提供了多种分布式服务&#xff0c;包括但不限于分布式锁、集合、映射、计…...

RocketMQ-Dashboard 控制台使用详解

1 安装部署 具体部署启动请参考&#xff1a;RocketMQ从安装、压测到运维一站式文档_rocketmq benchmark压测-CSDN博客 RocketMq的dashboard&#xff0c;有运维页面&#xff0c;驾驶舱&#xff0c;集群页面&#xff0c;主题页面&#xff0c;消费者页面&#xff0c;生产者页面&…...

JSP+SQL学生成绩管理系统

Java版本&#xff1a;1.8 数据库&#xff1a;MySQL 框架&#xff1a;Spring Spring MVC MyBatis 服务器&#xff1a;Tomcat 前端解析框架&#xff1a;Thymeleaf 开发工具&#xff1a;Idea 2017 版本管理工具&#xff1a;Maven 版本控制工具&#xff1a;GitHub 经过对系统的需…...

5G工业路由器实现驾考科目三实时监控与远程控制

5G驾考路由器的应用主要体现在智能驾考系统中&#xff0c;其优势包括提高考试安全性、效率和规范性&#xff0c;同时杜绝违规行贿作弊的行为。 在驾考系统中&#xff0c;5G工业路由器是数据传输的桥梁设备。车载设备如摄像头、定位系统、硬盘录像机、传感器等&#xff0c;通过串…...

基于微信小程序+JAVA Springboot 实现的【智慧乡村旅游服务平台】app+后台管理系统 (内附设计LW + PPT+ 源码+ 演示视频 下载)

项目名称 项目名称&#xff1a; 基于微信小程序的智慧乡村旅游服务平台的设计与实现 项目技术栈 该项目采用了以下核心技术栈&#xff1a; 后端框架/库&#xff1a; Java SSM框架数据库&#xff1a; MySQL前端技术&#xff1a; 微信开发者工具、uni-app其他技术&#xff1a…...

图片中的表格转成word用什么工具好?

2024年5月16日&#xff0c;周四上午 我推荐用免费的腾讯OCR表格识别v3体验网站 用手机文档模式拍下并转成黑白后&#xff0c;成功识别的概率还是非常大的 OCR Demo (tencent.com)https://ocrdemo.cloud.tencent.com/识别成功后&#xff0c;复制识别结果并粘贴到word文档里面就…...

P1305 新二叉树

题目描述 输入一串二叉树&#xff0c;输出其前序遍历。 输入格式 第一行为二叉树的节点数 &#x1d45b;。(1≤&#x1d45b;≤26) 后面 &#x1d45b; 行&#xff0c;每一个字母为节点&#xff0c;后两个字母分别为其左右儿子。特别地&#xff0c;数据保证第一行读入的节点…...

设计模式学习笔记 - 回顾总结:在实际软件开发中常用的设计思想、原则和模式

概述 本章&#xff0c;先来回顾下整个专栏的知识体系&#xff0c;主要包括面向对象、设计原则、编码规范、重构技巧、设计模式五个部分。 面向对象 相对于面向过程、函数式编程&#xff0c;面向对象是现在最主流的编程范式。纯面向过程的编程方法&#xff0c;现在已经不多见了…...

CPT7数据保存详细步骤

一、连接设备、打开NovAtelConnect 软件 (1)点击1,并在2中输入如下命令: LOG RANGEB ONTIME 1 // 输出原始数据记录在板卡LOG RAWEPHEMB ONTIME 1 // 输出 GPS 原始星历记录在板卡LOG bdsephemerisb ONTIME 1 // 输出...

物联网促进信息化——​青创智通工业物联网解决方案​

随着传感器网络&#xff08;WSN)、无线射频识别&#xff08;RFID&#xff09;以及微电子机械系统(MEIVIS&#xff09;等技术的不断成熟,扩展了人们对信息获取和使用的能力&#xff0c;并将提高制造效率、改善产品质量、降低产品成本和资源消耗、为用户提供更加透明和个性化的服…...

服务端Web资源缓存

1.前言 虽然客户端缓存效果很好&#xff0c;但它有一个核心问题&#xff1a;要在本地提供资源&#xff0c;必须先将其存储在缓存中。因此&#xff0c;每个客户端都需要其缓存的资源。如果请求的资源需要大量计算&#xff0c;则无法扩展。服务器端缓存背后的理念是计算一次资源…...

基于FPGA的PID算法学习———实现PID比例控制算法

基于FPGA的PID算法学习 前言一、PID算法分析二、PID仿真分析1. PID代码2.PI代码3.P代码4.顶层5.测试文件6.仿真波形 总结 前言 学习内容&#xff1a;参考网站&#xff1a; PID算法控制 PID即&#xff1a;Proportional&#xff08;比例&#xff09;、Integral&#xff08;积分&…...

MMaDA: Multimodal Large Diffusion Language Models

CODE &#xff1a; https://github.com/Gen-Verse/MMaDA Abstract 我们介绍了一种新型的多模态扩散基础模型MMaDA&#xff0c;它被设计用于在文本推理、多模态理解和文本到图像生成等不同领域实现卓越的性能。该方法的特点是三个关键创新:(i) MMaDA采用统一的扩散架构&#xf…...

镜像里切换为普通用户

如果你登录远程虚拟机默认就是 root 用户&#xff0c;但你不希望用 root 权限运行 ns-3&#xff08;这是对的&#xff0c;ns3 工具会拒绝 root&#xff09;&#xff0c;你可以按以下方法创建一个 非 root 用户账号 并切换到它运行 ns-3。 一次性解决方案&#xff1a;创建非 roo…...

OpenLayers 分屏对比(地图联动)

注&#xff1a;当前使用的是 ol 5.3.0 版本&#xff0c;天地图使用的key请到天地图官网申请&#xff0c;并替换为自己的key 地图分屏对比在WebGIS开发中是很常见的功能&#xff0c;和卷帘图层不一样的是&#xff0c;分屏对比是在各个地图中添加相同或者不同的图层进行对比查看。…...

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…...

(一)单例模式

一、前言 单例模式属于六大创建型模式,即在软件设计过程中,主要关注创建对象的结果,并不关心创建对象的过程及细节。创建型设计模式将类对象的实例化过程进行抽象化接口设计,从而隐藏了类对象的实例是如何被创建的,封装了软件系统使用的具体对象类型。 六大创建型模式包括…...

rknn toolkit2搭建和推理

安装Miniconda Miniconda - Anaconda Miniconda 选择一个 新的 版本 &#xff0c;不用和RKNN的python版本保持一致 使用 ./xxx.sh进行安装 下面配置一下载源 # 清华大学源&#xff08;最常用&#xff09; conda config --add channels https://mirrors.tuna.tsinghua.edu.cn…...

车载诊断架构 --- ZEVonUDS(J1979-3)简介第一篇

我是穿拖鞋的汉子,魔都中坚持长期主义的汽车电子工程师。 老规矩,分享一段喜欢的文字,避免自己成为高知识低文化的工程师: 做到欲望极简,了解自己的真实欲望,不受外在潮流的影响,不盲从,不跟风。把自己的精力全部用在自己。一是去掉多余,凡事找规律,基础是诚信;二是…...

HTML中各种标签的作用

一、HTML文件主要标签结构及说明 1. <&#xff01;DOCTYPE html> 作用&#xff1a;声明文档类型&#xff0c;告知浏览器这是 HTML5 文档。 必须&#xff1a;是。 2. <html lang“zh”>. </html> 作用&#xff1a;包裹整个网页内容&#xff0c;lang"z…...

java 局域网 rtsp 取流 WebSocket 推送到前端显示 低延迟

众所周知 摄像头取流推流显示前端延迟大 传统方法是服务器取摄像头的rtsp流 然后客户端连服务器 中转多了&#xff0c;延迟一定不小。 假设相机没有专网 公网 1相机自带推流 直接推送到云服务器 然后客户端拉去 2相机只有rtsp &#xff0c;边缘服务器拉流推送到云服务器 …...