使用uni-app的uni.chooseImage选择图片在离线状态下手机无网络的情况下卡死

使用uni-app的uni.chooseImage选择图片在离线状态下手机无网络的情况下卡死

开发环境 版本号 项目创建方式
Windows windows11 HBuilderX

产品分类：uniapp/App

PC开发环境操作系统：Windows

PC开发环境操作系统版本号：windows11

HBuilderX类型：正式

HBuilderX版本号：3.8.7

手机系统：Android

手机系统版本号：Android 12

手机厂商：小米

手机机型：红米 note 11

页面类型：vue

vue版本：vue2

打包方式：云端

项目创建方式：HBuilderX

App下载地址或H5网址：[应用市场 搜索 易软云](//ask.dcloud.net.cn/应用市场 搜索 易软云)

示例代码：

compressImage(src) {
    return new Promise((resolve, reject) => {
        uni.compressImage({
            src: src,
            quality: 30,  // 质量压缩（0-100）
            width: '50%', // 宽度按比例压缩
            success: (res) => resolve(res.tempFilePath),
            fail: reject
        });
    });
},
chooseImg(item){
    uni.chooseImage({
        count: 8,
        sourceType: ['camera'],
        sizeType: ['compressed'],
        sourceType: this.sourceType,
        success: res => {
            console.log(res)
            if (res.errMsg == 'chooseImage:ok') {
                res.tempFilePaths.map(async items => {
                    // #ifdef APP
                    if(items.indexOf(".jpg") !=-1){
                        let compressed = await this.compressImage(items)
                        console.log(compressed)
                        if(compressed){
                            uni.saveFile({
                                tempFilePath: compressed,
                                success:res => {
                                    console.log(res)
                                    var savedFilePath = res.savedFilePath;
                                    item.fldImgList.push(savedFilePath)
                                    if (item.fldImgList.length > 8) {
                                        item.fldImgList = item.fldImgList.slice(0, 8);
                                    }
                                    uni.removeSavedFile({ filePath: items });
                                    uni.removeSavedFile({ filePath: compressed });
                                    isProcessing = false
                                }
                            });
                        }else{
                            uni.saveFile({
                                tempFilePath: items,
                                success:res => {
                                    var savedFilePath = res.savedFilePath;
                                    item.fldImgList.push(savedFilePath)
                                    if (item.fldImgList.length > 8) {
                                        item.fldImgList = item.fldImgList.slice(0, 8);
                                    }
                                    uni.removeSavedFile({ filePath: items });
                                    isProcessing = false
                                }
                            });
                        }
                    }else{
                        uni.saveFile({
                            tempFilePath: items,
                            success:async res => {
                                var savedFilePath = res.savedFilePath;
                                item.fldImgList.push(savedFilePath)
                                if (item.fldImgList.length > 8) {
                                    item.fldImgList = item.fldImgList.slice(0, 8);
                                }
                                uni.removeSavedFile({ filePath: items });
                                isProcessing = false
                            }
                        });
                    }
                    // #endif
                    // #ifdef H5
                    item.fldImgList.push(items);
                    // #endif
                });
            }
        },
        fail:err=> {
            isProcessing = false;
            uni.showToast({
                icon:"none",
                title:"无法获取正确的路劲拍照失败"
            })
        }  
    });
}

操作步骤：

  • 进入工作台
  • 点击 设备任务
  • 已接任务
  • 开始任务
  • 选择 图片

预期结果：

  • 能够正常的拍照显示图片

实际结果：

  • 拍摄多张后无法显示

bug描述：

由于项目上要做离线数据，且离线的数据拍照的数量有点多，可能多达100张+。之前测试了在线拍照还比较流畅，但是在离线状态下自己将手机设置为飞行模式，然后进行拍照发现拍了十多张后就卡死了，自己也做了图片压缩和删除临时图片地址还是不行。

而且发现在线模式下在chooseImage进程compressImage进程saveFile进程中我打出数据log出来很快，但是一断网log就很慢。是否这几个API需要有联网状态下的I/O处理

而且拍照多了直接进入了fail显示

{
    "errMsg": "chooseImage:fail 路径不存在",
    "errCode": 14,
    "code": 14
}

更多关于使用uni-app的uni.chooseImage选择图片在离线状态下手机无网络的情况下卡死的实战教程也可以访问 https://www.itying.com/category-93-b0.html

3 回复

chooseImage不会请求网络，不受网络影响，你单纯用chooseImage这个api在没网情况下有没有问题

更多关于使用uni-app的uni.chooseImage选择图片在离线状态下手机无网络的情况下卡死的实战教程也可以访问 https://www.itying.com/category-93-b0.html


可是 在没有网络的情况下 拍照就是出不来而且拍个几十张就卡死了

这个问题确实与uni-app在离线状态下处理图片选择时的性能瓶颈有关。以下是关键点分析：

  1. 离线状态下卡死的主要原因：
  • 系统相册组件在无网络时可能有额外的检测逻辑
  • 大量图片处理导致内存堆积
  • 连续的文件操作造成I/O阻塞
  1. 针对当前代码的优化建议： (1) 增加错误边界处理：
uni.chooseImage({
    // 现有配置...
    fail: err => {
        console.error('选择图片失败:', err)
        isProcessing = false
        uni.hideLoading()
        uni.showToast({
            title: '拍照失败，请重试',
            icon: 'none'
        })
    }
})

(2) 优化图片处理流程：

  • 限制单次选择的图片数量
  • 添加加载状态防止重复操作
  • 分批处理图片避免内存溢出

  1. 替代方案建议： 对于离线场景下的批量拍照，推荐使用原生相机插件（如uni-app的nativeObj.camera）替代chooseImage，可以避免系统相册组件的网络依赖。

  2. 临时文件处理： 注意removeSavedFile是异步操作，大量删除操作可能导致队列堆积，建议：

// 改用同步删除
plus.io.resolveLocalFileSystemURL(filePath, entry => {
    entry.remove(() => {
        console.log('删除成功')
    })
})
  1. Android特定问题： 在Android 12+设备上，系统对后台进程的资源限制更严格，离线状态下表现会更明显。可以尝试在manifest.json中配置：
"android": {
    "permissions": [
        "<uses-permission android:name=\"android.permission.READ_EXTERNAL_STORAGE\"/>",
        "<uses-permission android:name=\"android.permission.WRITE_EXTERNAL_STORAGE\"/>"
    ]
}
回到顶部