Display image in img tag stored as BLOB in database

Question

I can't display BLOB image that I have in mysql saved. I have beans, jsp. I use 3multy-tier architecture, I want to display all the products with the picture.

In acceesor:

 try {
        Connection cn = getVla().getConnection();
        String sql = "SELECT * FROM products";
        PreparedStatement pst = cn.prepareStatement(sql);
        ResultSet rs = pst.executeQuery();
        ArrayList<products> ls = new ArrayList<products>();
        while(rs.next()) {
            products s = new products();
            s.setPk(rs.getLong("pk"));
            s.setName(rs.getString("name"));
            s.setPrice(rs.getDouble("price"));
            s.setPic(rs.getBlob("pic"));
            s.setComments(rs.getString("comments"));
            ls.add(s);
        }
        return ls;
    }

In products:

 public Blob getPic() {
        return pic;
    }

In main.jsp

<%=
List<products> product = bean.getproducts();

%>
<h1>Product: </h1>
<%  
for(products c : product) { 
%>
From <%= c.getName()%> <br/>
<%= c.getPic()%></b><br/>
<b><%= c.getPrice()%> </b><br/>
<%= c.getComments()%>
<hr/>
<%
}
%>

How I can display the picture? (Currently I am getting com.mysql.jdbc.Blob@2e5f6a64 in display)

Just to clarify, you want to display one picture per product? — mthmulders
– mthmulders, Commented Apr 5, 2013 at 13:32

mthmulders · Accepted Answer · 2013-04-05 12:07:51Z

4

What you're seeing is the result of Blob.toString(). Since it's binary content, the JVM cannot really figure a nice representation.

What you should do is create a seperate Servlet that only retrieves the Blob from the database and streams its content to response.getOutputStream(). In your JSP, you add an <img> tag whose src-attribute points to the Servlet you just wrote.

The Servlet should read the image for one product at a time, so the query would be slightly different: it should be enough to have

String sql = "SELECT pic FROM products where pk = " + pk;

Note that you need to specify this pk variable using some request parameter. The above line of code is just an example to demonstrate the idea. It is very unsafe to literally copy a request URL into an SQL query. Google for "SQL Injection" to read more about that.

Using Blob.getInputStream() you can obtain an InputStream whose contents you could copy to response.getOutputStream() in order to write it back to the browser. Don't forget to set the appropriate content-type on that response, for example "image/jpg" in case of JPEG pictures.

edited Apr 5, 2013 at 12:07

answered Apr 5, 2013 at 11:55

mthmulders

9,7154 gold badges40 silver badges57 bronze badges

Sign up to request clarification or add additional context in comments.

6 Comments

marios Over a year ago

can you be more specific what the new servlet must have inside?

Shailesh Saxena Over a year ago

@marios: Just have a look here: stackoverflow.com/questions/4848819/… and here also: stackoverflow.com/questions/6315671/… As I think its a better approach to store files in a directory and to keep directory path in DB.

mthmulders Over a year ago

Well, you could put the code in a JSP as well (like you're already fetching products from the database by calling the bean from your JSP), but I would advice against that approach because it violates the Model-View-Controller separation, IMHO.

marios Over a year ago

is not mvc model is multy-tier model.

mthmulders Over a year ago

That would not work, since you cannot include an image directly in your JSP. You will always need an <img> tag to achieve that.

|

ufasoli · Accepted Answer · 2021-01-31 12:13:48Z

0

As mthmulders said what you are seeing is the the value of Blob.toString().

BalusC posted sometime ago a 2 great articles on serving images recovered from a database blob through a servlet :

http://balusc.blogspot.fr/2007/04/imageservlet.html

And a more recent one with GZIP and resume handling

http://balusc.blogspot.fr/2009/02/fileservlet-supporting-resume-and.html

edited Jan 31, 2021 at 12:13

answered Apr 5, 2013 at 12:04

ufasoli

1,0783 gold badges21 silver badges45 bronze badges

3 Comments

mthmulders Over a year ago

Note that these examples read the images from a specified location on the filesystem, whereas the question is about images being stored in a relational database.

ufasoli Over a year ago

No actually the first link shows both, first from the filesystem then from a relational database

ufasoli Over a year ago

Marios regarding your comment "i am not working with servlet.i am working with classes" I agree with mthmulders you could put your code directly in the JSP but is not a good practice. By creating a separate servlet that handles the image you keep the view clean

Collectives™ on Stack Overflow

Display image in img tag stored as BLOB in database

2 Answers 2

6 Comments

3 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

6 Comments

3 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related