Retrieving image from database using Ajax

Question

I'm trying to read image from database with Ajax, but I could not read the xmlhttp.responseText to the img src. The image is saved as binary data in database and also retrieved as binary data. I'm using Ajax in JSP, because I want to give the user the ability to upload images and I will view the last uploaded image, on mouse over action the Ajax will be activated and get the image back, the problem is in reading the img from the response.

This is the Ajax function:

function ajaxFunction(path) {
    if (xmlhttp) { 
        var s = path;
        xmlhttp.open("GET", s, true); 
        xmlhttp.onreadystatechange = handleServerResponse;
        xmlhttp.send(null);
    }
}

function handleServerResponse() {
    if (xmlhttp.readyState == 4) {
        var Image = document.getElementById(Image_Element_Name);
        document.getElementById(Image_Element_Name).src = "data:" + xmlhttp.responseText;
    }
}

I also got exception in the server:

10415315 [TP-Processor1] WARN core.MsgContext  - Error sending end packet
java.net.SocketException: Broken pipe
    at java.net.SocketOutputStream.socketWrite0(Native Method)
    at java.net.SocketOutputStream.socketWrite(SocketOutputStream.java:92)
    at java.net.SocketOutputStream.write(SocketOutputStream.java:136)
    at org.apache.jk.common.ChannelSocket.send(ChannelSocket.java:537)
    at org.apache.jk.common.JkInputStream.endMessage(JkInputStream.java:127)
    at org.apache.jk.core.MsgContext.action(MsgContext.java:302)
    at org.apache.coyote.Response.action(Response.java:183)
    at org.apache.coyote.Response.finish(Response.java:305)
    at org.apache.catalina.connector.OutputBuffer.close(OutputBuffer.java:281)
    at org.apache.catalina.connector.Response.finishResponse(Response.java:478)
    at org.apache.catalina.connector.CoyoteAdapter.service(CoyoteAdapter.java:154)
    at org.apache.jk.server.JkCoyoteHandler.invoke(JkCoyoteHandler.java:200)
    at org.apache.jk.common.HandlerRequest.invoke(HandlerRequest.java:283)
    at org.apache.jk.common.ChannelSocket.invoke(ChannelSocket.java:773)
    at org.apache.jk.common.ChannelSocket.processConnection(ChannelSocket.java:703)
    at org.apache.jk.common.ChannelSocket$SocketConnection.runIt(ChannelSocket.java:895)
    at org.apache.tomcat.util.threads.ThreadPool$ControlRunnable.run(ThreadPool.java:685)
    at java.lang.Thread.run(Thread.java:619)
10415316 [TP-Processor1] WARN common.ChannelSocket  - processCallbacks status 2

Answer 1

Why are you storing the images in the DB? Save them as files and save the URL in the DB.

That way you can use AJAX to call a PHP that will read the DB, pull out the URL for the image and return it to you, so you can do something like:

img = document.getElementById("myimage");
img.src = URL; // where URL will contain the URL you got from the AJAX call