如何通过AJAX调用从java bean返回图像?

时间:2014-06-16 21:44:44

标签: java javascript jquery ajax jsp

我有一个jsp,它对一个helper jsp进行AJAX调用,调用一个创建图像的java bean。帮助程序JSP然后将图像加载到字节数组中,使用Apache commons将其编码为Base64并返回字符串。

File imageFile = new File("test.png");
response.setHeader("Content-Type", getServletContext().getMimeType(imageFile.getAbsolutePath()));
response.setHeader("Content-Length", String.valueOf(imageFile.length()));
FileInputStream is = new FileInputStream(imageFile);
byte[] buffer = new byte[(int)imageFile.length()]; // 32k buffer
int offset = 0;
while ( offset < buffer.length ) {
    int count = is.read(buffer, offset, buffer.length - offset);
    offset += count;
}
byte[] encoded = Base64.encodeBase64(buffer);
String encodedFile = Base64.encodeBase64String(encoded);
out.print(encodedFile);
out.flush();

以下是制作和接收图片请求的javascript:

function getContourImage(startDate, stopDate){
    $.ajax("services/contour.jsp", {
        data: {
          startDate: startDate,
          stopDate: stopDate
        },
        dataType: "json",
        traditional: true, 
        success: contourImageHandler()
    });
}
function contourImageHandler(resp){
    alert("resp: " + resp);
    $( "#plot" ).attr("src","data:image/png;base64," + resp);
}

这是html中的图像显示区域:

<div id="imageDisplay" name="imageDisplayDiv"
    img name="contourImageLocation"
    id="plot" src="images/test.png" width="1200" height="1200">

我可以在firebug面板中看到响应,它似乎有数据。 ajax响应处理程序中的alert语句表示响应未定义,并且没有图像放置在绘图位置。有谁知道我做错了什么?

1 个答案:

答案 0 :(得分:0)

对于问题的“显示图像”部分,您可以通过以下方式: http://danielmclaren.com/node/90

此外,如果'helper jsp'工作被移动到Servlet会更好,因为你可能会在jsp响应中获得额外的/垃圾空间和换行符。