spring mvc background image not working when url changes - java

I am trying to give background. Image load properly when the url is (in login page)
/jobsspectrum/login
by using in profile page
<body background="resources/images/black.jpg">
But when the url changes the image does not load. eg.
/jobsspectrum/user/profile
because there is /user in the url before the page where i am using image in profile page.
the Error is
message /jobsspectrum/user/resources/images/black.jpg
description The requested resource is not available.
My image is under resources/images
It does not pick the resource when the url is not /jobsspectrum/
My resource handling class is :
#Override
public void addResourceHandlers(ResourceHandlerRegistry registry) {
registry.addResourceHandler("/resources/**").addResourceLocations("resources/");
super.addResourceHandlers(registry);
}
I simple words the image is picked only in the front pages and when the user logins my url changes from /jobsspectrum/ to /jobsspectrum/user/** and the resource image part is not loaded properly.

Use absolute paths instead of relative ones.
With the JSTL:
<body background="<c:url value='/resources/images/black.jpg' />">
Or, without the JSTL:
<body background="${pageContext.request.contextPath}/resources/images/black.jpg">

Related

jsp page dosent load css when using request dispatcher

enter image description hereso i was trying to load a jsp page when the submit button was clicked when i press the submit button data isent to the servlet.so the page loads but without the css.
RequestDispatcher requestDispatcher = request.getRequestDispatcher("/answerPage.jsp?id=" + id);
requestDispatcher.forward(request, response);
this didnt work so i tried this.
response.sendRedirect("answerpage.jsp");
it just gave me the 404 error
Without seeing the code to your answerPage.jsp, I would ensure that you have the css page linked in the html, something like:
<link rel="stylesheet" type="text/css" href="styles.css">
And just make sure that the css file is located in the WEB-INF folder in your project
so i found the answer to my problem.the problem was in the url mapping of my xml file

Static images not display with flying saucer and thymeleaf for generated pdf files

I am using thymeleaf as my template engin to map XHTML to HTML and flying saucer to generate a pdf file afterwards.
Now i failed to display my static images located at /src/main/resources/ inside y generated pdf file. The file itsself will be displayed fine only images disapear.
Even other locations like /src/main/resources/static or /src/main/resources/public didnt help.
My HTML / XHTML looks like:
<img src="images/logo_black.png"></img>
<img src="/images/logo_black.png"></img>
<img alt="mastercard" th:src="#{classpath:static/images/logo_black.png}" />
<div data-src="images/logo_black.png"></div>
<div data-src="/images/logo_black.png"></div>
<div data-src="#{classpath:static/images/logo_black.png}"></div>
none of them is working properly.
The Images itself are visible by localhost:8048/logo_black.png
I dont want to refer my images with a full url (http://...)
You can include resources from any URL (from the Internet or from your file system). Either way, there are several steps involved:
When generating the HTML from the Thymeleaf template, you can use
#{/some/url} to resolve a path relative to your Web context (assuming you have a Web context), or
#{classpath:/some/url} with will just leave the URL as classpath:/some/url, or
simply a string value constant or a value from a variable (${var}), doesn't matter if it's an absolute URL https://some/url or relative, Thymleaf will leave them unchanged in the resulting HTML.
Before you pass the HTML to Flying Saucer, make sure the URLs are correct. Then Flying Saucer will process all URLs with a UserAgentCallback, by default ITextUserAgent.
The relevant methods in UserAgentCallBack are resolveURI and setBaseURL.
There is some weird logic going on in the default resolveURI method of ITextUserAgent (inherited from NaiveUserAgent). If the baseURL is null, it will try to set it, so it's best to always set it yourself. I had better results with overriding the resolveURI, the following is enough to keep absolute URLs and resolve relative URLs relative to the baseURL:
#Override
public String resolveURI(String uri) {
if (URI(uri).isAbsolute())
return uri;
else
return Paths.get(getBaseURL(), uri).toUri().toString();
}
Finally, in order to resolve the classpath: protocol, you need to define an URLStreamHandler unless there is already one defined (for example, the embedded Tomcat of Spring Boot already does supports this).
You can render image with the help of base 64 .You just convert your image on base 64 and it will show on your web page as well as mobile view.The tags are:
<img th:src="#{data:image/png ;base64,your base 64}"/>

Handle situation when image cannot be rendered

I have spring mvc application
Sometimes on our site we can see that in html exists img tag but actually url is broken.
Now we want show default image for all these situations.
How can we handle it in single place and we should hit at this place only when we want to load image.
You can get it using jQuery. On the document.ready you can check the url of all images, and check if the images are valid. If not you can just change for your image.
Here is the jQuery code (you must add it on all your pages):
$(document).ready(function(){
var images = $('img').each(function(i, image){
checkSrc(image);
});
});
function checkSrc(image){
$.get($(image).attr('src'), function() {
//succes, we do nothing
}).fail(function() {
$(image).attr('src','https://upload.wikimedia.org/wikipedia/commons/thumb/0/0d/Cristiano_Ajax.jpg/220px-Cristiano_Ajax.jpg');
});
}
Here the html:
<img src="notexisting.jpg"/>
Working fiddle: http://jsfiddle.net/bx5kkoun/
WARINING
I don't recommend to do this because you have to request twice the images.
You can achieve it as well using Java Filter, but you must check as well the url of all images from server, but it's the same situation.
How about this:
<img src="image.gif" onerror="loadDefaultImage()">
This solution is cross-browser, but not IE8 and below.
You have many options for the loadDefaultImage function, you could use the jQuery method already suggested (just use the fail part), here is another suggestion, or just google "image tag onerror example" and select an option that works for you.
I think resolving it on the client side is the most efficient way to go. It will only attempt an extra request if there is a failure. If you attempt a solution on the server side, you would have to test for success/failure and then modify the markup sent to the browser. The browser will have to load even the successful images again as the page is rendering.
Here is a possible implementation:
function loadDefaultImage(element) {
$(element).attr(
'src',
'https://placehold.it/100x100'
);
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<div style="width:100px;margin-right:100px;display:inline-block;">
<img src="image.gif">
</div>
<div style="display:inline-block;">
<img src="image.gif" onerror="loadDefaultImage(this)">
</div>

Wicket Bookmarkable link

I have created a new link in the Welcome.java as the following
private Link<Void> drawLink;
drawLink = new BookmarkablePageLink<Void>("drawSome", drawSomething.class);
add(drawLink);
The following goes in the Webpage.html
<li>
Draw
</li>
There are two issues I want to fix.
I get the url as
localhost/project-name/wicket/bookmarkable/package-name.drawSomething?0
but I wanted the link to be as
localhost/project-name/drawSomething?0
As the drawSomething is a new page added to the project, like welcome page I am having a drawSomethign.properties file for page.icon and page.title.
page.title=D3 vis
page.icon=images/home_page.png
The drawSomething page loads the page title but throws an error for the image as could not resolve images folder.
But I have images folder in src/main/webapp/images/home_page.png
Can anyone please help me resolve both the issues.
Do this during you application initailization:
#Override
protected void initialize() {
mountPage("drawSomething", drawSomething.class);
}
Path to the images folder is relative to webroot path, try ../images/home_page.png

How to get url path from jsp in Spring MVC framework

To remove the language toggle from the page view(Comfirmation Page)
I found this code but it doesn't work in Spring MVC
<c:if test="${!fn:contains(pageContext.request.servletPath,'/comfirmation')}">
//Other Code
</c:if>
My actual url is (ShoppingCart.jsp).
It is used when /viewCart.htm,/updateCart.htm,/Confirmation.htm,etc.
So, the user go to the /Confirmation.htm, it also redirect to the ShoppingCart.jsp but the url path in the browser is /Confirmation.htm.
I want to remove the language toggle when call the /Confirmation.htm in the above mention.
Finally, I got it. Here we go
<%
String url=request.getAttribute("javax.servlet.forward.servlet_path").toString();
if(url.equals("/Confirmation.htm")){
%>
//Language Toggle code
<% } %>
I decided to use this. Another way is that storing url path in session since front controller.
the pageContext.request.servletPath will give you the path of the jsp (and not the url your browser shows).
The request is forwarded to a controller, which returns a path to a view. The view ist called using a second internal request

Categories