先用canvas进行压缩,压缩之后在用微信的compressImage压缩。效果挺好
//压缩图片
getCanvasImg: function (index,failNum, tempFilePaths,imgSize){
wx.showLoading({
title:'上传中...',
mask:true
})
var that = this;
if (index < tempFilePaths.length){
if(imgSize < 512000){ //小于的不压缩
that.photoList.push( tempFilePaths[index-1].tempFilePath)
that.suffix.push( tempFilePaths[index-1].tempFilePath.split('.')[1])
return
}
wx.getImageInfo({
src:tempFilePaths[index].tempFilePath,
success(respone){
var canvasWidth, canvasHeight;
canvasWidth= respone.width;
canvasHeight = respone.height;
//压缩比例
// 最大尺寸限制
var maxWidth = 1000;
var maxHeight = 1000;
// 目标尺寸
var targetWidth = canvasWidth
var targetHeight = canvasHeight;
//等比例压缩,如果宽度大于高度,则宽度优先,否则高度优先
if (canvasWidth > maxWidth || canvasHeight > maxHeight) {
if (canvasWidth / canvasHeight > 1) {
// 宽图片
targetWidth = maxWidth
targetHeight = Math.round(maxWidth * (canvasHeight / canvasWidth))
} else {
// 高图片
targetHeight = maxHeight
targetWidth = Math.round(maxHeight * (canvasWidth / canvasHeight))
}
}
//尝试压缩文件,创建 canvas
var ctx = wx.createCanvasContext('attendCanvasId');
ctx.clearRect(0,0,targetWidth,targetHeight)
ctx.drawImage(tempFilePaths[index].tempFilePath, 0, 0, targetWidth, targetHeight);
ctx.draw()
that.$set(that,'canvasWidth',targetWidth)
that.$set(that,'canvasHeight',targetHeight)
setTimeout(function () {
index = index + 1;//上传成功的数量,上传成功则加1
wx.canvasToTempFilePath({
canvasId: 'attendCanvasId',
destWidth: targetWidth,
destHeight: targetHeight,
fileType:'jpg',
success: function success(resP) {
var a = tempFilePaths[index-1].tempFilePath.split('.')[1]
wx.compressImage({
src: resP.tempFilePath, // 图片路径
quality: 95, // 压缩质量
success(ressss){
upLoadPics( [ressss.tempFilePath] ,0,'',a).then(urlS => {
that.sendMessae(urlS, 1);
}).catch((err) => {
console.log(err);
});
},
})
}, fail: function (e) {
// console.log(e,'上传失败')
failNum += 1;//失败数量,可以用来提示用户
that.getCanvasImg(inedx,failNum,tempFilePaths);
}
});
},500)
},
})
}else{
wx.hideLoading()
}
},
//上传图片
addPhotoFn(sourceType) {
var _this = this;
wx.chooseMedia({
count: 1,
sizeType: ['original'],
mediaType:['image'],
sourceType:['album', 'camera'],
success: function (res) {
_this.getCanvasImg(0,0,res.tempFiles,res.size)
},fail:(err)=>{
console.log(err,'上传错误')
}
})
},