zoukankan      html  css  js  c++  java
  • 12. thymeleaf中资源相对路径的解决

    把博客部署到tomcat上后才发现因之前资源和链接的地址都是使用的相对路径,这样一来在tomcat上就各种找不到资源。从网上看了几种解决方式都挺麻烦的,且不是适配的,所以我根据thymeleaf的规则用下面的方式来解决:
    1. 在js中通过:[[@{/}]], 可以获取当前的contextpath,所以就在每个页面中添加一个js函数,来获取contextpath,然后在js代码中要使用url的地方调用这个函数即可,如下:
    function getContextPath(){
    var context = [[@{/}]];
    return context.substr(0, context.length-1);
    }
    调用时可以这样写:
    $.ajax({
    url:getContextPath()+"/articles/categories",
    success:function(data){
    $(".catagory .content ul").html("");
    for(var i in data){
    var content = '<li addr="' + getContextPath() + '/articles/category/' + data[i].id + '">' + data[i].name + '(' + data[i].count + ')</li>'
    $(".catagory .content ul").append(content);
    }
    $(".catagory .content ul li").click(function(){
    var addr = $(this).attr("addr");
    window.location = addr;
    });
    }
    });
    这样写虽然会增加一些代码量,但是这种方式简单直观。
    2. 在html标记中,可以通过@{/},来获取contextpath,然后结合th:attrprepend来给属性值添加前缀,使用方式如下:
    <li class="item select" addr="home/" th:attrprepend="addr='@{/}'">首页</li>
    或者通过这样使用:<img th:src="@{/images/lvniao.png}" height="128"/>
    3. 在css中可以直接使用相对路径即可;
    因为博客中使用了ueditor,但ueditor的配置是在自己的js中的,这样就只要使用硬编码了,其他如果不能通过上述方式解决的也只好硬编码解决。
    通过这些天的努力,我的博客也就差不多写好了,下面是完成版的代码和数据库脚本下载地址:
    https://pan.baidu.com/s/186W1VXLmSoLDMIuIJnRh1A zmk7
    因为是初学java,所以有些地方对框架和工具的使用方式不对的就请见谅了,如果需要沟通的话,我的qq:645739665,欢迎喜欢折腾技术的小伙伴。

  • 相关阅读:
    mongodb数据类型
    Pycharm2020.1 破解教程
    酱茄主题(资讯/社区WordPress主题)正式发布
    WordPress社区商城小程序“酱茄pro小程序”V1.7.8发布
    SpringBoot 的@Value注解真是太强了,谁用谁说爽!
    python3_String复习
    Core Data的简单实用
    git submodule
    区间修改主席树
    快速数论变换ntt
  • 原文地址:https://www.cnblogs.com/lvniao/p/9056549.html
Copyright © 2011-2022 走看看