uniapp app上传图片并设置超过10m进行图片压缩

组件页面

<template>
    <view class="upload-wrapper">
        <view v-if="pictureUrl.length">
            <view class="preview" v-for="(item,index) in pictureUrl" :key='index' >
                <view >
                    
                </view>
                <image  :src="`${host}${item.accessFilePath}`"  mode="" v-if="item.accessFilePath">
                    
                </image>
                <image :src="`${host}${item}`" mode="" v-else></image>
                
                <view class="delete" @tap="deleteImg(index)">
                </view>
            </view>
        </view>
        <view class="img-wraper" v-if="!(pictureUrl.length ==6)" @tap="choosePicture">
            <image :src="image" mode=""></image>
        </view>
    </view>
</template>

点击添加图片

choosePicture() {
                const that = this;
                const value = getAuthorization();   //此方法是获取token的方法，按照自己的需求替换
                let Authorization = '';
                if (value) {
                    Authorization = value
                }
                uni.chooseImage({
                    count: 1, //图库里只能选择一张
                    sourceType: ['album','camera'], //可以使用相册或者是照相机
                    success: (chooseImageRes) => {
                        const tempFilePaths = chooseImageRes.tempFilePaths;
                        that.src = tempFilePaths[0]   //上传图片的路径，如后续有用可留存
                        const name = tempFilePaths[0].split('/').pop()
                        let imgLength = chooseImageRes.tempFilePaths.length
                        if(chooseImageRes.tempFiles[0].size > 10485760){     //判断是否大于10M   单位是大写B
                            uni.showToast({
                                title: '图片大于10MB无法上传',
                                icon: 'none',
                            })
                            return
                        }
                        let arr=0
                        chooseImageRes.tempFiles.forEach((item,index)=>{   //这里我之前的需求是一次可以选择多张，然后把这些都循环成一个数组，后来改了只能选一张，如果需求需要可留存
                            
                            arr +=item.size
                            
                        })
                        if(arr/1024>500){  //判断是否大于500kb  大于500Kb的图片才进行压缩
                            let promise = new Promise(function(resolve, reject) {
                                    chooseImageRes.tempFilePaths.map((value, index) => {
                                        uni.compressImage({
                                            src: value,
                                            height:"50%",
                                            width:"50%",
                                            quality:1,
                                            success: (res) => {
                                                   uni.getFileInfo({ //可以看压缩后的大小留着
                                                       filePath:res.tempFilePath,
                                                       success:(item)=> {
                                                       }
                                                   })
                                                that.compressedImgList.push(res.tempFilePath);
                                                if (index == imgLength - 1) {
                                                    resolve(that.compressedImgList);
                                                }
                                            },
                                            fail: (err) => {
                                                reject(err)
                                            }
                                        })
                                    })
                                })
                                promise.then((res)=>{
                                    uni.uploadFile({
                                        url: `${host}/zhyl/oss/uploadWatermark/jggl/repairPic`, //仅为示例，非真实的接口地址
                                        filePath: res[0], //这个就是地址 压缩前后的地址 that.compressedImgList.push这个是数组地址多个的
                                        name:'file',
                                        // fileName:name,
                                        header: {
                                            "Authorization": getAuthorization()
                                        },
                                        success: (uploadFileRes) => {
                                            if(uploadFileRes.statusCode==200){
                                                const data = JSON.parse(uploadFileRes.data)
                                                let dd=JSON.parse(uploadFileRes.data)
                                                that.pictureUrl.push(dd.data[0].accessFilePath)
                                                that.$emit('uploadImage',dd.data[0])
                                            }
                                        },
                                        fail:(res)=>{
                                            console.log(res);
                                        }
                                    });
                                })
                        }else{
                            that.compressedImgList= chooseImageRes.tempFilePaths  //如果不大于500那就是选择时候的图片地址这是个数组
                            uni.uploadFile({
                                url: `${host}/zhyl/oss/uploadWatermark/jggl/repairPic`, //仅为示例，非真实的接口地址
                                filePath:chooseImageRes.tempFilePaths[0] , //这个就是地址 压缩前后的地址 that.compressedImgList.push这个是数组地址多个的
                                name:'file',
                                header: {
                                    "Authorization": getAuthorization()
                                },
                                success: (uploadFileRes) => {
                                    
                                    if(uploadFileRes.statusCode==200){
                                        const data = JSON.parse(uploadFileRes.data)
                                        let dd=JSON.parse(uploadFileRes.data)
                                        that.pictureUrl.push(dd.data[0].accessFilePath)
                                        that.$emit('uploadImage',dd.data[0])
                                    }
                                },
                                fail:(res)=>{
                                    console.log(res);
                                }
                            });
                        }
                    
                            
                        
                    
                        
                        
                    }
                });
            },