1.首先你得知道前台传的是什么玩意.
<body>
<input type="file" id="image"><br/>
<div id="div"></div>
</body>
<script type="text/javascript" src="juqery-1.8.3.js"></script>
<script type="text/javascript">
//给file添加一个事件,当选择了文件后,执行下面uploadFile的方法
$("#image").bind("change", function() {
uploadFile($(this));
});
//通过onChange直接获取base64数据
function uploadFile(file) {
var reader = new FileReader();
var allowImgFileSize = 2100000; //上传图片最大值(单位字节)( 2 M = 2097152 B )超过2M上传失败
var file = $("#image")[0].files[0];
var imgUrlBase64;
if (file) {
//将文件以Data URL形式读入页面
imgUrlBase64 = reader.readAsDataURL(file);
reader.onload = function (e) {
//var ImgFileSize = reader.result.substring(reader.result.indexOf(",") + 1).length;//截取base64码部分(可选可不选,需要与后台沟通)
if (allowImgFileSize != 0 && allowImgFileSize < reader.result.length) {
alert( '上传失败,请上传不大于2M的图片!');
return;
}else{
//将转码后的数据展示出来
$("#div").html(reader.result)//data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/
}
}
}
}
</script>
前台最终转的结果是:data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/......是这样的.也就是说
data:+文件格式+";"+base64+","+核心数据.
取到了转码后的数据,那么传给后台,后台怎么解决呢?
2.后台怎么解析Base64
其实这跟后台不后台没有什么关系,关键是你得理解什么是base64,什么是文件.
base64只是字节的编码方式.文件是字节的数据集.
想要转成文件,那么就只需要解码成字节数组,然后通过字节流写成文件即可.如下图代码,
/**
* 1.获取到后面到数据
*/
String data = "data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD....";
String base64Data = data.split(",")[1];
/**
* 2.解码成字节数组
*/
Decoder decoder = Base64.getDecoder();
byte[] bytes = decoder.decode(base64Data);
/**
* 3.字节流转文件
*/
FileOutputStream fos = null;
try {
fos = new FileOutputStream("E:\\aaa.jpg");
fos.write(bytes);
return name;
} catch (IOException e) {
e.printStackTrace();
} finally {
if (fos != null){
try {
fos.close();
} catch (IOException e) {
e.printStackTrace();
}
}
}
即可.