Base64编码图片存取与前台显示
需求:将Base64编码图片以BLOB类型存入数据库,需要时取出显示
后台:
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");
Base64编码图片存取与前台显示的更多相关文章
- Delphi 读取 c# webservice XML的base64编码图片字符串转化图片并显示
Delphi 读取 c# webservice XML的base64编码图片字符串转化图片并显示 在 开发中遇到应用c#及asp.net的在的webservice 保存图片并以xml文件形式现实出来 ...
- VUE Base64编码图片展示与转换图片
图片的 base64 编码就是可以将一副图片数据编码成一串字符串,使用该字符串代替图像地址,使用 base64 传输图片文件可以节省一个 http 请求,图片的 base64 编码可以算是前端优化的一 ...
- 前端上传 base64 编码图片到七牛云存储
参考文档 如何上传base64编码图片到七牛云 调试过程 文档中分别有 java 和 html 的 demo,可以根据文档示例调试. 下面是我调试的过程,可以作为参考,特别注意的是,如果需要给文件起名 ...
- 保存BASE64编码图片
1.前端上传用户图片时,一些K数较小图片,头像图标等 .以bass64编码后的字符串传到服务器. 2.服务器接收并保留到本地. // 页面上点击保存 $.post('/imgupload/save', ...
- 如何上传base64编码图片到七牛云
接口说明 POST /putb64/<Fsize>/key/<EncodedKey>/mimeType/<EncodedMimeType>/crc32/<Cr ...
- Base64编码 图片与base64编码互转
package com.education.util; import sun.misc.BASE64Decoder; import sun.misc.BASE64Encoder; import jav ...
- 博客使用base64编码图片测试
为了解决发博客时需要先要上传,所以查了一下这个方法 1.把本地图片转为base64编码的字符串, 网上有很多提供这个功能的网站,转换后像这样 data:image/jpeg;base64,/9j/4A ...
- 接口上传base64编码图片
package com.*.util; import java.io.FileInputStream; import java.io.FileOutputStream; import java.io. ...
- [转]关于CLOB存储Base64图片编码,直接在前台显示解决方案
转至:http://ouapi.com/tool/imgtob 两种方案: Base64在CSS中的使用 .yanshishuxing{ background-image: url("dat ...
随机推荐
- 解决Vue中"This dependency was not found"的方法
今天在初始化项目中,出现了一个奇怪的情况:明明路径是对的,但是编译的时候,一直报"This dependency was not found"的错. 代码如下: import Vu ...
- Tarjan算法初探(2):缩点
接上一节 Tarjan算法初探(1):Tarjan如何求有向图的强连通分量 Tarjan算法一个非常重要的应用就是 在一张题目性质在点上性质能够合并的普通有向图中将整个强连通分量视作一个点来把整张图变 ...
- svn配置教程
检查svn是否安装rpm -aq subversion如果没有安装yum安装yum install -y subversion 建立svn版本数据库存储根目录mkdir -p /application ...
- PHP && ,and ,||,or 的区别
PHP中的逻辑“与”运算有两种形式:AND 和 &&,同样“或”运算也有OR和||两种形式. 如果是单独两个表达式参加的运算,两种形式的结果完全相同,例如 $a AND $b和$a & ...
- MySQL数据库实验:任务二 表数据的插入、修改及删除
目录 任务二 表数据的插入.修改及删除 一.利用界面工具插入数据 二.数据更新 (一)利用MySQL命令行窗口更新数据 (二)利用Navicat for MySQL客户端工具更新数据 三.数据库的备份 ...
- 【四】搭建Nginx服务器
[任务4]搭建Nginx服务器 [任务4]搭建Nginx服务器 下载Nginx源码包 安装Nginx 解压Nginx安装包 安装Nginx依赖 启动Nginx 安装cgi 下载cgi并解压安装包 编译 ...
- keil编译运行错误,缺少error:#5:#include "core_cm3.h"
用Keil vision5编译时出现以下错误:error: #5: cannot open source input file "core_cm3.h": No such fi ...
- 常见的Content-Type类型
Content-Type说明 MediaType,即是Internet Media Type,互联网媒体类型:也叫做MIME类型, 在Http协议消息头中,使用Content-Type来表示具体请求中 ...
- scala (6) Map
在scala中Map分为可变长(mutable)和不可变长(imtable) /** * 不可变长map 长度一旦初始化,就不能在进行更改 */ // 通过对偶元组的方式创建map val map = ...
- 实现虚拟机和宿主机之间的复制、粘贴(ubuntu系统)
参考:https://blog.csdn.net/weixin_37850264/article/details/79057886 https://blog.csdn.net/zldz14/artic ...