微信小程序压缩图片

由于wx.compressImage(Object object) iOS 仅支持压缩 JPG 格式图片。所以我们需要做一下特殊的处理：

1.获取文件，判断文件是否大于设定的大小

2.如果大于则使用canvas进行绘制，并生成新的图片路径

3.上传图片

async chooseImage() {let res = await wx.chooseMedia({count: 1,sizeType: ["compressed"],mediaType: ['image']})if (res.tempFiles[0].size > 500 * 1024) { //大于500k//压缩图片compressImage(res.tempFiles[0], '#canvasId').then(result => {this.uploadFile(result.tempFilePath)})} else {this.uploadFile(res.tempFiles[0].tempFilePath)}},

const compressImage = function (file, node) {return new Promise((resolve, reject) => {//获取图片的信息wx.getImageInfo({src: file.tempFilePath,success: async function (imageInfo) {//获取canvasconst query = wx.createSelectorQuery()let canvasDom = query.select(node) //画布idcanvasDom.fields({node: true,size: true}).exec((res) => {const canvas = res[0].nodecanvas.width = 900 canvas.height = 900const ctx = canvas.getContext('2d')let img = canvas.createImage();img.src = imageInfo.path; //要压缩的图片路径img.onload = () => {// 将图片绘制到canvasctx.drawImage(img, 0, 0, canvas.width, canvas.height)// 生成图片wx.canvasToTempFilePath({canvas,destWidth: 900, //压缩后宽destHeight: 900, //压缩后高fileType: 'jpg',quality: 0.8, //质量，可自定义success: (imgResult) => {let fs = wx.getFileSystemManager()fs.getFileInfo({filePath: imgResult.tempFilePath,success: (res) => {//压缩后的图片如果还是大于500k，那么继续压缩直到小于500为止if (res.size > 500 * 1024) {compressImage(imgResult)} else {resolve(imgResult)}}})},fail: (err) => {console.error(err);reject(err)}})}})},fail: function (err) {console.error('获取图片信息失败：', err);}});})
}

uploadFile(avatarUrl) {if (avatarUrl) {wx.uploadFile({filePath: avatarUrl,name: 'file',url: "http://139.224.49.138:888/mini/myPage/uploadAvatar",formData: {openid: getApp().globalData.openid},success: (res) => {let {userInfo} = app.store.getState();userInfo.headPic = JSON.parse(res.data).urlapp.store.setState({userInfo: userInfo});},fail: err => {console.log(err);}})}},

<canvas hidden="{{true}}" type="2d" id="canvasId"/>