保存图片信息到数据库，并可读取后显示在前端

1.上传文件到后台

<form>
  <div class="filebox">
    <input type="file" id="upload" name="bean.file" class="file" οnchange="validFile();"/>
  </div>
  <label for="upload" id="uploadError" class="error"></lable>
</form>

2.读取二进制流，保存到数据库中（这里我在数据库创建的字段是mediumtext类型，也可以是blob或其他blob，若是blob，则将byte[]存入数据库）

InputStream in = null;
try {
  if (bean.getFile() != null) {
     in = new FileInputStream(bean.getFile());
     byte[] b = new byte[(int)bean.getFile().length()];
     in.read(b);
     bean.setImageBase64(new BASE64Encoder().encode(b));
     manager.save(bean);
  } catch() {

  } finally {

  }

3.读取图片

3.1 拼接src（若图片都比较小且无需兼容IE6.IE7，可以采用拼接src的方式）

<img id="myImg" src="data:image/" οnerrοr="imgLoadError()" />
input class="hidden" type="text" id="imageSuffix" name="bean.imageSuffix" />
<input class="hidden" type="text" id="imageBase64" name="bean.imageBase64" />

$(function() {
  $("#myImg").attr("src",$("#myImg").attr("src") + $("#imageSuffix").val() + ";base64," + $("#imageBase64").val() );

})
function imgLoadError() {
  $("#myImg").attr("alt","图片未上传或已被删除");
}

3.2向后台请求

$(function() {
  $("#myImg").attr("src",url);
})

Bean bean = manager.getImageByParams(params);
String imgBase64 = bean.getImageBase64();
String imgSuffix = bean.getImageSuffix();
if (StringUtils.isNotEmpty(imgBase64) && StringUtils.isNotEmpty(imgSuffix)) {
  response.setContentType("image/"+imgSuffix);
  response.setHeader("Pragma","no-cache");
  response.setIntHeader("Expired",-1);
  response.getOutputStream().write(new Base64Decoder().decodeBuffer(imgBase64));
}

几点记录：

1.出于安全考虑，IE浏览器必须双击上传，才弹出本地文件路径，可通过css修改

2.IE8以下的浏览器不支持Base64显示图片，IE8对这种方式显示图片有大小限制

参考：

http://www.cnblogs.com/xudong-bupt/p/3758529.html

http://hw1287789687.iteye.com/blog/1971297

http://www.jb51.net/article/48717.htm