CODEWITHSUNDEEP
javajsp
user3079393
user3079393

Reputation: 23

how to display image and text from mysql database on jsp page

I m doing one Java web application and i need to display image and text at same time from MySQL database.Please help me to display image and text on same "JSP" page from database.My image is stored as blob in MySQL.

Upvotes: 1

Views: 6777

Answers (2)

Hirak
Hirak

Reputation: 3649

That is not how HTML works.

The browser first requests the server to give it all the text content. Then the browser individually requests the server for image content, js content, css content etc. So you cannot "write" your image on the page using jsp, just how you write your texts, tables etc. An image needs to have a src "URL".

If you image content is coming from DB, then the URL needs to be a servlet. Which basically gets the image from DB, converts it into a stream and send back to the browser.

If you absolutely want that the text and the image to come from the same servlet, then maybe you can use request parameters...

here is a sample servlet and html. See if you can use similar style in your project

Servlet (This loads image from Disk. Change code to load from DB)

@WebServlet("/Servlet2")
public class Servlet2 extends HttpServlet {
    protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {

        String id = request.getParameter("id");
        if(id!=null && "1".equalsIgnoreCase(id)){
             response.setContentType("image/jpeg");
             response.getOutputStream().write( Files.readAllBytes(new File(getServletContext().getRealPath("****.jpg")).toPath()));
             response.getOutputStream().close();
        }else {
             response.getWriter().println("Sample text");
             response.getWriter().close();
        }
    }

    @Override
    protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException,
            IOException {

    }
}

HTML (Text is loaded via AJAX. You can use AJAX to load both text and image if you want)

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Insert title here</title>
<script>
function load()
{
var xmlhttp;
if (window.XMLHttpRequest)
  {// code for IE7+, Firefox, Chrome, Opera, Safari
  xmlhttp=new XMLHttpRequest();
  }
else
  {// code for IE6, IE5
  xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  }
xmlhttp.onreadystatechange=function()
  {
  if (xmlhttp.readyState==4 && xmlhttp.status==200)
    {
    document.getElementById("textDiv").innerHTML=xmlhttp.responseText;
    }
  }
xmlhttp.open("GET","Servlet2?id=2",true);
xmlhttp.send();
}
</script>

</head>
<body onload="load()">
<div id="textDiv"></div>
<br/>
<input type="image" src="http://localhost:8080/ImageCanvas/Servlet2?id=1"/>
</body>
</html>

Upvotes: 0

StanislavL
StanislavL

Reputation: 57381

You can define servlet which can send the image to user http://www.javatpoint.com/example-to-display-image-using-servlet

Then define image retrieving from blob http://codeglobe.blogspot.com/2009/03/readwrite-blob-fromto-mysql-in-java_21.html

In your jsp page just add link to the image

<img src="http://example.com/getImage?imageId=1234">

Thus when user clicks on the link your servlet will be called. The servlet reads the image from the BLOB and send it to the response.

UPDATE:

You can also try http://www.roseindia.net/tutorial/java/jsp/jspdisplayblob.html

Upvotes: 1

Related Questions