问题说明

我使用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;

thymeleaf利用fragment解决html页面间获取context-path问题的更多相关文章

  1. 获取context path或者basePath

    转自:http://hexudonghot.blog.163.com/blog/static/532043422012112264411234/ 在jsp中获取context path或者basePa ...

  2. .NET在IE9中页面间URL传递中文变成乱码的解决办法

     在.Net的项目中,鼠标点击查询按钮,转到查询页面,但URL中包含中文时,传到服务器端后,中文变成了乱码(只有IE9出现该问题).       尝试使用Server.UrlEncode()进行编码, ...

  3. ViewPager (下)-- 利用 Fragment 实现美丽的 页面切换

    之前用的ViewPager适用于简单的广告切换,但实现页面间的切换最好是用官方推荐的Fragment来处理. 本人力争做到最简单.最有用,是想以后用到的时候能够方便的拿过来复制就能够了. 效果图: w ...

  4. Cookie的格式及组成、页面间传参实例

    做项目需要页面间参数传递,搜索了一下网上的回复,发现可以用cookie解决,借此学习cookie的格式及组成: Cookie由变量名和值组成,类似Javascript变量.其属性里既有标准的Cooki ...

  5. js 页面间的通信

    看了一下公司原来的代码,原页面ajax post返回一个页面完整的HTML,然后再打开一个新页面并输出ajax返回的所有代码到新页面上,在新页面上以表单提交的形式实现重定向. 任凭我想了半天也没想出来 ...

  6. vue 页面间使用路由传参数,刷新页面后获取不到参数的问题

    情况 情况再简单说明一下: 有三个页面(a-列表页面,b-内页1,c-内页2),页面a->页面b->页面c有参数传递.从a进入b后,刷新b页面拿不到a页面传进来的参数.或者b页面再进入c页 ...

  7. ASP.NET多种不同页面间数据传递的方法

    1. Get(即使用QueryString显式传递)     方式:在url后面跟参数.     特点:简单.方便.     缺点:字符串长度最长为255个字符:数据泄漏在url中.     适用数据 ...

  8. 详细介绍ASP.NET页面间数据传递的使用方法

    源码:http://www.jinhusns.com/Products/Download/?type=xcj 在ASP.NET中,页面间数据传递的方法有很多.下面为大家总结一下,页面间数据传递的方法. ...

  9. ASP.NET页面间传值总结

    本文我们将讨论的是ASP.NET页面间数据传递的几种方法,对此希望能帮助大家正确的理解ASP.NET页面间数据传递的用处以及便利性. Web页面是无状态的,服务器对每一次请求都认为来自不同用户,因此, ...

  10. 利用window.name+iframe跨域获取数据详解

    详解 前文提到用jsonp的方式来跨域获取数据,本文为大家介绍下如何利用window.name+iframe跨域获取数据. 首先我们要简单了解下window.name和iframe的相关知识.ifra ...

随机推荐

  1. linux-目录树

  2. [转帖]NUMA导致的Oracle性能问题

    https://www.cnblogs.com/realcp1018/p/6903721.html 背景简介: Oracle版本:11.2.0.4 OS 版本:OEL5.8 在一次Oracle的Dat ...

  3. [转帖]15.1. 插件dblink简介

    https://help.kingbase.com.cn/v8.6.7.12/development/sql-plsql/ref-extended-plug-in/dblink.html dblink ...

  4. 【转帖】使用 LuaRocks 安装 Apache APISIX 依赖项时,为什么会导致超时、安装缓慢或安装失败?

    使用 LuaRocks 安装 Apache APISIX 依赖项时,为什么会导致超时.安装缓慢或安装失败?# http://apisix.incubator.apache.org/zh/docs/ap ...

  5. [转帖]010 Linux 文本统计与去重 (wc 和 uniq)

    https://my.oschina.net/u/3113381/blog/5427461 wc 命令一般是作为组合命令的一员与其他命令一同起到统计的作用.而一般情况下使用 wc -l 命令较多. u ...

  6. [转帖]SPECjvm2008 User's Guide

    SPECjvm2008 User's Guide https://spec.org/jvm2008/docs/UserGuide.html#UsePJA Version 1.0Last modifie ...

  7. OpenEuler2203 基于容器和本地文件部署Redis Cluster的过程以及简单性能测试

    背景 其实文件搭建和集群搭建没有任何区别 这次用先用容器搭建出来,然后测试一下性能 想着再使用本地部署的方式搭建一下. 两项验证容器和基于文件的搭建的性能差异 部分资料来源: https://blog ...

  8. 基于spring security创建基本项目框架

    SpringBoot建项目步骤 建表 新建项目 (package name可以自定义,整个项目只能在该包下) 选择可能有到的依赖 (别忘了勾选SQL中的Mybatis Framework,创建项目 如 ...

  9. arch linux 安装

    好长时间都没有更新自己的博客了,我简单翻阅了一下自己的更新记录,上一次更新好像还是在5月份左右,距今也有快半年,这半年也是遇到了很多事情,有不好的,也有好的.这半年我对在日常生活工作中使用Linux系 ...

  10. 2.1 PE结构:文件映射进内存

    PE结构是Windows系统下最常用的可执行文件格式,理解PE文件格式不仅可以理解操作系统的加载流程,还可以更好的理解操作系统对进程和内存相关的管理知识,在任何一款操作系统中,可执行程序在被装入内存之 ...