How add Static Web Content in Spring-boot

Question

I am trying to add static web content in a spring-boot server using the info here

I have tried adding the .js and .css files I need in the several Folders that the previous link says but it doesn't work:

/META-INF/resources/
/resources/

Note: I didn't created the /static/ and /public/ folders because I don't know the absolute Path in my project.

I have added too the addResourceHandlers method:

@Override
public void addResourceHandlers(ResourceHandlerRegistry registry) {
if (!registry.hasMappingForPattern("/webjars/**")) {
    registry.addResourceHandler("/webjars/**").addResourceLocations(
            "classpath:/META-INF/resources/webjars/");
}
if (!registry.hasMappingForPattern("/**")) {
    registry.addResourceHandler("/**").addResourceLocations(
            RESOURCE_LOCATIONS);
}
}

And the reference in the HTML file are like this:

<script src="bootstrap-switch.js"></script> Any idea how I can fix that?

UPDATED:

enter image description here

UPDATED 2: trying the @jfcorugedo

Doesnt work. Take a look, is that what was you saying?

enter image description here

UPDATED 3:trying the @jfcorugedo, second advice:

enter image description here

Try access the file using /application-context/js/bootstrap-switch.js — Danilo Gomes, Mar 12 '15 at 19:49
For your second update, you should not insert META-INF in src. Its enough or — Danilo Gomes, Mar 13 '15 at 13:02
please find answer @ [https://stackoverflow.com/questions/38788459/spring-boot-static-content-with-context-path/54112835#54112835](https://stackoverflow.com/questions/38788459/spring-boot-static-content-with-context-path/54112835#54112835) — Bhukailas, Jan 09 '19 at 14:58

Danilo Gomes · Accepted Answer · 2017-07-07T02:35:28.620

21

I think you should access static contents using mydomain/<context>/<resource type>/resource

For instance:

http://mydomain/app/js/test.js
http://mydomain/app/img/test.jpg

You can write your resources using application context or simply using relative path:

<script src="js/bootstrap-switch.js"></script>

or

<script src="/<myapp>/js/bootstrap-switch.js"></script>

But if you are using bootstrap with a webjar you should write

<script src="/<myapp>/webjars/bootstrap/<version>/js/bootstrap-switch.js"></script>

There is a project on github to illustrate this https://github.com/spring-projects/spring-boot/tree/master/spring-boot-samples/spring-boot-sample-web-static

UPDATE 1

I created a test project with the follow structure:

enter image description here

I could access style.css on http://localhost:8080/css/style.css

You can use http://start.spring.io/ to help you create new projects

Another option is use Spring Tool Suite or IntelliJ IDEA. They can help you to create new project with right configurations (as the previous link).

edited Jul 07 '17 at 02:35

answered Mar 12 '15 at 19:52

Danilo Gomes

571
6
13

ok and have I to copy the files in which folder's project? I have copied them in `/project_name/src/main/resources/META-INF/js` and `/project_name/src/main/resources/META-INF/css` but that doesnt work. – Alberto Crespo Mar 12 '15 at 20:27
I have updated with a screenshot. Please could you confirm that the two issues are correct? Should I change something of my `addResourceHandlers`? It doesn't work. – Alberto Crespo Mar 12 '15 at 20:48
Try use js/bootstrap-switch.js and css/bootstrap-switch.css in your references – Danilo Gomes Mar 12 '15 at 20:52
Try put your files in src/main/resources/static. I've created a new project here, and that's seems the most intuitive way – Danilo Gomes Mar 12 '15 at 22:16
I updated with a screenshot of my test project and some enw advices – Danilo Gomes Mar 13 '15 at 13:53
This update is perfect! works like a charm! Thank you Danilo! – Alberto Crespo Mar 13 '15 at 14:00

jfcorugedo · Answer 2 · 2015-03-14T09:45:45.937

19

You don't need to add the method addResourceHandlers, Spring boot executes this method in its own code.

Don't put the files inside webapp folder.

You only need to put your files in one of these directories:

/META-INF/resources/ /resources/ /static /public

For instance, if you want to load the file js/bootstrap-switch.js, this file must be in one of those folders:

/META-INF/resources/js/bootstrap-switch.js /resources/js/bootstrap-switch.js ...

I've created a folder META-INF/resources/js inside my /src/main/resources and everything works:

folder hierarchy in my test project

I've put a test.js file inside this folder and, when I've type the URL http://localhost:8080/js/test.js the application has given me the JS file.

Are you sure you're creating this same folder hierarchy?

edited Mar 14 '15 at 09:45

answered Mar 12 '15 at 23:38

jfcorugedo

9,793
8
39
47

so the absolute path on the server for that is: /project/src/main/META-INF/ ? or just /project/META-INF ? – Alberto Crespo Mar 13 '15 at 12:49
3

You have to use this one: src/main/resources/META-INF/ Don't put resources inside src/main, because maven, by default, only recognises files inside src/main/java and src/main/resources – jfcorugedo Mar 13 '15 at 13:01
I tried too without success. The server gives me an 404 as always... My knowledge about Spring-boot is very poor but , maybe this information help us: I have built the project with Gradle, I use TomCat 7 and I run that as a JavaApplication. – Alberto Crespo Mar 13 '15 at 13:38
Just a note that "static" did not work for me.......but "resources" did......I"m talking about the 2nd "resources"..aka, the more deeply nested one. – granadaCoder Aug 22 '18 at 22:05

score 9 · Answer 3 · answered Feb 17 '18 at 13:07

Looking at org.springframework.boot.autoconfigure.web.ResourceProperties class, you can see this line of code:

private static final String[] CLASSPATH_RESOURCE_LOCATIONS = new String[]{"classpath:/META-INF/resources/", "classpath:/resources/", "classpath:/static/", "classpath:/public/"};

Meaning /META-INF/resources/, /resources/, static/ and public/ directories are available to serve static contents.

So you can create a static/ or public/ directory under resources/ directory and put your static contents there. And they will be accessible by: http://localhost:8080/your-file.ext. (assuming the server.port is 8080)

You can customize these directories using spring.resources.static-locations in the application.properties.

For example by providing this configuration:

spring.resources.static-locations=classpath:/custom/

You can use custom/ folder under resources/ for serving static files and access them through the URL above.

score 1 · Answer 4 · answered Oct 19 '17 at 13:34

Create a folder anywhere with a /static folder on the root. This can be anywhere on your work space. Example C:\mywebapp\static. Add C:\mywebapp to the runtime classpath, or if using Intellij/Eclipse, add the folder C:\mywebapp as a library.

This is different than adding your static html as a source folder, which will cause it be be copied to the output class folder with every build. If you have a large web app or single page app using angular or sencha, this is a pain. Instead add the folder C:\mywebapp as a library folder or run time classpath folder.

The benefit of this is it will allow your javascript code to run on the same host/port as your spring boot rest,ajax, etc services without having to deal with jsonp or cors.

How do you add C:\mywebapp to the classpath at runtime ? – Luke Kroon Oct 22 '19 at 14:29 — Luke Kroon, Oct 22 '19 at 14:29

How add Static Web Content in Spring-boot

4 Answers4

Linked