收藏
回答

wx.compressImage()什么时候能压缩图片尺寸?

现在手机摄像头的像素越来越高,把很高像素的照片上传腾讯人脸识别,会发生超时的错误,并且消耗了更多的网络流量。

通常业务场景要上传的图片,像素要求也没那么高。

目前compressimage只实现了压缩算法的压缩质量调整,并没有改变图片的尺寸,因此,压缩也有限。

希望在takephoto获取的图片,能够直接压缩图片尺寸,而不是送入一个看不见的canvas,去处理。非常麻烦。

现在通过wx.getImageInfo,将拍摄到照片的原始尺寸,送入canvas,drawimage,出来的只是真实图片的一角。送到人脸识别返回没有人脸。

我知道自己对canvas的知识有限,会继续百度解决方案。但是,目前这种处理方式非常非常非常的麻烦,不符合低代码的趋势。

强烈建议提供直接压缩图片尺寸的函数!!!谢谢!

回答关注问题邀请回答
收藏

3 个回答

  • 社区技术运营专员-Jahozheng
    社区技术运营专员-Jahozheng
    2022-05-30

    你的反馈我们已收到,我们会进行评估

    2022-05-30
    有用 1
    回复 1
    • momo
      momo
      发表于小程序端
      2022-07-25

      希望官方能尽快解决这个问题,canvas 压缩图片尺寸,效率真的很低,很影响用户体验

      2022-07-25
      回复
  • Frank
    Frank
    2022-05-30

    👍🏻

    2022-05-30
    有用 1
    回复
  • 江五浪
    江五浪
    2022-06-04

    经过不断尝试,终于实现了图片尺寸压缩。

    关键点是,图像的物理像素和逻辑像素的关系,有的使用的逻辑像素,有点使用的物理像素。

    首先在页面上建一个看不见的canvas:

      <canvas type="2d" id="myCanvas" style="width:{{cWidth}}px;height:{{cHeight}}px; position: absolute;left:-1000px;top:-1000px;"></canvas>

    处理函数:

    compressImg: function (imgFile) { //imgFile欲压缩的图片文件名和路径

        var that = this;

        console.log("compress start...");

        const query = wx.createSelectorQuery()

        query.select('#myCanvas')

          .fields({

            node: true,

            size: true

          })

          .exec(function (res) {

            const canvas = res[0].node;

            const ctx = canvas.getContext('2d');

            let image = canvas.createImage();

            image.src = imgFile;

            image.onload = function () {

              let styleWidth = image.width; //单位px

              let styleHeight = image.height; //单位px

              var sizeLimit = 200;  //单位px,逻辑像素,欲压缩到的最大边的px数

              if (Math.max(styleWidth, styleHeight) > sizeLimit) {

                var percent = sizeLimit / Math.max(styleWidth, styleHeight);

                styleWidth = Math.trunc(styleWidth * percent)

                styleHeight = Math.trunc(styleHeight * percent)

              }

              const dpr = wx.getSystemInfoSync().pixelRatio;  //获取设备像素比,物理像素和逻辑像素的比值

              //重点:DrawImage使用的物理像素,canvas的width、height一定要设置,否则,图像会变形。因为系统给的初始值和你图片的比例不一致

              canvas.width = styleWidth * dpr;

              canvas.height = styleHeight * dpr;

              //canvas实际显示的是style中的width和height,单位px

              that.setData({

                cWidth: styleWidth,

                cHeight: styleHeight

              });

              ctx.drawImage(image, 0, 0, canvas.width, canvas.height);

    //使用jpeg格式,比png要小一个数量级

              let dataURL = canvas.toDataURL("image/jpeg", 0.7);

              //自己后续处理,我直接上传base64编码就可以了;

            }

          })

      },

    2022-06-04
    有用
    回复 2
    • momo
      momo
      发表于小程序端
      2022-07-25

      这样效率太低了,压缩时长太久

      2022-07-25
      回复
    • 大母鹅
      大母鹅
      2022-07-29
      你好,我差不多也是这样写的,工具调试没有问题,但是安卓真机调试图片只要超过1m就不行,1m以下就可以,有了解是什么问题吗
      2022-07-29
      回复
登录 后发表内容