uni-app中uni.uploadFile上传文件时，uploadTask.onProgressUpdate监听到的progress（上传进度）会超过100%，导致上传失败

uni-app中uni.uploadFile上传文件时，uploadTask.onProgressUpdate监听到的progress（上传进度）会超过100%，导致上传失败

项目信息 描述
产品分类 uniapp/App
PC开发环境操作系统 Windows
PC开发环境操作系统版本号 win10
HBuilderX类型 正式
HBuilderX版本号 3.99
手机系统 Android
手机系统版本号 Android 10
手机厂商 小米
手机机型 Redmi 9A
页面类型 vue
vue版本 vue2
打包方式 云端
项目创建方式 HBuilderX

示例代码：

const uploadTask = uni.uploadFile({  
    url: 'test.com',//输入你的bucketname.endpoint  
    filePath: tapeUrl,  
    name: 'file',  
    formData: {  
        key: upload_url,  
        policy: Oss.policy, // 输入你获取的的policy  
        OSSAccessKeyId: Oss.OSSAccessKeyId, // 输入你的AccessKeyId  
        success_action_status: '200', // 让服务端返回200,不然，默认会返回204  
        signature: Oss.signature // 输入你获取的的signature  
    },  
    success: res => {  
        if(res.statusCode == '200'){  
            console.log('上传成功');  
            this.upload_request(1, val)  
        }else{  
            console.log('失败');  
        }  
    },  
    fail: (err) => {  
        console.log(err, '失败了');  
        this.upload_request(0, val)  

    }  
});  

uploadTask.onProgressUpdate((res) => {  
    console.log('上传进度' + res.progress);  
    console.log('已经上传的数据长度' + res.totalBytesSent);  
    console.log('预期需要上传的数据总长度' + res.totalBytesExpectedToSend);  

    // 测试条件，取消上传任务。  
    // if (res.progress > 50) {  
    //  uploadTask.abort();  
    // }  
});

操作步骤：

  • 上传文件进度超过100%导致上传失败

预期结果：

  • 进度100% 上传成功

实际结果：

  • 进度超过100% 上传失败

bug描述：

17:24:53.498 上传进度37 at pages/info/info.vue:190
17:24:53.504 已经上传的数据长度10240 at pages/info/info.vue:191
17:24:53.504 预期需要上传的数据总长度27041 at pages/info/info.vue:192
17:24:53.509 上传进度75 at pages/info/info.vue:190
17:24:53.509 已经上传的数据长度20480 at pages/info/info.vue:191
17:24:53.509 预期需要上传的数据总长度27041 at pages/info/info.vue:192
17:24:53.516 上传进度102 at pages/info/info.vue:190
17:24:53.517 已经上传的数据长度27648 at pages/info/info.vue:191
17:24:53.521 预期需要上传的数据总长度27041 at pages/info/info.vue:192
17:24:53.522 上传进度102 at pages/info/info.vue:190
17:24:53.522 已经上传的数据长度27648 at pages/info/info.vue:191
17:24:53.526 预期需要上传的数据总长度27041 at pages/info/info.vue:192
17:24:53.527 [Object] {“errMsg”:“uploadFile:fail undefined”} , 失败了 at pages/info/info.vue:182

上传的文件为什么进度会超过100呢，一超过一百就直接走fail回调，也没有回调信息


更多关于uni-app中uni.uploadFile上传文件时，uploadTask.onProgressUpdate监听到的progress（上传进度）会超过100%，导致上传失败的实战教程也可以访问 https://www.itying.com/category-93-b0.html

1 回复

更多关于uni-app中uni.uploadFile上传文件时，uploadTask.onProgressUpdate监听到的progress（上传进度）会超过100%，导致上传失败的实战教程也可以访问 https://www.itying.com/category-93-b0.html


在 uni-app 中使用 uni.uploadFile 上传文件时，uploadTask.onProgressUpdate 监听到的上传进度（progress）理论上应该不会超过 100%。如果出现进度超过 100% 的情况，可能是以下原因导致的：

1. 服务器响应异常

  • 原因：服务器在处理文件上传时，可能返回了异常响应（如重复上传、文件过大等），导致上传进度计算错误。
  • 解决方法：
    • 检查服务器端的文件上传逻辑，确保正确处理文件上传请求。
    • 在 uni.uploadFile 的 success 回调中，检查服务器返回的数据，确认上传是否成功。

2. 文件大小计算错误

  • 原因：如果在上传过程中，文件大小计算错误（例如文件被重复读取或分片上传逻辑有问题），可能导致进度计算异常。
  • 解决方法：
    • 确保上传文件的 filePath 是正确的，并且文件大小与服务器端一致。
    • 如果是分片上传，检查分片逻辑是否正确。

3. 网络问题

  • 原因：网络不稳定可能导致上传过程中数据包重复发送，进而导致进度计算异常。
  • 解决方法：
    • 检查网络连接是否稳定。
    • 在网络较差的情况下，可以增加重试机制。

4. uni.uploadFile 的 Bug

  • 原因：uni.uploadFile 在某些情况下可能存在 Bug，导致进度计算错误。
  • 解决方法：
    • 确保使用的是最新版本的 uni-app 框架。
    • 如果问题依然存在，可以尝试使用其他上传方式（如 axios 或原生 XMLHttpRequest）。

5. 代码逻辑问题

  • 原因：可能是代码中对 progress 的处理逻辑有问题，例如未正确判断进度的范围。
  • 解决方法：
    • 在 onProgressUpdate 回调中，增加对 progress 的范围判断，例如：
      uploadTask.onProgressUpdate((res) => {
  if (res.progress > 100) {
    console.error('上传进度异常：', res.progress);
    // 处理异常逻辑
  } else {
    console.log('上传进度：', res.progress);
  }
});
回到顶部