微信小程序使用canvas进行图片压缩

  1. 由于项目需求,微信提供的wx.chooseImage方法中的压缩参数不能达到效果,里面的sizeType参数,就算选择compressed,也无法达到效果,我发现只有图片超过一定的大小才会被压缩,这个大小是多大暂时不明确,后来经过度娘找到了使用canvas来进行压缩,本次作为一个记录。
  2. 因为图片上传涉及到多个地方,就封装成了公共方法,以每次选择一张为例(服务器需要存储的是base64的格式,所以需要转换),如果是选择多张,图片就需要循环去执行压缩操作:
    public.js
    // 上传图片前的处理,获得图片的格式(base64)
    function getBase64(callback) {
         
      wx.chooseImage({
         
        count: 1,  //最多可以选择的图片总数
        sizeType: ['compressed'], // 可以指定是原图还是压缩图,默认二者都有
        sourceType: ['album', 'camera'], // 可以指定来源是相册还是相机,默认二者都有
        success: function (photo) {
         
          console.log(photo)
          var tempFilePaths = photo.tempFilePaths;
          var fileInfo = tempFilePaths[0].split('/');
          var fileName = fileInfo[fileInfo.length - 1];
          if (photo.tempFiles.size < 102400) {
         		// 这里是判断图片小于多少就不进行压缩,单位是Byte(字节);1024Byte = 1KB; 1024KB = 1M; 1024M = 1GB
            // 不压缩,直接返回64位
            var base = 'data:image/png;base64,' + wx.getFileSystemManager().readFileSync
  • 0
    点赞
  • 6
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值