前台获取后台返回的图片并显示

后台:

String base64str=new String(log.getRequest_imgdata());//log为实体 括号里面是图像的get方法 返回为Byte[]型
String new str=new String("\"data:image/jpg;base64,"+base64str+"\"");//拼装Base64字符串头
response.getWriter().write(newstr);//将完整Base64字符串返回前台

前台Js:

var srcUrl = appJP.urlReqImg +"?log_id="+row.log_id;//请求URL
        $.get(srcUrl,function(data){
            var imgWindow = $("#imgDetail").html("<img src="+data+">");//接收Base64字符串,并转换为图片显示
            $("#showImg").window({title:"图片详情",width:"auto"}).window("open").window("center");
        })

 

以上已实现从数据库取出BLOB类型Base64图像数据(Java中为byte[])转换为字符串,并发送至前台显示

但是在测试中发现稍微大一点的图像(几百KB)在部分IE浏览器中不能显示,查询资料发现是IE8以下对Base64解码长度限制的问题

 

解决方案:更换后台到前台传输图像数据形式为流的形式

后台:  

复制代码
String base64str=new String(log.getRequest_imgdata());
BASE64Decoder decoder=new BASE64Decoder();
byte[] imgbyte=decoder.decodeBuffer(base64str);//解码Base64图片数据
response.setContentType("image/jpeg");
ServletOutputStream outputStream = response.getOutputStream();
outputStream.write(imgbyte);
outputStream.flush();
复制代码

前台js:

var srcUrl = appJP.urlReqImg +"?log_id="+row.log_id;
var imgWindow = $("#imgDetail").html("<img src="+srcUrl+">");
$("#showImg").window({title:"图片详情",width:"auto"}).window("open").window("center");
  • 2
    点赞
  • 10
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值