需要的jar包
BASE64Decoder.jar
html模块
选择文件:<input type="file" id="fileName" name="fileName">
<button onclick="uploadPic()">上传</button>
js模块
function uploadPic() {
//获取File文件
var file = document.getElementById('fileName').files[0];
//声明一个文件流
var reader = new FileReader();
//如果文件不为null则开始读取2进制数据到文件流(reader)里面
if (file) {
reader.readAsDataURL(file);
}
reader.onload = function() {
//文件大小
var fileSize = file.size
//最大文件大小
var maxSize = 10 * 1024 * 1024;
//限制文件大小
if (fileSize > maxSize) {
mui.alert('上传文件大小超过限制(最大4M)')
} else {
//把二进制转成base64编码字符串
var base64 = reader.result.split(',')[1];
reader.fileSize
//二进制提交到后台处理,并返回图片地址
$.ajax({
url : 'User/Info',
type : 'POST',
dataType : 'json',
data : {
'fileName' : base64
},
success : function(data) {
alert("上传成功");
},
error : function() {
alert('上传失败');
}
})
//var dataUrl = 'data:image/png;base64,' + base64;
//placeholder.style.backgroundImage = 'url(' + dataUrl + ')';
}
reader.onerror = function() {
alert('图片加载出错');
}
}
}
java模块
public void saveImg(HttpServletRequest request, HttpServletResponse response) throws Exception{
//设置编码格式
response.setCharacterEncoding("utf-8");
//获取前台传来的Base64解码字符串
String fw=request.getParameter("fileName");
//创建一个 BASE64Decoder对象(用来解码)
BASE64Decoder decoder = new BASE64Decoder();
//把字符串进行解码成二进制
byte[] b = decoder.decodeBuffer(fw);
//调整异常数据
for(int i=0;i<b.length;++i)
{
if(b[i]<0)
{
b[i]+=256;
}
}
//用时间来生成文件名
String newFileName=new SimpleDateFormat("yyyyMMddHHmmssS").format(new Date())+".jpg";
//获取根目录下pic文件夹路劲
String uploadPath = request.getSession().getServletContext().getRealPath("/pic/");
//创建一个文件夹
File file=new File(uploadPath);
//判断文件夹是否存在 不存在则创建
if (file.exists()) {
if (file.isDirectory()) {
System.out.println("dir exists");
} else {
System.out.println("the same name file exists, can not create dir");
}
} else {
System.out.println("dir not exists, create it ...");
file.mkdir();
}
//生成一个jpg图片
String imgFilePath = uploadPath+"/"+newFileName;
//获取图片的输出流
OutputStream out = new FileOutputStream(imgFilePath);
//把二进制的数据写入图片中
out.write(b);
out.flush();
out.close();
//返回一个json字符串
PrintWriter pw=response.getWriter();
pw.write("{\"msg\":\"上传成功\"}");
pw.flush();
pw.close();
}