通过JSP显示BLOB(图像)

时间:2012-06-25 15:12:03

标签: java java-ee

我有一个代码来显示员工的图表。

数据(名称,电话,照片等)存储在SQLServer中并通过JSP显示。 显示数据没问题,但图像.jpg除外(存储在IMAGE = BLOB列中)。

顺便说一句,我已经显示了图像(参见下面的代码),但是我不知道如何将它放在.css中定义的区域(参见下面的代码),因为图像通过resultSet加载到浏览器的整个页面中。

有谁知道我怎么能'构图'图像?

<%
Connection con = FactoryConnection_SQL_SERVER.getConnection("empCHART");
Statement stSuper = con.createStatement();
Statement stSetor = con.createStatement();

Blob image = null;
byte[] imgData = null;

ResultSet rsSuper = stSuper.executeQuery("SELECT * FROM funChart WHERE dept = 'myDept'");

if (rsSuper.next()) {
image = rsSuper.getBlob(12);
imgData = image.getBytes(1, (int) image.length());
response.setContentType("image/gif");
OutputStream o = response.getOutputStream();
//o.write(imgData); // even here we got the same as below.
//o.flush();
//o.close();

--[...]

<table style="margin: 0px; margin-top: 15px;">
<tr>
<td id="photo">
<img title="<%=rsSuper.getString("empName").trim()%>" src="<%= o.wite(imageData); o.flush(); o.close(); %>" />
</td>
</td>

<td id="empData">
<h3><%=rsSuper.getString("empName")%></h3>
<p><%=rsSuper.getString("Position")%></p>
<p>Id:<br/><%=rsSuper.getString("id")%></p>
<p>Phone:<br/><%=rsSuper.getString("Phone")%></p>
<p>E-Mail:<br/><%=rsSuper.getString("Email")%></p>
</td>
</table>

以下是应该对图像进行构图的片段:

#photo
{
    padding: 0px;
    vertical-align: middle;
    text-align: center;
    width: 170px;
    height: 220px;
}

提前致谢!

4 个答案:

答案 0 :(得分:17)

你在这里犯了一些根本性的错误。 <img src>必须指向一个URL,不包含图像的二进制内容。 JSP页面本身的内容类型不应设置为image/gif。它应该默认为text/html。 Web服务器不应该像您期望的那样在HTML结果中包含具体图像。 Web浏览器根据src属性中的URL单独下载图像,然后相应地显示它们。

最简单的方法是创建一个单独的servlet,将图像从数据库流式传输到响应主体。您可以通过请求参数或路径信息唯一标识图像。这是一个使用请求参数的示例:

<img src="imageServlet?id=<%=rsSuper.getString("id")%>" />

doGet()方法应基本上执行此作业:

String id = request.getParameter("id");

// ...

InputStream input = resultSet.getBinaryStream("imageColumnName");
OutputStream output = response.getOutputStream();
response.setContentType("image/gif");
// Now write input to output the usual way.

无关具体问题,使用 scriptlets 这种方式正式强烈劝阻十年以来。也许您正在阅读完全过时的书籍/教程,或者正在维护一个古老的JSP Web应用程序。有关一些见解,请参阅以下问题的答案以获取一些提示:

答案 1 :(得分:2)

如果要通过HTML标记显示图像,则必须将图像指向加载图像的服务器中的资源,以便客户端浏览器可以加载它。这样,您可以设置<img />标记的样式。

为了实现这一目标,大多数人编写了ImageServlet来加载图像的二进制数据并写入<img src = "/source/to/someImageServlet?id=<%=rsSuper.getString("id")%>" id = "photo"/>

答案 2 :(得分:1)

  Connection con = new DBConnection().getConnection();
        String sql = " SELECT * FROM tea ";
        PreparedStatement ps = con.prepareStatement(sql);
        ResultSet rs = ps.executeQuery();

        while (rs.next()) {
            byte[] imgData = rs.getBytes("img"); // blob field 
            request.setAttribute("rvi", "Ravinath");
            rs.getString("teatitle");

            String encode = Base64.getEncoder().encodeToString(imgData);
            request.setAttribute("imgBase", encode);
        }

然后在jsp页面上使用jstl作为提取属性

 <img src="data:image/jpeg;base64,${imgBase}" />

答案 3 :(得分:0)

//globle variable
List listmap = new ArrayList();//with getter/setter

//method
Connection con = conn.getConnection();
PreparedStatement ps = null;
String query="select img from tablename";
ps = con.prepareStatement(query);
resultSet = ps.executeQuery();
while (resultSet.next()) {
PackagePojo p1=new PackagePojo();
// pojo class with field private String imagePath with getter/setter;
byte[] img = resultSet.getBytes("PTOIMAGE");//PTOIMAGE db column name
String encode=Base64.encodeBase64String(img );
p1.setImagePath(encode);
listmap.add(p1);
}

//in jsp with struts2

<s:iterator value="listmap">
<img src="data:image/jpeg;base64,${imagePath}" alt="bhudutt" title="bhudutt" />
</s:iterator>