Извлечение изображения из базы данных с помощью Ajax

Question

Я пытаюсь прочитать изображение из базы данных с помощью Ajax, но я не могу прочитать xmlhttp.responseText в img src. Изображение сохраняется как двоичные данные в базе данных, а также извлекается как двоичные данные. Я использую Ajax в JSP, потому что я хочу дать пользователю возможность загружать изображения, и я буду просматривать последнее загруженное изображение, при наведении мыши на действие Ajax будет активирован и получит изображение обратно, проблема в чтении img из ответа.

Это функция Ajax:

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;
    }
}

Я также получил исключение на сервере:

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

Почему вы храните изображения в БД? Сохраните их как файлы и сохраните URL в БД.

Таким образом, вы можете использовать AJAX для вызова PHP, который будет читать БД, извлекать URL для изображения и возвращать его вам, чтобы вы могли сделать что-то вроде:

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

Answer 2

Это не так, как это работает. Как уже было сказано ранее, вам просто нужно изменить атрибут src элемента <img> на другой URL. Затем веб-браузер автоматически перезагрузит само изображение.

В случае JSP / Servlet, URL должен просто указывать на класс Servlet, который получает InputStream изображения из базы данных и записывает его в OutputStream ответа обычным способом Java IO. с набором заголовков ответа.

Вот как должен выглядеть ваш Javascript:

function changeImage(newSrc) {
    document.getElementById(Image_Element_Name).src = newSrc;
}

В этом ответе вы можете найти полный пример того, как должен выглядеть Servlet.

---

SocketException: broken pipe - это просто знак того, что клиентская сторона вообще не обработала ответ и не прервала его. Если вы избавитесь от этого материала Ajax и сделаете это, как описано выше, тогда он должен работать без нареканий.