uni+upload上传压缩图片

在使用uni+upload进行图片上传时，如果需要上传压缩过的图片，可以在客户端进行图片压缩后再进行上传。以下是一个示例代码，展示了如何在Uni-app中使用uni.chooseImage选择图片，然后使用canvas进行压缩，最后使用uni.uploadFile上传图片的过程：

// 选择图片
uni.chooseImage({
  count: 1, // 默认9
  sizeType: ['original', 'compressed'], // 可以指定是原图还是压缩图，默认两者都有
  sourceType: ['album', 'camera'], // 从相册选择
  success: function (res) {
    // 获取文件的临时路径
    const tempFilePaths = res.tempFilePaths;
    // 使用canvas进行图片压缩
    compressImage(tempFilePaths[0], (compressedImagePath) => {
      // 上传压缩后的图片
      uni.uploadFile({
        url: 'https://your-upload-api.com', // 你的上传API地址
        filePath: compressedImagePath,
        name: 'file',
        formData: {
          'user': 'test'
        },
        success: (uploadFileRes) => {
          console.log('uploadFile success:', uploadFileRes);
        },
        fail: (uploadFileErr) => {
          console.error('uploadFile fail:', uploadFileErr);
        }
      });
    });
  }
});
 
// 图片压缩函数
function compressImage(src, callback) {
  // 创建canvas对象
  const img = new Image();
  img.src = src;
  img.onload = function () {
    const width = this.width;
    const height = this.height;
    const maxW = 800; // 设置最大宽度
    const maxH = 1200; // 设置最大高度
    const ratio = width / height;
    let targetW = maxW;
    let targetH = maxW / ratio;
    if (targetH > maxH) {
      targetH = maxH;
      targetW = maxH * ratio;
    }
    const canvas = document.createElement('canvas');
    const ctx = canvas.getContext('2d');
    canvas.width = targetW;
    canvas.height = targetH;
    ctx.drawImage(img, 0, 0, targetW, targetH);
    // 将canvas转为图片并回调
    canvas.toBlob((blob) => {
      callback(URL.createObjectURL(blob));
    }, 'image/jpeg', 0.8); // 0.8为压缩质量，可根据需要调整
  };
}

这段代码首先使用uni.chooseImage选择图片，然后使用compressImage函数进行压缩。压缩完成后，使用uni.uploadFile将压缩后的图片上传到服务器。在compressImage函数中，我们使用了canvas来调整图片尺寸，并将其转换为blob，然后通过回调函数返回图片的临时路径。最后，在uni.uploadFile中指定上传API的URL，并附加表单数据，然后就可以将压缩后的图片上传到服务器了。