Thymeleaf环境下如何在JavaScript中更简洁获取auth0.domain配置？

当然有更简洁的写法！这里有两种常用的优化方案，你可以根据实际场景选择：

1. 直接使用Thymeleaf消息表达式（最简洁） #

既然你在HTML里已经能用th:utext="#{auth0.domain}"获取配置，那在JS里可以直接复用这个消息键，不用再调用@environment.getProperty()：

<script th:inline="javascript">
  const auth0Domain = [[#{auth0.domain}]];
</script>

这种写法和HTML里的逻辑保持一致，少了一大串方法调用，更直观。注意要确保你的<script>标签加上了th:inline="javascript"（如果全局没开启inline模式的话）。

2. 通过HTML data属性传递配置（更解耦） #

如果想让JS代码和Thymeleaf模板逻辑彻底分离，可以把配置放到HTML元素的data属性里，再用原生JS读取：

<!-- 在页面根元素或专门的配置容器上添加data属性 -->
<body th:data-auth0-domain="#{auth0.domain}">
  <!-- 页面内容 -->
  
  <script>
    // 从data属性读取配置，完全不用Thymeleaf表达式混在JS里
    const auth0Domain = document.body.dataset.auth0Domain;
  </script>
</body>

这种方式适合需要传递多个配置项的场景，或者你希望JS代码更纯粹、可复用的情况。

两种方式都比你原来的写法更简洁，第一种是直接简化表达式，第二种是实现了模板和JS的解耦，看你需求选就好~

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