Image is not displayed on retrieval - java

I have a table with images stored in it as BLOB. I'm using JPA/Hibernate. Images are mapped to a bean field with type blob. Now my Spring controller is returning entire list of bean (each object of this bean has a blob object) to my jsp. I want to display all the images on that jsp.
I tried to use some thing like this on my jsp:
<c:forEach items="${itemList}" var="item" varStatus="status" >
<img src="<c:out value="${item.image}" />"/><br/> /*<img src="${item.image}"/> */
</c:forEach>
but that is not working. Instead of getting the list of images displayed on jsp , I 'm getting the class name, when I view the page source I saw something like this <img src="java.object.serilizableBlob#2134"/>
Please help me delve with the problem. How can I display all the images on same jsp.

The <img src> has to point to an URL, not to a toString() representation of some blob object. The webbrowser wouldn't understand how to download it and it will effectively end up in a HTTP 404 error.
You rather want to end up with for example this:
<img src="url/to/image.png" />
To serve images dynamically from a database, use a servlet. You should then instead of a list of blobs have a list of unique image IDs/filenames so that your HTML end up like this
<img src="imageservlet/image1.png" />
<img src="imageservlet/image2.png" />
<img src="imageservlet/image3.png" />
This way the browser can download the images by URL and display them accordingly.
No, printing binary data among all that HTML won't help. The data URI scheme comes close, but this isn't fully supported in all modern browsers.
See also:
How to retrieve and display images from a database in a JSP page? - this shows the "raw JDBC" example, but the idea is the same for JPA/Hibernate; just get a byte[] or an InputStream of the DB somehow and write it to the OutputStream of the response after having set the necessary response headers so that the browser understands how to deal with it.

Related

Parsing of a dynamic web page using HtmlUnit in java is not working

Image explaining the data to be extracted
I'm trying to extract data from a web page (marked red in the image) using HtmlUnit library of java. But I can't get that particular value.
WebClient webClient = new WebClient(BrowserVersion.CHROME);
Thread.sleep(5000);
HtmlPage page = webClient.getPage("https://earth.nullschool.net/#current/wind/isobaric/500hPa/orthographic=-283.71,14.19,2183/loc=76.850,11.440");
Thread.sleep(5000);
System.out.println(page.asXml());
I checked the html which I got on console window. It doesn't contain the value.
<p>
<span id="location-wind" class="location">
</span>
<span id="location-wind-units" class="location text-button">
</span>
</p>
It's because these are filled in via JavaScript. When you load the page, these fields are initially empty. You can check this by looking at the source code and searching for id="location.
The page makes two additional HTTP requests to fetch dynamic data:
https://earth.nullschool.net/data/earth-topo.json?v3
https://gaia.nullschool.net/data/gfs/current/current-wind-isobaric-500hPa-gfs-0.5.epak
Somewhere in this data (and combined they are around 1.2 MB) is the data that you're looking for. Your best bet is to use a tool (perhaps an online one) to convert the JSON to a Java object, or to study the JSON and write code to get the specific data that you're after.
That is, if that data is in the JSON, which I'm not convinced about. The EPAK file appears to be some sort of binary data with embedded JSON, but I couldn't figure out if the data is perhaps in there.
Another approach is to use Selenium, have it parse the page for you, and retrieve the data from there.

js to determine if iframe contains images

I am working on an application that allows users to enroll in my program. My problem is that at the end of enrollment I generate a PDF for them to look over and accept the terms and e-sign. Sometimes the PDF server fails to stream and when that happens the iFrame just contains the alt text for the images. Is there a way to look into the iFrame and see if the images of the PDF are there or the alt text is there. That way I can keep them from proceeding and display an error message.
One Jsp looks like this
<c:forEach items="${images}" var="src">
<img src="${src}" alt="Image" />
</c:forEach>
This Jsp calls a generate function which makes the pdf and turns them into images which then saves them to a remote server. The controller then returns the first jsp as the view which should populate the iFrame.
<div id="image">
<img id="loading" src="/blah/resources/images/loading.gif" />
<iframe style="width: 775px; height: 600px; display: none"
src="blah/blah/pdf/generateImages?product=<c:out value="${fn:toLowerCase(enrollmentConversation.product.textKey)}" />&state=<c:out value="${stateCodeAbbreviation}" />&pdfGuid=<c:out value="${pdfGUIDForLookup}" />&sizeType=775/p2"
id="pdfIframe"
onLoad="jQuery('#pdfIframe').show();
jQuery('#loading').hide();
jQuery('.hideWhileWaiting').show();">
</iframe>
</div>
So is there a way to look at the iFrame and say does this contain the images or does it contain alt text="Images"?
Your iFrame can be another application which is cross-domain (or same application on same domain).
When you create pdf and converts them in to images, I suggest you to write SUCCESS/FAILURE entry in database.
Then from your calling application, using AJAX database call, you can easily figure out whether pdf->image was generated successfully or not.

how to send parameters to jsp

So I'm using JFree chart and I'm trying to generate an image and display it in my jsp code. I would like to know how to accomplish this. I have tried multiple different ways but it doesn't work.
I saved the file and then when I try to access it. It is stored on the webserver and therefore I don't have the url to it?
Any help would be much appreciated.
I also tried to do something like this,
<IMG SRC="chart.jsp"
WIDTH="300" HEIGHT="300" BORDER="0" USEMAP="#chart">
which is basically jsp which generates an image. It works but how can pass parameters to it?
You shouldn't use a JSP, but a servlet to generate an image. JSPs are view components, whose role is to generate HTML markup from a model prepared by a controller.
But anyway, you pass parameters to a JSP the same way as you do for any other URL:
<img src="chart.jsp?param1=value1&param2=value2" .../>
Instead of thinking of the img source as static file think of the url being a stream that will be returned from a servlet using a prticular URL
eg
<img src="/jfreeServer?param1=123"/>

asynchronous widget JSP foreach (Java EE application)

I have the following code in a JSP page:
<c:forEach var="widget" items="${widgets}">
<p><h2>Widget</h2></p>
<p>IDType: ${widget.id}</p>
<p>Name: ${widget.name}</p>
</c:forEach>
At the moment it is only text that will be displayed, but in the future there will be charts and images as well.
I would like to use asynchronous loading, so the page doesn't have to wait on the largest images/charts.
On the internet I found tutorials for Java code, but not for JSP pages. What is the best way to implement asynchronous loading in JSP pages?
Thanks!
Simply generate these images and charts separately using different servlet:
<c:forEach var="widget" items="${widgets}">
<p><h2>Widget</h2></p>
<p>IDType: ${widget.id}</p>
<p>Name: ${widget.name}</p>
<img src="chart-servlet.png?id=${widget.id}"/>
<img src="image-servlet.png?id=${widget.id}"/>
</c:forEach>
On the server side map some servlets to chart-servlet.png and image-servlet.png. You can then use id parameter to generate appropriate chart or image. From the browser perspective it first renders DOM without images to then ask server for external resources (images).

Help getting image from Servlet to JSP page [duplicate]

This question already has answers here:
How to retrieve and display images from a database in a JSP page?
(6 answers)
Closed 7 years ago.
I currently have to generate an image that displays the text of a string, i need to make this image on a Servlet and then somehow pass the image to a JSP page so that it can display it. I'm trying to avoid saving the image, and instead somehow stream the image to the JSP.
I haven't found a way of generating the image since i started with finding how to pass an image from the Servlet to the JSP adn got stuck.
EDIT:
The jsp page is already made and isn't created by the servlet, i have to pass the image into an already existing jsp
Any help is appreciated.
You need to write the image as a byte array to the response's output stream. Something like this:
byte[] imageBytes = getImageAsBytes();
response.setContentType("image/jpeg");
response.setContentLength(imageBytes.length);
response.getOutputStream().write(imageBytes);
Then in you JSP you just use a standard img element:
<img src="url to your servlet">
You can't1 return both in the same response, since you're returning different types (an HTML page of type text/html and an image of type image/jpeg, say).
For this sort of thing, I will generate the image during the initial servlet request (for the containing HTML page). I store it in a cache in my servlet, and write the HTML page with the image tag containing a URL to that image with the handle.
e.g. the browser asks for http://whatever/page
The servlet generates the image, and writes an HTML tag in the page like
<img src="http://whatever/image/unique_handle_to_image">
The browser will render the HTML page, and as part of that issue a new request to my servlet with the handle for the image.
e.g. the browser now asks for http://whatever/image/unique_handle_to_image
I then return the image as content type image/jpeg or similar.
So you have two requests going on. One for the page, in which you render the image and store it temporarily, and the second in which you return the image. You have to remember to clear the image cache, but that's all straightforward. I wouldn't worry about storing lots of images, since the two requests from the browser usually (!) come in quick succession.
I guess it's possible to use a data uri provided your browser supports it, and create something like
<img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAKCAYAAACNMs+9AAAABGdBTUEAALGPC/xhBQAAAAlwSFlzAAALEwAACxMBAJqcGAAAAAd0SU1FB9YGARc5KB0XV+IAAAAddEVYdENvbW1lbnQAQ3JlYXRlZCB3aXRoIFRoZSBHSU1Q72QlbgAAAF1JREFUGNO9zL0NglAAxPEfdLTs4BZM4DIO4C7OwQg2JoQ9LE1exdlYvBBeZ7jqch9//q1uH4TLzw4d6+ErXMMcXuHWxId3KOETnnXXV6MJpcq2MLaI97CER3N0vr4MkhoXe0rZigAAAABJRU5ErkJggg==" alt="Red dot" />
Note there are a number of caveats surrounding these. See the linked page.
I would do something along this lines to achieve this:
On the JSP page you put a link to an image:
<img src="servlet/path?word=value">the rest</img>
This link points to your servlet, it generates image using request parameters, you do not need to save it, just put it right into response's output stream. You have to remember to disable browser caching for this servlet.
JSP page is displayed first, next all the images are requested, it should work just fine.
Of course, you should not put the text to display in a parameter like this, you should propably encipher it somehow or store it in a HTTP session.
Hope this helps.
If I understand your problem correctly, the sequence of events will be:
You generate an HTML page;
That HTML page is sent to the client; and
The client's browser reads the image URL and requests it as a separate request.
So, you can't generate the image and pass it to the JSP. You can however generate a URL to get the image and put that in the JSP. That's easy enough to pass by the servlet putting it on the HttpServletRequest object (request scope in JSP). For example, generate:
<a href="http://myhost.com/image_servlet?id=1234"/>
You don't really say what that text is or what information is required to generate the image. If you can't encapsulate that in a GET URL, you may need to add extra information and put it in the HttpSession so it can be retrieved on the next get image request.
...
response.setContentType("image/jpeg");
response.setContentLength(imageBytes.length); // imageBytes - image in bytes
response.getOutputStream().write(imageBytes);//
outStream.flush();
outStream.close();

Categories