Menu
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"> </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" />
<input type="button" name="cancel" value="Cancel" />
</div>
</form>
</div>
</div>
</body>
</html>
Thanks!
902
place the index file in the same folder with the jsp and edit to <script type="text/javascript" src="index. js"></script> just to make sure that the path is not the problem.
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:
Put CSS files in public webcontent (just move one folder above WEB-INF, so that /css is at same level as /WEB-INF).
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 ;)
65
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 /)
31
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
