spring-boot项目中CSS等静态文件放哪里？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/27170772/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Where to put static files such as CSS in a spring-boot project?
提问by Kleber Mota
In my current spring-boot project, my views have this line:
在我当前的 spring-boot 项目中，我的观点有这一行：
<link href="signin.css" rel="stylesheet"/>
to reference a static css file. When I run the project, and access one of the views which reference this file, I get a 404 not found error or a 403 unauthorized error, depending where I put the file inside the project.
引用静态 css 文件。当我运行项目并访问引用此文件的视图之一时，我收到 404 not found 错误或 403 未经授权的错误，具体取决于我将文件放在项目中的位置。
I try this so far:
到目前为止，我尝试这样做：
src/main/resources/static/css (with this, I use css/signin.css instead of signin.css)
src/main/resources/templates/static/css (with this, I use css/signin.css instead of signin.css)
src/src/main/resources/templates/acesso (same folder of the html file)
what the right place to store this type of files?
存储此类文件的正确位置是什么？
回答by Andy Wilkinson
Anywhere beneath src/main/resources/staticis an appropriate place for static content such as CSS, JavaScript, and images. The static directory is served from /. For example, src/main/resources/static/signin.csswill be served from /signin.csswhereas src/main/resources/static/css/signin.csswill be served from /css/signin.css.
下面src/main/resources/static的任何地方都适合放置静态内容，例如 CSS、JavaScript 和图像。静态目录由/. 例如，src/main/resources/static/signin.css将从 提供服务，/signin.css而src/main/resources/static/css/signin.css将从 提供服务/css/signin.css。
The src/main/resources/templatesfolder is intended for view templates that will be turned into HTML by a templating engine such as Thymeleaf, Freemarker, or Velocity, etc. You shouldn't place static content in this directory.
该src/main/resources/templates文件夹用于视图模板，这些模板将由 Thymeleaf、Freemarker 或 Velocity 等模板引擎转换为 HTML。您不应将静态内容放在此目录中。
Also make sure you haven't used @EnableWebMvcin your application as that will disable Spring Boot's auto-configuration of Spring MVC.
还要确保您没有@EnableWebMvc在您的应用程序中使用，因为这将禁用 Spring Boot 的 Spring MVC 自动配置。
回答by scorpion
You can use Thymeleaf http://www.thymeleaf.org/
您可以使用 Thymeleaf http://www.thymeleaf.org/
Example
例子
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.thymeleaf.org">
<head>
<link rel="stylesheet" th:href="@{/css/signin.css}"/>
</head>
<body>
</body>
</html>
Remember to add xmlns and xmlns:th in your html tag.
请记住在您的 html 标签中添加 xmlns 和 xmlns:th。
Check your application.properties:
检查您的 application.properties：
spring.resources.add-mappings=true
If that key is set to false, spring boot app will not load any resources.
如果该键设置为 false，spring boot 应用程序将不会加载任何资源。
回答by jpllosa
Apart from placing it anywhere beneath src/main/resources/staticand not using @EnableWebMvc, you'll need to authorize access to your jsor cssfolder especially if you have spring-boot-securityin you classpath. You'll add something like this:
除了将它放在下面的任何位置src/main/resources/static而不使用@EnableWebMvc，您还需要授权访问您的js或css文件夹，特别是如果您spring-boot-security在类路径中。您将添加如下内容：
@Configuration
@EnableWebSecurity
public class MainSecurityConfig extends WebSecurityConfigurerAdapter {
@Override
protected void configure(HttpSecurity http) throws Exception {
http
.authorizeRequests()
.antMatchers("/", "/home", "/js/**", "/css/**").permitAll()
.anyRequest().authenticated()
.and()
.formLogin()
.loginPage("/login")
.permitAll()
.and()
.logout()
.permitAll();
}
}
Then in your HTML:
然后在你的 HTML 中：
<link rel="stylesheet" href="/css/bootstrap.min.css">
<script src="/js/bootstrap.min.js"></script>
回答by user2069692
Disabling @EnableWebMvchelped me to resolve issue.
禁用@EnableWebMvc帮助我解决了问题。
回答by ldt
I use Spring-Boot 2.0.2
我使用 Spring-Boot 2.0.2
I still keep @EnableWebMvcannotation in my webConfig.javaand override addResourceHandlers()method to help browser reaches css and javascript files through http request.
我仍然@EnableWebMvc在我的webConfig.java和覆盖addResourceHandlers()方法中保留注释，以帮助浏览器通过 http 请求访问 css 和 javascript 文件。
This is the webapp directory's structure
这是 webapp 目录的结构
.
.
webConfig.java
网络配置文件
@Configuration
@EnableWebMvc
@ComponentScan(basePackages = "example.com")
public class WebConfig implements WebMvcConfigurer {
// =======================================
// = Bean Config =
// =======================================
@Bean
public InternalResourceViewResolver getInternalResourceViewResolver(){
InternalResourceViewResolver resolver = new InternalResourceViewResolver();
resolver.setPrefix("/WEB-INF/jsp/");
resolver.setSuffix(".jsp");
return resolver;
}
// =======================================
// = Override Methods =
// =======================================
@Override
public void addResourceHandlers(ResourceHandlerRegistry registry) {
registry.addResourceHandler("/pdfs/**")
.addResourceLocations("/WEB-INF/pdfs/");
registry.addResourceHandler("/css/**")
.addResourceLocations("/WEB-INF/css/");
registry.addResourceHandler("/js/**")
.addResourceLocations("/WEB-INF/js/");
}
}
index.jsp head tag:
index.jsp 头部标签：
<head>
<title>Title</title>
<!-- Custom styles for this template -->
<link href="css/cover.css" rel="stylesheet">
</head>
hope it helps you.
希望对你有帮助。
回答by rrudland
I found that if I put my signin.css under src/main/resources/META-INF/resources/static/css/signin.css, then I could access it using /css/signin.css
我发现如果我将我的 signin.css 放在 src/main/resources/META-INF/resources/static/css/signin.css 下，那么我可以使用 /css/signin.css 访问它
Not sure why though.
不知道为什么。
回答by Kike Lebowski
In my case to reference files inside css and js folders like this:
在我的例子中，引用 css 和 js 文件夹中的文件，如下所示：
<script src="js/bootstrap.min.js"></script>
<link href="css/bootstrap.min.css" rel="stylesheet">
<link href="css/carousel.css" rel="stylesheet">
I had to place the folders in webapp folder. I have the following folder structure:
我不得不将文件夹放在 webapp 文件夹中。我有以下文件夹结构：
Myapp
我的应用程序
-src
-main
-java
-resources
-static
-templates
-webapp
-resources
-WEB-INF
I mean if i had placed the css and js folders in resources folder (under main) it would have been:
我的意思是，如果我将 css 和 js 文件夹放在资源文件夹中（在主文件夹下），它将是：
<link href="../resources/css/carousel.css" rel="stylesheet">
<link href="../resources/css/bootstrap.min.css" rel="stylesheet">
<script src="../resources/js/bootstrap.min.js"></script>
If i place them in static folder (under resources) it doesn't work.
如果我将它们放在静态文件夹中（在资源下），它就不起作用。
回答by Максим Хитров
When i used:
当我使用：
src/main/resources/static/css.
my views have this line:
我的观点是这样的：
<link rel="stylesheet" href="/css/signin.css" />
