Where to place images/CSS in spring-mvc app?

Question

I used Netbeans to create a Spring MVC 3.0 app. I have a simple controller and JSP view. The JSP view appears correctly except for an image that doesn't render. My directory structure looks like this: alt text

In my Home.jsp page, the image that doesn't render is referenced like so:

<img src="Images/face.png" />

I've verified that face.png is in the Images directory. So why doesn't it appear in the browser? In Spring MVC, where should I place files referenced by JSP views, like images, CSS, JS, etc?

bluish · Accepted Answer · 2015-03-30 09:59:23Z

37

Alter your web.xml file:

<servlet>
    <servlet-name>spring-servlet</servlet-name>
    <servlet-class>com.springframework.web.servlet.DispatcherServlet</servlet-class>
</servlet>
<servlet-mapping>
    <servlet-name>spring-servlet</servlet-name>
    <url-pattern>/<url-pattern>
</servlet-mapping>

and add below configuration after it:

<servlet-mapping>
    <servlet-name>default</servlet-name>
    <url-pattern>*.css</url-pattern>
</servlet-mapping>
<servlet-mapping>
    <servlet-name>default</servlet-name>
    <url-pattern>*.js</url-pattern>
</servlet-mapping>
<servlet-mapping>
    <servlet-name>default</servlet-name>
    <url-pattern>*.gif</url-pattern>
</servlet-mapping>
<servlet-mapping>
    <servlet-name>default</servlet-name>
    <url-pattern>*.jpg</url-pattern>
</servlet-mapping>
<servlet-mapping>
    <servlet-name>default</servlet-name>
    <url-pattern>*.png</url-pattern>
</servlet-mapping>

If you have a better solution please share with me.

edited Mar 30, 2015 at 9:59

bluish

27.5k28 gold badges126 silver badges185 bronze badges

answered Apr 24, 2012 at 13:25

Gofier

4591 gold badge5 silver badges7 bronze badges

Sign up to request clarification or add additional context in comments.

4 Comments

Drahakar Over a year ago

@RaviKhakhkhar Can you accept this answer if it worked for you?

Ravi Khakhkhar Over a year ago

@Drahakar : I haven't asked this question. So naturally I don't have right to accept this answer. I have already up-voted.

Sumit Ramteke Over a year ago

this step does not work for me. I moved image folder outside WEB-INF as stated by Nada Lu

Jay Prakash Over a year ago

I have a problem with this... It's all working fine, But when we use bootstrap all the images used by bootstrap is not loading

Community · Accepted Answer · 2017-05-23 11:54:18Z

3

I was able to find a workable answer here: How to handle static content in Spring MVC?

The problem was that my spring mvc dispatcher servlet was intercepting the calls to static resources. So I mapped Tomcat's default servlet to handle the static resources.

edited May 23, 2017 at 11:54

CommunityBot

11 silver badge

answered Nov 13, 2010 at 2:42

Sajee

4,46714 gold badges49 silver badges55 bronze badges

Comments

Nuda Lu · Accepted Answer · 2011-11-08 17:51:12Z

3

anything under Web-Inf folder will be marked as private and can not be access by the browser. You suppose to move the image folder outside Web-Inf and under webapp.

answered Nov 8, 2011 at 17:51

Nuda Lu

1292 silver badges12 bronze badges

Comments

Krishna Roy · Accepted Answer · 2013-08-27 09:08:46Z

1

For set image in jsp file in Spring MVC framework :

You can simply set your image by following steps:

Step 1. Place images folder in resources

Step 2. write image path like : src="${pageContext.request.contextPath}/resources/images/logo.jpg"

answered Aug 27, 2013 at 9:08

Krishna Roy

2031 gold badge4 silver badges20 bronze badges

Comments

Ian Dallas · Accepted Answer · 2010-11-12 22:03:14Z

0

I believe it can only reference images/css in the WEB-INF folder. Moving your Images folder to WEB-INF should fix your problem.

answered Nov 12, 2010 at 22:03

Ian Dallas

12.8k19 gold badges61 silver badges84 bronze badges

3 Comments

Sajee Over a year ago

That didn't work. Even trying to directly access the image (localhost:8080/myapp/Images/face.png) didn't work. Do I need to configure spring mvc to enable access to images?

Ian Dallas Over a year ago

See this question: stackoverflow.com/questions/553749/…. Might help.

Sajee Over a year ago

No, that confused me even more. :) What I'm trying to do should be easy w/o resorting to themes. Perhaps I have URL pattern that's blocking access to anything but controllers?

Tanuj Verma · Accepted Answer · 2014-10-08 05:39:56Z

0

I think you can put all the static data such as image, css, javascripts etc out side the WEB-INF and then call it the normal way :)

answered Oct 8, 2014 at 5:39

Tanuj Verma

3982 silver badges7 bronze badges

Comments

Community · Accepted Answer · 2017-05-23 12:09:42Z

0

A bit old, but let me add my bit here. It is generally preferred to hide the .css/ .js files from direct public access by placing them into the main/java/webapp folder instead of the WEB-INF.

The reasons are explained very well in the posts below:

edited May 23, 2017 at 12:09

CommunityBot

11 silver badge

answered Mar 10, 2015 at 12:35

smos

1481 silver badge6 bronze badges

Collectives™ on Stack Overflow

Where to place images/CSS in spring-mvc app?

7 Answers 7

4 Comments

Comments

Comments

Comments

3 Comments

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

7 Answers 7

4 Comments

Comments

Comments

Comments

3 Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related