微信小程序上传图片压缩方案

小程序上传图片需要进行压缩，可以使用wx.getFileSystemManager()方法将图片转换成base64格式，再使用canvas将图片压缩成指定大小。

//选择图片

wx.chooseImage({

    count:  1,  //最多选择1张图片

    success:  function(res)  {

        var  tempFilePaths  =  res.tempFilePaths;  //获取图片本地路径

        //将图片转换成base64格式

        wx.getFileSystemManager().readFile({

            filePath:  tempFilePaths[0],

            encoding:  'base64',

            success:  function(data)  {

                //创建canvas进行压缩

                var  imgData  =  'data:image/png;base64,'  +  data.data;

                var  image  =  new  Image();

                image.src  =  imgData;

                image.onload  =  function()  {

                    //压缩图片，并绘制到canvas上

                    var  canvas  =  document.createElement('canvas');

                    var  context  =  canvas.getContext('2d');

                    var  originWidth  =  this.width;

                    var  originHeight  =  this.height;

                    var  maxWidth  =  1280,  //设置最大的宽度

                            maxHeight  =  1280,  //设置最大的高度

                            targetWidth  =  originWidth,

                            targetHeight  =  originHeight;

                    if  (originWidth  >  maxWidth  ||  originHeight  >  maxHeight)  {

                        if  (originWidth  /  originHeight  >  maxWidth  /  maxHeight)  {

                            targetWidth  =  maxWidth;

                            targetHeight  =  Math.round(maxWidth  *  (originHeight  /  originWidth));

                        }  else  {

                            targetHeight  =  maxHeight;

                            targetWidth  =  Math.round(maxHeight  *  (originWidth  /  originHeight));

                        }

                    }

                    canvas.width  =  targetWidth;

                    canvas.height  =  targetHeight;

                    context.clearRect(0,  0,  targetWidth,  targetHeight);

                    context.drawImage(image,  0,  0,  targetWidth,  targetHeight);

                    //将canvas转换成图片base64格式

                    var  imageData  =  canvas.toDataURL('image/png');

                    var  base64Data  =  imageData.replace(/^data:image\/\w+;base64,/,  "");

                    //调用接口上传图片

                    wx.uploadFile({

                        url:  '接口地址',

                        filePath:  tempFilePaths[0],

                        name:  'file',

                        formData:  {

                            'content':  base64Data

                        },

                        success:  function(res)  {

                            //上传成功

                        },

                        fail:  function()  {

                            //上传失败

                        }

                    })

                }

            }

        })

    }

})

首先使用wx.chooseImage()方法选择了一张图片，然后使用wx.getFileSystemManager()方法将图片转换成base64格式。接着使用canvas进行压缩，并将canvas转换成图片base64格式，最后调用接口上传图片。在压缩过程中，设置了最大宽度和高度为1280，可以根据实际需求进行调整