通过Servlet在JSP页面上显示图像

Question

I am trying to display images in a Jsp page using Jstl, and image paths are passed on by a servlet. The Jsp page actually displays only one of the retrieved images and throws a NullPointerException.

The Jsp looks like this:

<c:forEach items="${images}" var="img">
    <div class="col-md-3">
        <img src="displayImg?imageId=${img.imageId}">
    </div>
</c:forEach>

And servlet doGet method looks like this:

protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
    int imageId = Integer.parseInt(request.getParameter("imageId"));
    Image img = imageDao.getImageById(imageId);
    response.setContentType("image/" + img.getImageType());

    File f = new File(img.getImagePath());
    BufferedImage bi = ImageIO.read(f);
    OutputStream out = response.getOutputStream();
    ImageIO.write(bi, img.getImageType(), out);
    out.close();
}

I can't understand why this servlet manages to serve one image and fails on others with a NullPointerException when the request parameter is correct. I have an impression like it is a concurrency issue because the Jsp displays arbitrary image.

Any help please?

Here is the DAO:

public Image getImageById(int imageId) {
        String query = "SELECT * FROM images WHERE imageId=?";
        Image img = null;
        PreparedStatement ps = null;
        ResultSet rs = null;
        try {
            connection = ConnectionManager.getConnection();
            ps = connection.prepareStatement(query);
            ps.setInt(1, imageId);
            rs = ps.executeQuery();
            if (rs.next()) {
                img = new Image();
                img.setImageId(rs.getInt("imageId")); //NPE thrown here
                img.setImagePath(rs.getString("imagePath"));
                img.setImageType(rs.getString("imageType"));
                ...
                img.setDescription(rs.getString("description"));
                img.setCreatedOn(rs.getTimestamp("createdOn"));
            }
        } catch (SQLException e) {
            e.printStackTrace();
        } finally {
            close(rs);
            close(ps);
            close(connection); //Removed this and problem disappears
        }
        return img;
    }

Solved!! It is weird but I just avoided closing the connection to the database and all my images are displaying correctly with no errors. I guess closing the connection after every single DB access is problematic as it could not close at the exact time you want it to but maybe in the middle of another call to the DB. Now I wonder, not closing the connection at all is problematic too. What to do in that case?

Answer 1

Just read the stack trace:

at com.mysql.jdbc.ResultSetImpl.buildIndexMapping(ResultSetImpl.java:674)
at com.mysql.jdbc.ResultSetImpl.findColumn(ResultSetImpl.java:1029) 
at com.mysql.jdbc.ResultSetImpl.getInt(ResultSetImpl.java:2566) 
at be.kayiranga.daoImpl.ImageDaoImpl.getImageById(ImageDaoImpl.java:114)

So, the exception is thrown by

rs.getInt("imageId")

which means that there is no column named "imageId" in the result set.

You should never use select * . Use explicit column names, and use these explicit column names when getting data from the result set:

select imageId, imagePath, imageType, description, createdOn from ...

Answer 2

Weird as imageId is used as column name in the query, and there is a record, rs.next() . Maybe it is not an int but long, or SQL VARCHAR. Maybe MySQL was so overly clever to leave out imageId as this was specified in the WHERE? Or somehow in this case you need to use rs.getInt("images.imageId") .

            img.setImageId(rs.getInt("imageId")); //NPE thrown here

could however be written (circumvented) as

            img.setImageId(mageId);

I would check that there is no devious typo: í (accent), Cyrillic e (if you are East European) or tab char. Honestly said your code looks neat, but similar errors happen with much less neat code: ps, ps2, rs, rs2 as fields, playing havoc with concurrent uses and apt to typos.

BTW writing could be done faster with less memory resources:

Path path = Paths.get(img.getImagePath());
OutputStream out = response.getOutputStream();
Files.copy(path, out);

---

On the search for errors:

Investigating the error seems the only option:

ResultSetMetaData meta = rs.getMetaData();
int numberOfColumns = meta.getColumnCount();
for (int i = 1; i <= numberOfColumns; ++i) {
    log(... i, meta.getColumnName(i), meta.getColumnLabel(i) ...);
}

Answer 3

THis answer might not help you completely, as no one I believe understands what you are doing exactly. I am presuming you have a JSP page and a form inside, I can show you how to display the image as a string.

public showImage(){
  BASE64Encoder base64Encoder = new BASE64Encoder();
 // your method to retreive the image
 if(image == null){
   File imagePath = new File("/home/akshay/images.jpeg"); // display alternate image
      try {
          BufferedImage bufferedImage = ImageIO.read(imagePath);
          ByteArrayOutputStream byteArrayOutputStream = new ByteArrayOutputStream();
         ImageIO.write(bufferedImage, "png", byteArrayOutputStream);
   //Below person is the main object model, and String is the image in string
        person.setProfilePhotoString("data:image/png;base64," +   base64Encoder.encode(byteArrayOutputStream.toByteArray()));
                } catch (IOException e) {
                    e.printStackTrace();
                }
  } else{
         person1.setProfilePhotoString("data:image/png;base64," +  base64Encoder.encode(person1.getProfilephoto()));
}
}

JSP page :

<form:form action="${showAction}" commandName="person">
    <table>
 <tr>
            <td><img src= "${person.profilePhotoString}"  height=100 width=100/>
        </tr>
</table>
</form>