网上看到很多列子有用thumbnailator的、数据流等方法,最后我用了vue的前端lrz.js的压缩库,因为项目刚好是微信公众号的,前端用的weui。
首先要引用
<script type="text/javascript" src="/lib/lrz.min.js"></script>
//一开始是 lrz(file,{width:640,fieldName:"file"}) 方法里面有参数的但是我发现会把我
//上传的1920*960像素的压缩成640*320的像素图片,所以我把里面的参数去掉了
function upload(file,id) {
lrz(file,"").then(function (rst) {
var xhr = new XMLHttpRequest();
xhr.open('POST', 'http://'+host+'/system/upload');
xhr.onload = function () {
if (xhr.status === 200) {
if(id=='introduceLetter'){
app.bespeak.introduceLetterPath=xhr.responseText;
}else if(id=='entrustBook'){
app.bespeak.entrustBookPath=xhr.responseText;
}
} else {
}
};
xhr.onerror = function () {
};
xhr.upload.onprogress = function (e) {
}
// 添加参数
rst.formData.append('size', rst.fileLen);
rst.formData.append('base64', rst.base64);
// 触发上传
xhr.send(rst.formData);
return rst;
})
.catch(function (err) {
alert(err);
})
.always(function () {// 不管是成功失败,这里都会执行
debugger
$.hideLoading();
});
}