Spring-Boot Resourcelocations Not Adding the CSS File Resulting in 404

Spring-Boot ResourceLocations not adding the css file resulting in 404

If you move you the whole static directory into the resources and totally remove the addResourceHandlers configuration, then everything works fine.

That means that resources structure would look like the following image:

Sample Image

CSS not loading in Spring Boot

You need to put your css in /resources/static/css. This change fixed the problem for me. Here is my current directory structure.

src
main
java
controller
WebAppMain.java
resources
views
index.html
static
css
index.css
bootstrap.min.css

Here is my template resolver:

public class WebAppMain {

public static void main(String[] args) {
SpringApplication app = new SpringApplication(WebAppMain.class);
System.out.print("Starting app with System Args: [" );
for (String s : args) {
System.out.print(s + " ");
}
System.out.println("]");
app.run(args);
}

@Bean
public ViewResolver viewResolver() {
ClassLoaderTemplateResolver templateResolver = new ClassLoaderTemplateResolver();
templateResolver.setTemplateMode("XHTML");
templateResolver.setPrefix("views/");
templateResolver.setSuffix(".html");

SpringTemplateEngine engine = new SpringTemplateEngine();
engine.setTemplateResolver(templateResolver);

ThymeleafViewResolver viewResolver = new ThymeleafViewResolver();
viewResolver.setTemplateEngine(engine);
return viewResolver;
}
}

And just in case, here is my index.html:

<!DOCTYPE html SYSTEM "http://www.thymeleaf.org/dtd/xhtml1-strict-thymeleaf-spring3-3.dtd">
<html lang="en" xmlns="http://www.w3.org/1999/xhtml"
xmlns:th="http://www.thymeleaf.org">
<head>
<title>Subscribe</title>
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1" />

<!-- Bootstrap -->
<link type="text/css" href="css/bootstrap.min.css" rel="stylesheet" />
<link type="text/css" href="css/index.css" rel="stylesheet" />
</head>
<body>
<h1> Hello</h1>
<p> Hello World!</p>

<!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<!-- Include all compiled plugins (below), or include individual files as needed -->
<script src="js/bootstrap.min.js"></script>
</body>
</html>

Spring Boot project with static content generates 404 when running jar

It turns out that whilst Spring Boot is being clever at adding the various resource directories to the classpath, Maven is not and it's up to you to deal with that part. By default, only src/main/resources will be included in your JAR. If you create a folder called /static in the root of your project (as implied by the blog post) then it will work fine whilst using the spring-boot:run Maven goal but not once you create a JAR.

The easiest solution is to create your /static folder inside /src/main/resources and then Maven will include it in the JAR. Alternative you can add additional resource locations to your Maven project:

<resources>
<resource>
<directory>src/main/resources</directory>
</resource>
<resource>
<directory>static</directory>
<targetPath>static</targetPath>
</resource>
</resources>

I hope this is useful to someone, it's kind of obvious when you step back and look at how Maven works but it might stump a few people using Spring Boot as it's designed to be pretty much configuration free.

Spring Boot CSS stripped

If you check your browser console (e.g. in Chrome), my guess you will see HTTP 404 Not found for your CSS files. The problem is with your URL path to CSS.

The main point is that there is a difference how files (.html, .css) are stored in your JAR file (or in your source code) and how they are served by HTTP server. As far as I see you are using thymeleafs and therefore (my guess again), your HTML template files can be served for different kind of URLs (like /, /book/23 etc.) and therefore I don't recommend to address CSS files with relative URLs (as you did).

As CSS files are stored in static directory, they should be automatically served by spring boot for /** pattern, ie. if you don't use any context path, your CSS should have following URL: /css/main.css.

If you want to be very correct and be prepared that your web application can be in different "context", you should use something like <link rel="stylesheet" th:href="@{/css/main.css}">

Serving static content from Spring boot results in 404 whitelabel error page

Ok, I made a beginners mistake. As @chrylis mentioned in the comments, I removed the /// in front of file:. I did some test runs, and as it appeared, I had the following entry in my application.properties: myapplication.picture.basefolder=/myapplication/storage. It missed a trailing slash. So I updated it to myapplication.picture.basefolder=/myapplication/storage/, and my problem was fixed.



Related Topics



Leave a reply



Submit