shuju_ui/test/_common/lib/uniImgUtils.js

/**
 * @description 图片处理方法
 * */
export default {


    /**
     *  @description 获取图片信息
     *  @param {string} src 地址
     *  @return {number}
     * */
    getImageInfo(src) {
        return new Promise((resolve, reject) => {
            if (!src) {
                reject('图片地址不能为空！');
            }

            uni.getImageInfo({
                src,
                success(res) {
                    // #ifdef  MP-ALIPAY
                    res.errMsg = 'getImageInfo:ok';//支付宝小程序直接 返回图片信息 没有 ‘getImageInfo:ok’
                    // #endif
                    if (res.errMsg === 'getImageInfo:ok') {
                        resolve(res);
                    } else {
                        reject('获取图片信息失败！');
                    }
                },
                fail(err) {
                    reject('调取获取图片接口失败!');
                }

            });
        });
    },
    /*选取图片*/
    chooseImage({count = 9, sizeType = ['original', 'compressed'], sourceType = ['album', 'camera']}
                    = {count: 9, sizeType: ['original', 'compressed'], sourceType: ['album', 'camera']}) {
        return new Promise((resolve, reject) => {


            uni.chooseImage({
                count,
                sizeType,
                sourceType,
                success(res) {
                    console.log(res)
                    if (res.errMsg === 'chooseImage:ok') {
                        resolve(res.tempFilePaths);
                    } else {
                        reject('选取图片失败');
                    }
                },
                fail(err) {

                    console.log('error',err)
                    reject('取消选取图片');
                }
            });
        });
    },


    /*图片预览
    * path 图片下标 或路径
    * imgs 图片集合
    * */
    previewImage(path, imgs) {
        uni.previewImage({
            current: path,
            urls: imgs
        });
    },
    /*压缩图片*/
    /*图片转base64*/
    /*图片转本地临时路径blob*/
    img2blob() {

    }
    /*图片截取*/

    /*图片转base64*/
    , img2base64(path) {

        return new Promise(((resolve, reject) => {
            if (path.includes(';base64,')) {

                resolve(path)
                return;
            }

            // #ifdef H5
            window.URL = window.URL || window.webkitURL;
            var xhr = new XMLHttpRequest();
            xhr.open("get", path, true);
            // 至关重要
            xhr.responseType = "blob";
            xhr.onload = function () {
                if (this.status == 200) {
                    //得到一个blob对象
                    var blob = this.response;
                    console.log("blob", blob)
                    // 至关重要
                    let oFileReader = new FileReader();
                    oFileReader.onloadend = function (e) {
                        let base64 = e.target.result;

                        resolve(base64)
                    };
                    oFileReader.readAsDataURL(blob);
                }
            }
            xhr.send();
            // #endif
            // #ifdef MP-WEIXIN
            uni.getFileSystemManager().readFile({
                filePath: path,
                encoding: 'base64',
                success: function (data) {
                    let path = 'data:image/jpeg;base64,' + data.data;

                    resolve(path)
                },
                fail() {
                    reject('图片转base64失败')
                }
            });
            // #endif
            // #ifdef APP-PLUS
            plus.io.resolveLocalFileSystemURL(path,  (entry) =>{
                entry.file( (e)=> {
                    let fileReader = new plus.io.FileReader();
                    fileReader.onload = function(r){

                        resolve(r.target.result)
                    }
                    fileReader.readAsDataURL(e)
                })
            })
            // #endif


        }))

    },
    /**
     * @description 缩放图片
     * @param img_size {number} 原图大小
     * @param img_width {number} 原图宽度
     * @param img_height {number} 原图高度
     * @param img_zoom_size {number} 缩放后的图大小 kb
     * @param max_width_or_height {number} 缩放后的最大高
     * @return re {object} 返回图片的尺寸信息
     * */
    imgZoom({img_size, img_width, img_height, img_zoom_size, max_width_or_height}) {

        let re = {width: img_width, height: img_height};

        if (img_zoom_size) {
            /*如果需要压缩的大小大于原大小则不处理*/
            if (img_zoom_size >= img_size) {
                return re;
            }
            /*压缩倍数*/
            let beis = img_size / img_zoom_size;
            /*根据压缩设置压缩宽高*/

            re.width = Math.ceil(img_width / beis);
            re.height = Math.ceil(img_height / beis);
        } else if (max_width_or_height) {

            let max_size = Math.max(img_width, img_height);
            if (max_width_or_height >= max_size) {
                return re;
            }
            /*压缩倍数*/
            let beis = max_size / max_width_or_height;
            re.width = Math.ceil(img_width / beis);
            re.height = Math.ceil(img_height / beis);

        }


        return re;


    },
    base642Blob(dataURI) {
        var mimeString = dataURI.split(',')[0].split(':')[1].split(';')[0]; // mime类型
        var byteString = atob(dataURI.split(',')[1]); //base64 解码
        var arrayBuffer = new ArrayBuffer(byteString.length); //创建缓冲数组
        var intArray = new Uint8Array(arrayBuffer); //创建视图

        for (var i = 0; i < byteString.length; i++) {
            intArray[i] = byteString.charCodeAt(i);
        }
        return new Blob([intArray], {type: mimeString});
    },

    /*压缩图片指定大小*/
    compressImg(url, canvas_id, width = 100, height = 100, self) {





        return new Promise((resolve, reject) => {
            /*加上延迟 处理h5 防止为改变dome 大小就开始绘制 会出现图片显示不完整*/
            setTimeout(()=>{
                const ctx = uni.createCanvasContext(canvas_id, self);
                console.log(ctx, url, canvas_id, width, height, self)
                ctx.setFillStyle('#fff')
                ctx.fillRect(0, 0, width, height)
                ctx.drawImage(url, 0, 0, width, height );
                ctx.draw(false, () => {
                    setTimeout(() => {

                        uni.canvasToTempFilePath({
                            x:0,
                            y:0,
                            canvasId: canvas_id,
                            width: width,
                            height: height,
                            destWidth: width,
                            destHeight: height,
                            success: (res) => {

                                // #ifdef H5
                                // document.querySelector('canvas').toBlob( (fileSrc)=> {
                                //     console.log(888,fileSrc)
                                //     let imgSrc = window.URL.createObjectURL(fileSrc)
                                //     resolve(imgSrc)
                                //
                                // })
                                resolve(res.tempFilePath)
                                // resolve(URL.createObjectURL(this.base642Blob(res.tempFilePath)))
                                // #endif
                                // #ifndef H5
                                resolve(res.tempFilePath)
                                // #endif


                            },
                            fail: (err) => {
                                console.log(err)
                            }
                        }, self)
                    }, 500)
                })
            },500)


        })


    }
};