thymeleaf利用fragment解决html页面间获取context-path问题
问题说明
我使用spring boot+thymeleaf做了个项目,那前台页面都是html,里面有各种api调用和路径跳转。
大家都知道这些路径不能写死,为保证任何情况下路径的正确性,一般都是这种格式:项目路径+接口路径,例如:localhost:8080/system/api/user/1
现在已知thymeleaf页面中js要获取项目路径时这样的:
<script type="text/javascript" th:inline="javascript">
/*<![CDATA[*/
var ctx = /*[[@{/}]]*/ '';
/*]]>*/
</script>
ctx=/system/
那我又不想每个页面都写这么一段,所以利用thymeleaf的片段引用特性可以把它抽成公共脚本供各html页面用。
解决方法
1.创建fragment.html
<script type="text/javascript" th:inline="javascript" th:fragment="ctx">
/*<![CDATA[*/
var ctx = /*[[@{/}]]*/ '';
/*]]>*/
</script>
2.页面引用
<!--ctx-->
<script th:replace="~{fragment::ctx}"/>
3.调整接口和路径格式
$.get(ctx+"api/book/list",
{
author: param.author,
name: param.name,
isbn: param.isbn,
page: pageNo,
limit: pageSize
},
var href=ctx+"bookDetail/"+data[i].id;