Uniapp: H5 压缩图片

  uni.chooseImage...

  uni.getImageInfo({
    src: res.tempFilePaths[0],
    success: (res) => {
      const blobUrl = res.path;
      const canvas = document.createElement("canvas");

      // 减少绘制的大小才能压缩,不然可能压缩后图片会变大
      canvas.width = res.width / 2;
      canvas.height = res.height / 2;

      const ctx = canvas.getContext("2d");
      let img = new Image();
      img.src = blobUrl;
      img.error = uni.hideLoading;
      img.onload = () => {
        ctx.drawImage(img, 0, 0, canvas.width, canvas.height);
        const contentType = "image/png";
        canvas.toBlob(
          async (blob) => {
            const blobUrl2 = window.URL.createObjectURL(blob);
            await _upload(blobUrl2); // 使用uniapp的文件上传api发送FormData数据
            window.URL.revokeObjectURL(blobUrl2);
            img = null;
          },
          contentType,
          0.5
        );
      };
    },
    fail: uni.hideLoading,
  });
posted @ 2021-09-04 07:32  Ajanuw  阅读(142)  评论(0编辑  收藏  举报
微信打赏
微信打赏
支付宝打赏
支付宝打赏
Paypal
Paypal