0
点赞
收藏
分享

微信扫一扫

SpringBoot解决整合thymeleaf静态资源以及没有整合时都无法访问的尝试


  • 本来今天写的JS代码就看不太懂,结果后端静态资源映射又出现问题了。以为是路径扫描错误或者是拦截器拦截了,没有配置拦截器,所以以为是路径扫描错误所以这样进行了重新配置:

/**
* 映射静态资源
*/
//@Configuration
//public class WebMvcConfig extends WebMvcConfigurationSupport {
// /**
// * 配置静态资源
// * @param registry
// */
// @Override
// protected void addResourceHandlers(ResourceHandlerRegistry registry) {
// registry.addResourceHandler("/static/**").addResourceLocations("classpath:/static/");
// super.addResourceHandlers(registry);
// }
//}

然后还可以这样

#  mvc: #直接定义过滤规则与静态资源位置
# static-path-pattern: /static/**
# resources:
# static-locations: classpath:/static/

以上都没有什么用,这是怎么回事呢?以前前端给我的资源这样配置顶多在家一个拦截器就可以使用了,这次多了什么呢?
我们把全部的设置都消除掉,一个一个进行探究:

1. thymeleaf的链接URL写法---@{}

我之前是这样写的:

<link th:rel="stylesheet" type="text/css"
th:href="/themes/default/easyui.css">
<script type="text/javascript" th:src="/jquery.easyui.min.js"></script>

正确定义URL链接应该这样

<link th:rel="stylesheet" type="text/css"
th:href="@{/themes/default/easyui.css}">
<script type="text/javascript" th:src="@{/jquery.easyui.min.js}"></script>

这里具体的情况还是需要继续分开说

2. 我把具体的html分成包含thymeleaf与不包含thymeleaf进行测试

  • 不包含的时候:

<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="UTF-8">
<title>用户列表</title>
<link rel="stylesheet" type="text/css"
href="/themes/default/easyui.css">
<link rel="stylesheet" type="text/css"
href="/demo/demo.css">
<link rel="stylesheet" type="text/css"
href="/themes/icon.css">
<script type="text/javascript" src="/jquery.easyui.min.js"></script>
<script type="text/javascript" src="/jquery.min.js"></script>
<script type="text/javascript">
//定义事件方法
function onSearch() {
//定义请求路径
var opts = $("#dg").datagrid("options");
opts.url="./list";
//获取查询参数
var name=$("name").val();
//组织参数
var params = {};
if(name != null && name.trim() != ''){
params.name = name;
}
//重新载入表格数据
$("#dg").datagrid('load', params);
}
</script>

</head>
<body>
</body>
</html>

效果如下,可以正常使用:

SpringBoot解决整合thymeleaf静态资源以及没有整合时都无法访问的尝试_javascript


可以正常使用

  • 接下来在ref变成th:ref
  • SpringBoot解决整合thymeleaf静态资源以及没有整合时都无法访问的尝试_javascript_02

  • 还是可以

3. 接下来,我们需要对thymeleaf的视图解析器进行配置

thymeleaf:
prefix: classpath:/templates/
suffix: .html

结果如下:

SpringBoot解决整合thymeleaf静态资源以及没有整合时都无法访问的尝试_javascript_03


还是可以

4. 接下来配置映射静态资源

/**
* 映射静态资源
*/
@Configuration
public class WebMvcConfig extends WebMvcConfigurationSupport {
/**
* 配置静态资源
* @param registry
*/
@Override
protected void addResourceHandlers(ResourceHandlerRegistry registry) {
registry.addResourceHandler("/static/**").addResourceLocations("classpath:/static/");
super.addResourceHandlers(registry);
}
}

结果如下:

SpringBoot解决整合thymeleaf静态资源以及没有整合时都无法访问的尝试_css_04


还是可以

5. 接下来从applcaition.yml中配置静态资源扫描路径

#  mvc: #直接定义过滤规则与静态资源位置

结果如下:

SpringBoot解决整合thymeleaf静态资源以及没有整合时都无法访问的尝试_javascript_05


失败了,终于失败了

6. 还不能确定,我们把代码中的资源配置注释掉,只留下application.yml中的

SpringBoot解决整合thymeleaf静态资源以及没有整合时都无法访问的尝试_css_06


对不起又可以了

7. 这个就又回到最开始了,什么也没有配置为什么静态资源无法访问,不要怀疑

我用get方法当时也是404
---暂停一下,我发现一个惊天bug--好像都使用th标签测试的!!!

----虚惊,没问题-----

那我现在可以想到的就是相对路径和绝对路径的问题了,是在想不到其他原因了。

目录结构

SpringBoot解决整合thymeleaf静态资源以及没有整合时都无法访问的尝试_javascript_07


根据目录结构写的代码:

<link th:rel="stylesheet" type="text/css"
href="../../static/themes/default/easyui.css">
<link rel="stylesheet" type="text/css"
href="../../static/demo/demo.css">
<link rel="stylesheet" type="text/css"
href="../../static/themes/icon.css">
<script type="text/javascript" src="../../static/jquery.easyui.min.js"></script>
<script type="text/javascript" src="../../static/jquery.min.js"></script>
<script type="text/javascript">

结果:

SpringBoot解决整合thymeleaf静态资源以及没有整合时都无法访问的尝试_css_08


报错了有没有!!!

  • 再换一种相对路径

<link th:rel="stylesheet" type="text/css"
href="../static/themes/default/easyui.css">
<link rel="stylesheet" type="text/css"
href="../static/demo/demo.css">![在这里插入图片描述](https://img-blog.csdnimg.cn/20200418180142276.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80MzQwNDc5MQ==,size_16,color_FFFFFF,t_70)
<link rel="stylesheet" type="text/css"
href="../static/themes/icon.css">
<script type="text/javascript" src="../static/jquery.easyui.min.js"></script>
<script type="text/javascript" src="../static/jquery.min.js"></script>
<script type="text/javascript">

结果

SpringBoot解决整合thymeleaf静态资源以及没有整合时都无法访问的尝试_静态资源_09


还是错了!!!!!!

总结

这种反向推导还真是有点意思,不过思路还是不够清晰,不然也不会不知道什么时候改变的路径,但是改变为绝对路径之后还会报错,很可能是到时使用了两种映射路径扫描的方法,导致报错


举报

相关推荐

0 条评论