Unable to load the images in the jsp page - java

I have created a simple jsp page in the spring mvc project. But i am unable to load the images from the image folder. I tried with Real path and Context path still I am unable to load the images in to the jsp file.
Real path:
<%
String realPath = application.getRealPath("/");
%>
<img src="<%=realPath%>images\logo.png" alt="student" title="student">
Context Path:
<%
String contextPath = request.getContextPath();
%>
<img src="<%=realPath%>images\logo.png" alt="student" title="student">
My project folder struture looks like
Did I miss something? Do I need to make any configurations in the web.xml?
Any suggestions?

You must configure your static resources like images, js and css files like that:
<mvc:resources mapping="/images/**" location="/images/"/>
In the above example, any requests from this url pattern /images/**, Spring will look for the resources from the /images folder.

You cannot use real path, because the browser will not be on the same machine as the webapp!!
You cannot use \, because URLs must use /.
Don't use Java code in JSP, especially when EL variables are there to be used.
You are missing a /. Quoting javadoc of getContextPath():
The path starts with a "/" character but does not end with a "/" character.
This is how to do it:
<img src="${pageContext.request.contextPath}/images/logo.png" alt="student" title="student">

Related

Spring boot not loading images from src/main/resources path into jsp

I have a image file inside
enter image description here
Here is my configuration inside Configuration class.
private static final String[] CLASSPATH_RESOURCE_LOCATIONS = {
"classpath:/META-INF/resources/", "classpath:/resources/**",
"classpath:/static/**", "classpath:/public/" };
public void addResourceHandlers(ResourceHandlerRegistry registry) {
registry.addResourceHandler("/**").addResourceLocations(CLASSPATH_RESOURCE_LOCATIONS);
Inside Jsp I am not able to load the image under div tag
<div id="image">
<p>
<img src="/images/reviewCount.jpg" width="600" height="400" border="0" usemap="#chart">
</p>
I tried
1) To give absolute path like src/main/resources/static/images/reviewCount.jpg
2) src="{/images}/reviewCount.jpg"
Both the approaches went in a wine.
Any one who can some shed light would be appreciated.
TIA.
regards
Vinod
Spring Boot automatically maps static folder in the resources to serve static content. Just put images like this:
You have to place all the images, css, js files inside your webapp folder.. ie webapp/resources.
If you are packaging the application as a jar then dont use the src/main/webapp
this will only work with war packaging and it will be ignored by most build tools if you generate a jar.
In Spring boot by default, resources are mapped on /** but you can tune that via spring.mvc.static-path-pattern. For instance, relocating all resources to /resources/** can be achieved as follows:
spring.mvc.static-path-pattern=/resources/**
Read more from here
It is a typo. You have reviewCount.png in static/images folder and you are referring reviewCount.jpg from div tag.

jsp:include causes Servtlet exception app engine

After a lot of debugging I found that every time I include jsp files like:
<jsp:include page="header.jsp">
when I try do do a HTTP request like: /whatever/request I get the following exception:
javax.servlet.ServletException: File "/whatever/header.jsp" not found
The same exception will happen if I try any path instead of /test above for instance /test/test/request or anything.
When I removed all the directives everything is fine. How do I workaround this.
It looks for jsp relative to context path, in your example it looks for jsp stored in /whatever/header.jsp and it is not there, you should access jsp files by writing their full project's path, otherwise it will look for those jsp in the exact folder you are referring to in your url, if it shows error in folder /list/London, and you include jsp like
<jsp:include page="some.jsp"/>
Then it will look for that file in /list/London/, but if you write
<jsp:include page="/some.jsp"/>
It will look for it in your project's root, meaning under /

Spring boot WAR deployed to Tomcat and missing context for static resources

I'm having a problem when deploying a Spring Boot application as a WAR file to a standalone Tomcat 7 server. It builds and deploys fine but when the index.html page tries to load other static resources they are missing the context in the url so fail to load (404).
e.g. http://localhost:8080/app/images/springboot.png
should be: http://localhost:8080/spring-boot-war-context-issue/app/images/springboot.png
Image showing issue
It works fine when using the embedded Tomcat
Similar issues:
Seems to be a similar issue to:
Spring-Boot war external Tomcat context path
However the suggestions in that question did not seem to solve my issue. I wasn't sure about the Tomcat xml file.
Steps followed:
I created a simple sample application and followed the steps in the Spring Boot docs.
The sample code can be seen in this github repo along with steps to reproduce the problem: https://github.com/jgraham0325/spring-boot-war-context-issue
Things I've tried so far:
Set contextPath in application.properties but this only applies to embedded tomcat
Tried using a fresh install of Tomcat 7
Tried creating a config file in tomcat to force context:
apache-tomcat-7.0.72\conf\Catalina\localhost\spring-boot-war-context-issue.xml
Contents of spring-boot-war-context-issue.xml:
<Context
docBase="spring-boot-war-context-issue"
path="spring-boot-war-context-issue"
reloadable="true"
/>
Any advice would be much appreciated!
Thanks
Update 23/10/2016:
Alex's answer below about using relative URLs without the slash at the start was perfect solution!
Isn't it simply caused by the way you defined your url in index.html (the url does not include the context root):
<img src="/app/images/springboot.png" />
Use relative uri
You should be able to use a relative uri (without the leading forward slash):
<img src="app/images/springboot.png" />
get the context root
How do you get the contextPath from JavaScript, the right way?
How to set ContextPath for an image link
Browser can't access/find relative resources like CSS, images and links when calling a Servlet which forwards to a JSP
How to use relative paths without including the context root name?
With JSP/JSTL:
<img src="${pageContext.request.contextPath}/app/images/springboot.png" />
Or with Javascript:
function getContextPath() {
return window.location.pathname.substring(0, window.location.pathname.indexOf("/",2));
}
...
var img = new Image();
img.src = getContextPath() + "/app/images/springboot.png";
document.getElementById('div').appendChild(img);
If using Thymeleaf, another way is using Context-Relative URLs like below:
<link rel="icon" type="image" th:href="#{/img/favicon.ico}"/>
For more information please refer to: Thymeleaf Documentation

How to use <c:url> in <c:import> on Java?

I'm trying to import a JSP using c:import and c:url, but it tells me it couldn't find the file. I tryed using a link to see if it opens the file, and it works fine. So, I suppose the path is correct, but it isnt't working.
My code is like this:
<c:url value="/cabecalho.jsp" var="cabecalho" />
<c:import value="${cabecalho}"></c:import> //page don't open
link //to test the path
If I use <c:url value="cabecalho.jsp" /> it works fine!
What must be happening?
c:url gives You absolute path from internet like http://www.somehost.com . c:import wants relative path to jsp on server.

Linking Files And Directory Structuring

I'm working on a web project using java/ jsp/ servlets/ html/ css in eclipse tomcat, where everything is in the WebContent folder.
In my jsp files... When I try to include other jsp files (using a link like "/fileName.jsp" in jsp include directive) I can do that successfully.
But When I try to include image files (using a link like "/fileName.jpg" in the <img src=""> tag) nothing happens.
Nothing happens because instead of looking in the WebContent folder for image file it looks in the tomcat home directory, i.e.
Instead of looking at "http ://localhost:port/projectName/..." it looks at "http: //localhost:port/..."
Why does it look at the wrong location only with <img src=""> tags but not in <%# /> tag.
A workaround for this is that I start giving absolute paths "/projectName/..." However doing this means I'm hardcoding project name everywhere. This is what I do not want.
Don't include binary content in an ascii output. Why not just use the img tag? If you need to do something to produce a jpeg, I would use a Servlet.
Because the jsp-Links in the website are getting processed and the image links not. Either change the image path or develop an filter that changes the images'links.
Yes Templar, that could have been a way to solve my problem.
However, I simply changed the Context Root of my project from "Project Name" to "/" in Eclipse. This solved my problem.

Categories

Resources