标签:
项目中需要完成一个点击超链接弹出窗口,窗口中用于展示存放于数据库中的图片这样的功能;
<div id="mpic">
<img src="http://192.168.24.9:8281/acctSettlement/rfcheck/printImage?prosn=20150901100501" width="100%" height="100%">
<br>
<hr>
<br>
</div>
1 @RequestMapping(value = "/printImage", method = RequestMethod.GET) 2 public void printImage(Long prosn, HttpServletResponse response) { 3 AReFundApplyProcess annex = aReFundApplyCheckService 4 .queryAnnexByProsn(prosn); 5 InputStream in = null; 6 try { 7 in = ((Blob) annex.getContent()).getBinaryStream(); //这里获取content节点是因为mapper中的resultMap中将这个返回类型配置成了BOLB 8 } catch (SQLException e) { 9 e.printStackTrace(); 10 } 11 try { 12 BufferedOutputStream bos = new BufferedOutputStream( 13 response.getOutputStream()); 14 int n; 15 while ((n = in.read()) != -1) { 16 bos.write(n); 17 } 18 bos.flush(); 19 bos.close(); 20 } catch (IOException e) { 21 log.info("显示退款申请资料图片异常"); 22 } finally { 23 try { 24 in.close(); 25 } catch (IOException e) { 26 log.info("输出流关闭失败"); 27 } 28 } 29 }
这里可以看到,在第七行的时候已经通过pojo的get方法获取到保存的blob对象,即存放在数据库中图片;
获取到 inputstrem之后即可通过 response的 getOutpstream方法将对象输出到内存中,虽然具体原理有待考证,不过目前功能实现是这样的;
> 知识点记录:response的getOutputstream方法,以及Java中IO体系相关;
最终将获取到的输出流通过flush方法刷出到页面上;
java代码在这一步就完成了,这个功能最大的问题是在于如何从页面中获取到内存中的图片;
# page.jsp 代码
1 <a id="searchBut" href="#" class="easyui-linkbutton" data-options="iconCls:‘icon-search‘"> 2 查看 3 </a> 4 5 functions showImg(){ //这个方法在点击查看按钮时调用; 6 7 $.post("<%=basePath%>rfcheck/queryRefundApplyAnnex", 8 {"applyid":applyidVar}, 9 function(data){ 10 $("#searchBut").click(function(){ 11 $("#mpic").html(""); 12 var mdata = data; 13 $(mdata.rows).each(function(i, elem){ 14 var url = "<%=basePath%>rfcheck/printImage?prosn="+elem.prosn; 15 var img = "<img src=‘"+url+"‘ width=‘100%‘ height=‘100%‘/>"; 16 $("#mpic").append(img); 17 $("#mpic").append("<br/><hr/><br/>"); 18 }); 19 $(‘#imageWindow‘).window(‘open‘); 20 }); 21 },"json"); 22 23 }
可以看出,这里通过循环遍历的方式依次获取到了内存中的图片对象,并将其拼接成了一个路径用于在弹出窗口中显示;
EasyUI+SpringMVC+Mybaits 页面图片弹窗显示
标签:
原文地址:http://www.cnblogs.com/caleb-box/p/4884863.html