Thymeleaf 内联 javascript 表达式与变量答案

【问题标题】：Thymeleaf inline javascript expression with variableThymeleaf 内联 javascript 表达式与变量
【发布时间】：2018-11-29 11:56:03
【问题描述】：

我正在使用带有 Thymeleaf 的 Spring Boot，并且知道我可以通过以下方式在 javascript 中使用控制器中的变量：

<script th:inline="javascript">

/*<![CDATA[*/
var username = [[${#authentication.principal.person.isSubscribedTo("random string")}]];
/*]]>*/

</script>

现在我尝试像这样在 CDATA 注释之外使用局部变量。我希望我可以在方法中使用它。

var randomString = "can i use this?";
/*<![CDATA[*/
var username = [[${#authentication.principal.person.isSubscribedTo(randomString)}]];
/*]]>*/

这不起作用，我无法对其进行测试，因为我的调试器无法获取该方法并且没有返回任何错误。

如何在 thymeleaf javascript 表达式中使用本地 javascript 变量？

【问题讨论】：

我认为您必须在您的 username 变量之前的 CDATA 部分中写入变量 randomString。
在 [CDATA] 标签中初始化变量并没有什么坏处。 :)

标签： javascript spring-boot thymeleaf

【解决方案1】：

您对发生的时间和地点有些困惑。

首先，服务器使用 Thymeleaf 为页面生成 HTML 和动态 Javascript。在这个过程中，正如您所说，Thymeleaf 可以在服务器上运行时调用您的 Spring bean。

然后，一旦将 HTML 和动态 Javascript 发送到浏览器，它就会在所有客户端运行 Javascript。

唯一真正的方法是：

也在服务器端、Thymeleaf 或 Thymeleaf 可访问的模型中生成 randomString。
如果您需要在客户端生成该字符串，请让 Javascript 使用该信息向服务器发出单独的 HTTP 请求 (“AJAX”) 调用，然后对响应执行一些合理的操作。也就是说，一旦 Javascript 被发送到浏览器，如果您需要对服务器进行更多的往返，它就在 Javascript 上以确保它发生，因为 Thymeleaf 在页面中的作用已经完成。

【讨论】：