Thymeleaf中文网

深色模式

3.2 文本与变量进阶 ​

未转义文本 ​

我们首页的最简版本看似已经完成，但有一个细节我们尚未考虑到……如果我们的消息内容包含 HTML 标签会怎样？比如：

properties
home.welcome=Welcome to our <b>fantastic</b> grocery store!

如果像之前一样执行模板渲染，得到的结果会是：

html
<p>Welcome to our &lt;b&gt;fantastic&lt;/b&gt; grocery store!</p>

这显然不是我们想要的效果——<b> 标签被转义成了 &lt;b&gt; 和 &lt;/b&gt;，最终会直接以文本形式显示在浏览器中。

这是 th:text 属性的默认行为：自动转义 HTML 特殊字符（如 <→&lt;、>→&gt;），避免 XSS 攻击并保证文本原样显示。如果希望 Thymeleaf 保留 HTML 标签、不进行转义，就需要使用另一个属性：th:utext（u 代表 “unescaped text”，即未转义文本）：

html
<p th:utext="#{home.welcome}">Welcome to our grocery store!</p>

这样渲染后就能得到我们期望的结果：

html
<p>Welcome to our <b>fantastic</b> grocery store!</p>

核心语法解释 ​

  1. th:text vs th:utext 核心区别：
    属性行为适用场景
    th:text自动转义 HTML 特殊字符，输出纯文本普通文本（无 HTML 标签）
    th:utext不转义 HTML 特殊字符，解析并渲染 HTML 标签包含 HTML 标签的富文本内容
  2. 转义的安全意义： th:text 的自动转义是默认的安全机制，能防止攻击者通过注入 <script> 等恶意标签实施 XSS 攻击；使用 th:utext 时需确保内容是可信的（如系统内置文本），避免引入安全风险。
  3. 渲染逻辑： 无论使用 th:text 还是 th:utext，标签内的默认文本（Welcome to our grocery store!）都会被替换，区别仅在于替换后的内容是否转义。

总结 ​

  1. th:text 是 Thymeleaf 渲染文本的默认属性，会自动转义 HTML 特殊字符，保证安全性；
  2. th:utext 用于渲染包含 HTML 标签的富文本，不会转义标签，需谨慎使用（仅处理可信内容）；
  3. 转义行为是 Thymeleaf 的默认安全策略，使用未转义文本时需评估内容的可信度，避免 XSS 风险。