zoukankan      html  css  js  c++  java
  • uniapp 调用原生 压缩图片

    choseImg() {
        let that = this;
        that.isCrossImg = true;
        uni.chooseImage({
            count: that.count,
            sizeType: ['compressed', 'original'],
            sourceType: that.sourceType,
            success: function(chooseImageRes) {
                console.log("chooseImageRes", chooseImageRes);
                let tempFilePaths = chooseImageRes.tempFilePaths; //上传的图片路径
                //判断图片上传是否必须要横图,若需要则验证
                if (that.baseData.remote) {
                    tempFilePaths.forEach((item, index) => {
                    uni.getImageInfo({
                        src: item,
                        success: (res) => {
    
                            let canvasWidth = res.width; //图片原始长宽
                            let canvasHeight = res.height;
                            if (canvasWidth <= canvasHeight) {
                                uni.showToast({
                                    title: '请使用手机横拍上传图片',
                                    duration: 1000,
                                    icon: 'none'
                                });
                                that.isCrossImg = false;
                                return;
                            }
    
                        },
                        complete: () => {
                            if (index == tempFilePaths.length - 1 && that.isCrossImg) {
                                 that.appCompressImg(0, tempFilePaths);
                            }
                        }
                    })
                    })
                } else {
                    that.appCompressImg(0, tempFilePaths);
                }
    
            }
        })
     },
    
     //app压缩图片,由于这个操作是异步,所以需要递归,num记录递归的次数是否等于数组长度用于程序的返回
     appCompressImg(num, tempFilePaths) {
         let that = this;
         let index = tempFilePaths[num].lastIndexOf("."); //获取图片地址最后一个点的位置
         let img_type = tempFilePaths[num].substring(index + 1, tempFilePaths[num].length); //截取图片类型如png jpg
         let img_yuanshi = tempFilePaths[num].substring(0, index); //截取图片原始路径
         let d2 = new Date().getTime(); //时间戳
         //压缩图片
         plus.zip.compressImage({
             src: tempFilePaths[num], //你要压缩的图片地址
             dst: img_yuanshi + d2 + '.' + img_type, //压缩之后的图片地址(注意压缩之后的路径最好和原生路径的位置一样,不然真机上报code-5)
              '800px',
             height: 'auto'
         },
         function(e) {
             //压缩之后路径转base64位的
             //通过URL参数获取目录对象或文件对象
             plus.io.resolveLocalFileSystemURL(e.target, function(entry) {
             // 可通过entry对象操作test.html文件
             entry.file(function(file) { //获取文件数据对象
                  var fileReader = new plus.io.FileReader(); // 文件系统中的读取文件对象,用于获取文件的内容
    
                  fileReader.readAsDataURL(file); //以URL编码格式读取文件数据内容
                  fileReader.onloadend = function(evt) { //读取文件成功完成的回调函数
    
                  let base64 = evt.target.result; //拿到base64
                  that.$api.mainApi.uploadImageBase64({
                       base64Data: base64
                  }).then(res => {
                       if (res.data.code == 0) {
                           let url = that.$imgBaseUrl + res.data.data;
                           if (that.count == 1) {
                               that.$set(that.imgUrls, '0', url);
                           } else {
                               that.imgUrls.push(url);
                           }
    
                           if (num == tempFilePaths.length - 1) {
                               let data = {
                                 comName: that.comName,
                                  value: {
                                    imgSubType: that.baseData.subType,
                                    value: that.imgUrls
                                 }
                              }
                              that.$emit("sendData", data);
                              return
                           } else {
                               //利用递归循环来实现多张图片压缩
                               that.appCompressImg(num + 1, tempFilePaths)
                           }
                       } else {
                           uni.showToast({
                               title: '图片上传失败',
                               duration: 2000
                           });
                       }
                   })
    
                }
            })
        })
    
    
    },
    function(error) {
      console.log("Compress error!");
       console.log(JSON.stringify(error));
    }
    );
    },
  • 相关阅读:
    centos crash debug
    go get Unknown SSL protocol error in connection to gopkg.in
    Tensorflow serving with Kubernetes
    Spring 集成 Swagger UI
    Docker Registry V2 Garbage Collection
    Docker Registry V2 with Nginx
    Zabbix磁盘性能监控
    Zabbix CPU utilization监控参数
    Windows挂载Gluster复制卷
    Redis持久化存储(三)
  • 原文地址:https://www.cnblogs.com/siyecao2010/p/14068515.html
Copyright © 2011-2022 走看看