如何为Thymeleaf的th:errors标签实现HTML转义？

嘿，这个场景我太熟悉了！你现在用的th:errors标签默认会自动转义HTML内容，导致错误里的HTML标签直接变成纯文本显示，而th:utext是用来输出不转义的HTML，但这俩不能直接叠加用对吧？

给你两个实用的解决办法：

• 单条错误消息的情况：直接用Thymeleaf的#fields.errors()表达式配合th:utext，替代原来的th:errors。代码改成这样：

  <span th:if="${#fields.hasErrors('firstName')}" class="color--error" th:utext="${#fields.errors('firstName')}"></span>
  

  原理很简单：#fields.errors('firstName')会获取该字段的错误消息，th:utext会直接渲染里面的HTML内容，不会转义标签。

• 多条错误消息的情况：如果一个字段可能有多个错误提示，可以用循环逐个渲染：

  <div th:if="${#fields.hasErrors('firstName')}" class="color--error">
    <span th:each="error : ${#fields.errors('firstName')}" th:utext="${error}"></span>
  </div>
  

特别提醒：直接输出未转义的HTML一定要注意安全！如果错误消息包含用户输入的内容，一定要先做XSS防护，比如过滤掉危险的HTML标签或者只允许安全的标签（比如<b>、<i>这类），避免恶意代码被执行。

内容的提问来源于stack exchange，提问作者riddle_me_this