Thymeleaf的th:onclick使用model传递变量报错问题求助

Thymeleaf 对事件处理属性（如 onclick）的变量表达式有严格安全限制：仅允许返回数字或布尔值的变量表达式直接用于这类属性。字符串类型的变量（比如你的 ${list.boardCategory}）会被判定为不安全内容——直接拼接字符串到事件代码中存在XSS注入风险，因此触发报错。

你第一个示例能正常运行，是因为 ${list.id} 是数字类型，符合Thymeleaf的安全校验规则；而第二个示例引入了字符串类型的 ${list.boardCategory}，违反了这一限制。

推荐两种合规的实现方式：

方法1：使用 data-* 属性存储变量，再在事件中读取 #

先将字符串变量存入自定义data-*属性，再通过DOM API读取属性值拼接URL，这是Thymeleaf官方推荐的处理方式：

<!-- 先在元素上定义data属性 -->
<button 
  data-board-category="${list.boardCategory}" 
  data-id="${list.id}"
  th:onclick="location.href='/' + this.dataset.boardCategory + '/' + this.dataset.id">
  点击跳转
</button>

方法2：使用Thymeleaf的URL表达式 @{} #

利用Thymeleaf内置的URL表达式构建跳转链接，它会自动处理变量的安全转义，同时更符合Thymeleaf语法规范：

<button th:onclick="location.href='@{/{category}/{id}(category=${list.boardCategory}, id=${list.id})}'">
  点击跳转
</button>

这种方式会自动生成正确的URL路径，无需手动拼接字符串，同时规避了XSS风险。

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