带有 Thymeleaf 的 Spring Boot - css 未找到
SpringBoot with Thymeleaf - css not found
首先要说的是,我一直在寻找解决方案,现在我非常绝望。
当 运行 通过 Spring 启动时,我无法从 html 页面访问 css 文件。
html.file
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:th="http://www.thymeleaf.org"
xmlns:sec="http://www.thymeleaf.org/thymeleaf-extras-springsecurity3">
<head lang="en">
<title th:text='#{Title}'>AntiIntruder</title>
<meta charset="UTF-8" />
<link rel="stylesheet" type="text/css" media="all" href="../assets/css/style.css" th:href="@{/css/style.css}" />
</head>
<body>
...
Application.java
@SpringBootApplication // adds @Configuration, @EnableAutoConfiguration, @ComponentScan
@EnableWebMvc
public class Application extends WebMvcConfigurerAdapter {
public static void main(String[] args) {
SpringApplication.run(Application.class, args);
}
@Override
public void addResourceHandlers(ResourceHandlerRegistry registry) {
registry.addResourceHandler("/assets/**").addResourceLocations("classpath:/assets/*");
}
}
文件夹结构:
我试过将 css
文件夹放入 static
文件夹 and/or 删除 addResourcesHandlers,通过相对路径和其他一些东西引用 css。似乎没有什么可以解决这个问题。
如果您尝试解决此问题但没有找到解决方案,请也告诉我,以便我知道我没有被忽略。
我的建议是(再次)将 css
文件夹放在 static
文件夹下,删除 addResourcesHandlers 并使用绝对路径到达 css(例如 /css/style.css
)。
如果您将 css 放在静态文件夹中,则不需要 addResourceHandlers 方法。
.../static/css/app.css
或者如果你真的想把它们放在资产文件夹中:
.addResourceLocations("classpath:/assets/") <-- without the * at the end
.../assets/css/app/css
在这两种情况下,css 应该可以通过
th:href="@{/css/app.css}"
1.使用自定义资源路径
在您的网络配置中
@Override
public void addResourceHandlers(ResourceHandlerRegistry registry) {
if (!registry.hasMappingForPattern("/assets/**")) {
registry.addResourceHandler("/assets/**").addResourceLocations("classpath:/assets/");
}
}
将您的 style.css
文件放入此文件夹
src/main/resources/assets/css/
之后在你看来
<link rel="stylesheet" type="text/css" th:href="@{/assets/css/style.css}" />
.
2。在 spring boot
中使用预定义路径
从您的网络配置中删除 addResourceHandlers
将 style.css
放入以下任意文件夹
src/main/resources/META-INF/resources/assets/css
src/main/resources/resources/assets/css/
src/main/resources/static/assets/css/
src/main/resources/public/assets/css/
并在视图中
<link rel="stylesheet" type="text/css" th:href="@{/assets/css/style.css}" />
.
注意:您可以在此处删除 assets
文件夹。如果要执行此操作,请将其从预定义的资源文件夹以及视图 th:href
中删除。但我保持原样,因为您在问题中明确提到了 assets/
路径。所以我相信您的要求是在您的资源 URL.
中包含 assets/
问题出在 Application.java
文件中的 @EnableWebMvc
注释。我一删除那个,css 就开始在 localhost:8080/css/style.css
可用,但没有应用。到目前为止,我还没有找到 @EnableWebMvc
导致问题的原因。
然后我删除了映射到 /**
的控制器,我已经实现了这个控制器以显示自定义错误页面。
@RequestMapping("/**")
public String notFound() {
return "errors/404";
}
也删除了这个之后,我的 css 开始工作了。 =)
将您的 css 文件夹放入 resources/static 文件夹
对我来说,我必须删除对样式表的静态引用才能使其在 thymeleaf 中工作。
所以
<link rel="stylesheet" type="text/css" media="all" href="../assets/css/style.css" th:href="@{/css/style.css}">
成为
<link rel="stylesheet" th:href="@{/css/bootstrap.css}">
我花了几个小时尝试各种配置和文件路径重命名。不知道为什么,但这是唯一让我的 css 和 js 在 Spring Boot 5.
中加载的东西
在我的例子中,问题出在文件读取权限上。
我从另一个项目复制了文件'style.css',浏览器无法读取它。
重新创建 'style.css' 后,一切正常。
首先像这样使用 WebMvcConfigurer 在您的一个配置 class 上实现
@Configuration
public class WebMvcConfiguration implements WebMvcConfigurer {
//and overide this configuration method like this
@Override
public void configure(WebSecurity web) throws Exception {
web.ignoring().antMatchers("/webjars/**", "/resources/**");
}
}
所以现在您可以像这样覆盖 HttpSecurity 配置
@EnableWebSecurity
public class WebSecurityConfiguration extends WebSecurityConfigurerAdapter{
@Override
public void configure(HttpSecurity http) throws Exception {
http
.authorizeRequests()
.antMatchers("/", "/index").anonymous()
.antMatchers("/**/*.*").permitAll()
.anyRequest().authenticated();
}
}
this ("/**/*.*") regex text will allow files with anny extension
如果您使用的是像 bootstrap 这样的 webjars 库,请将此配置添加到您的 WebSecurityConfiguration
@Override
public void addResourceHandlers(ResourceHandlerRegistry registry) {
registry.addResourceHandler("/webjars/**").addResourceLocations("classpath:/META-INF/resources/webjars/");
}
首先要说的是,我一直在寻找解决方案,现在我非常绝望。
当 运行 通过 Spring 启动时,我无法从 html 页面访问 css 文件。
html.file
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:th="http://www.thymeleaf.org"
xmlns:sec="http://www.thymeleaf.org/thymeleaf-extras-springsecurity3">
<head lang="en">
<title th:text='#{Title}'>AntiIntruder</title>
<meta charset="UTF-8" />
<link rel="stylesheet" type="text/css" media="all" href="../assets/css/style.css" th:href="@{/css/style.css}" />
</head>
<body>
...
Application.java
@SpringBootApplication // adds @Configuration, @EnableAutoConfiguration, @ComponentScan
@EnableWebMvc
public class Application extends WebMvcConfigurerAdapter {
public static void main(String[] args) {
SpringApplication.run(Application.class, args);
}
@Override
public void addResourceHandlers(ResourceHandlerRegistry registry) {
registry.addResourceHandler("/assets/**").addResourceLocations("classpath:/assets/*");
}
}
文件夹结构:
我试过将 css
文件夹放入 static
文件夹 and/or 删除 addResourcesHandlers,通过相对路径和其他一些东西引用 css。似乎没有什么可以解决这个问题。
如果您尝试解决此问题但没有找到解决方案,请也告诉我,以便我知道我没有被忽略。
我的建议是(再次)将 css
文件夹放在 static
文件夹下,删除 addResourcesHandlers 并使用绝对路径到达 css(例如 /css/style.css
)。
如果您将 css 放在静态文件夹中,则不需要 addResourceHandlers 方法。
.../static/css/app.css
或者如果你真的想把它们放在资产文件夹中:
.addResourceLocations("classpath:/assets/") <-- without the * at the end
.../assets/css/app/css
在这两种情况下,css 应该可以通过
th:href="@{/css/app.css}"
1.使用自定义资源路径
在您的网络配置中
@Override
public void addResourceHandlers(ResourceHandlerRegistry registry) {
if (!registry.hasMappingForPattern("/assets/**")) {
registry.addResourceHandler("/assets/**").addResourceLocations("classpath:/assets/");
}
}
将您的 style.css
文件放入此文件夹
src/main/resources/assets/css/
之后在你看来
<link rel="stylesheet" type="text/css" th:href="@{/assets/css/style.css}" />
.
2。在 spring boot
中使用预定义路径从您的网络配置中删除 addResourceHandlers
将 style.css
放入以下任意文件夹
src/main/resources/META-INF/resources/assets/css
src/main/resources/resources/assets/css/
src/main/resources/static/assets/css/
src/main/resources/public/assets/css/
并在视图中
<link rel="stylesheet" type="text/css" th:href="@{/assets/css/style.css}" />
.
注意:您可以在此处删除 assets
文件夹。如果要执行此操作,请将其从预定义的资源文件夹以及视图 th:href
中删除。但我保持原样,因为您在问题中明确提到了 assets/
路径。所以我相信您的要求是在您的资源 URL.
assets/
问题出在 Application.java
文件中的 @EnableWebMvc
注释。我一删除那个,css 就开始在 localhost:8080/css/style.css
可用,但没有应用。到目前为止,我还没有找到 @EnableWebMvc
导致问题的原因。
然后我删除了映射到 /**
的控制器,我已经实现了这个控制器以显示自定义错误页面。
@RequestMapping("/**")
public String notFound() {
return "errors/404";
}
也删除了这个之后,我的 css 开始工作了。 =)
将您的 css 文件夹放入 resources/static 文件夹
对我来说,我必须删除对样式表的静态引用才能使其在 thymeleaf 中工作。 所以
<link rel="stylesheet" type="text/css" media="all" href="../assets/css/style.css" th:href="@{/css/style.css}">
成为
<link rel="stylesheet" th:href="@{/css/bootstrap.css}">
我花了几个小时尝试各种配置和文件路径重命名。不知道为什么,但这是唯一让我的 css 和 js 在 Spring Boot 5.
中加载的东西在我的例子中,问题出在文件读取权限上。 我从另一个项目复制了文件'style.css',浏览器无法读取它。 重新创建 'style.css' 后,一切正常。
首先像这样使用 WebMvcConfigurer 在您的一个配置 class 上实现
@Configuration
public class WebMvcConfiguration implements WebMvcConfigurer {
//and overide this configuration method like this
@Override
public void configure(WebSecurity web) throws Exception {
web.ignoring().antMatchers("/webjars/**", "/resources/**");
}
}
所以现在您可以像这样覆盖 HttpSecurity 配置
@EnableWebSecurity
public class WebSecurityConfiguration extends WebSecurityConfigurerAdapter{
@Override
public void configure(HttpSecurity http) throws Exception {
http
.authorizeRequests()
.antMatchers("/", "/index").anonymous()
.antMatchers("/**/*.*").permitAll()
.anyRequest().authenticated();
}
}
this ("/**/*.*") regex text will allow files with anny extension
如果您使用的是像 bootstrap 这样的 webjars 库,请将此配置添加到您的 WebSecurityConfiguration
@Override
public void addResourceHandlers(ResourceHandlerRegistry registry) {
registry.addResourceHandler("/webjars/**").addResourceLocations("classpath:/META-INF/resources/webjars/");
}