14

I am having trouble linking to a style sheet from a jsp page. I believe it has something to do with my directory structure which is:

WEB-INF
  |-- css
  |    |-- main.css
  |
  |-- jsp
       |-- login.jsp

I have tried various forms of the standard html link tag such as:

<link href="css/main.css" rel="stylesheet" type="text/css" media="screen" />
<link href="main.css" rel="stylesheet" type="text/css" media="screen" />
<link href="WEB-INF/css/main.css" rel="stylesheet" type="text/css" media="screen" />

I have also tried including the css file in the jsp folder and linking to it directly. Nothing works. When I view the source after deployment, and try to access the CSS file directly, it's not there, but this is no surprise to me since it is in the WEB-INF directory.

I have also verified that it is getting deployed with the rest of the application. The jsp source is:

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Login</title>

<link href="css/main.css" rel="stylesheet" type="text/css" media="screen" />

</head>

<body>
<div id="wrapper">
<div id="header">
<div id="logout">&nbsp;</div>
<h1>Login</h1>
</div>
<div id="content" class="content">
  <form action="" method="post" name="login-form">
    <fieldset>
      <legend>Login</legend>
      <table border="0" align="center">
        <tr>
          <td><label>User Name:</label></td>
        <td><input type="text" name="userName" /><br><br></td>
        </tr>
        <tr>
            <td><label>Password:</label></td>
        <td><input type="text" name="password" /><br><br></td>
         </tr>
        </table>
      </fieldset>
      <div class="buttons">
        <input type="submit" name="submit" value="Login" />&nbsp;&nbsp;&nbsp;
        <input type="button" name="cancel" value="Cancel" />
      </div>
    </form>
  </div>
</div>
</body>
</html>

Thanks!

Casey
  • 12,070
  • 18
  • 71
  • 107

3 Answers3

19

Files in /WEB-INF are not directly public accessible. Only an intermediating (controller) Servlet can access and stream them for you with help of ServletContext#getResourceAsStream(). That's exactly what Spring (as any other decent MVC framework) does with JSP files. You can't access JSP files directly by URL. That would potentially leak source code or break the application behaviour.

So you have basically 2 options here:

  1. Put CSS files in public webcontent (just move one folder above WEB-INF, so that /css is at same level as /WEB-INF).

  2. Create a Servlet which listens on an url-pattern of /css/*, gets the requested CSS file by HttpServletRequest#getPathInfo() and basically gets an InputStream from it using the aforementioned ServletContext#getResourceAsStream() and writes it to the OutputStream of the response along a correct set of response headers with at least Content-Type and Content-Length.

After all I think option 1 is easier and more suitable for your requirement ;)

BalusC
  • 1,082,665
  • 372
  • 3,610
  • 3,555
  • 1
    I figured that had something to do with it. I believe I will go with option 1 for now. Thanks! – Casey Feb 09 '10 at 20:03
  • Thanks, I was using twitter bootstrap, and having problem access the assets because I put them under WEB-INF (which is not public, as you mentioned), move it 1 level up to webcontent and access using bootstrap/js/bootstrap.js in my jsp works pretty well. – Baiyan Huang Aug 12 '12 at 00:11
7

Spring-style implementation of 2nd approach from @BalusC is to using mvc:resources, like that:

<mvc:resources mapping="/css/**" location="/WEB-INF/css/*" />

and after this your main.css file should be available at /css/main.css

(NOTE: if it does not work, check that DispatcherServlet is mapped to /)

Slava Semushin
  • 14,904
  • 7
  • 53
  • 69
  • It does not work as-is for me. I have a mapping /app for my DispatcherServlet (otherwise Tiles is not working with /). In that case a reference to my javascript file will be: – рüффп Dec 08 '11 at 17:14
  • 1
    @ruffp Yes, AFAIR, `` requires `` to work and thus `DispatcherServlet` should be mapped to `/` – Slava Semushin Dec 09 '11 at 02:28
-2

or try this

<%@ taglib prefix="spring" uri="http://www.springframework.org/tags" %>

" type="text/css"/>

it may work.

joseph
  • 1
  • 2
    Casey was asking about using a element to include a stylesheet, so it's not really related to jsp taglibs. – Rob Heiser Jul 14 '11 at 19:15