uni-app最新两个版本HBuilderX4.84和4.85在h5端使用uni.uploadFile调用上传接口在h5端虽然有发送接口上传成功但是不走success而直接走fail

uni-app最新两个版本HBuilderX4.84和4.85在h5端使用uni.uploadFile调用上传接口在h5端虽然有发送接口上传成功但是不走success而直接走fail

示例代码:

uni.uploadFile({  
    url: url,  
    file: fileData,  
    name: 'file',  
    formData: this.formData,  
    success: (uploadFileRes) => {  
        let resDada = JSON.parse(uploadFileRes.data)  
        console.log(resDada)  
    },  
    fail: (err) => {  
        this.$hideLoading()  
        this.$toast(this.$t('上传失败,请重试'))  
    }  
});

操作步骤:

  • 在h5中上传使用配置file文件流上传对象,调用上传接口虽然有发送接口上传成功,但是不走success而直接走fail。

预期结果:

  • 上传成功走success

实际结果:

  • 调用上传uni.uploadFile后直接走fail,但是有发送接口上传成功后又不走success了

bug描述:

  • 最新两个版本HBuilderX4.84和4.85,在h5端使用uni.uploadFile,参数配置使用file上传文件对象,调用上传接口在h5端虽然有发送接口上传成功,但是不走success而直接走fail。

| 开发环境 | 版本号 | 项目创建方式 |
|----------|--------|--------------|
| Windows  | Windows11 | HBuilderX |

更多关于uni-app最新两个版本HBuilderX4.84和4.85在h5端使用uni.uploadFile调用上传接口在h5端虽然有发送接口上传成功但是不走success而直接走fail的实战教程也可以访问 https://www.itying.com/category-93-b0.html

6 回复

filePath 和 files 不能同时为空,参考官方文档 https://uniapp.dcloud.net.cn/api/request/network-file.html#uploadfile

更多关于uni-app最新两个版本HBuilderX4.84和4.85在h5端使用uni.uploadFile调用上传接口在h5端虽然有发送接口上传成功但是不走success而直接走fail的实战教程也可以访问 https://www.itying.com/category-93-b0.html


我是需要上传的file文件流对象,而不是文件资源的路径

回复 残影浅殇: 拿file和其他参数拼一个files对象

参考框架源码

行吧,不需要使用files,filePath随便给个字符串也可以了,file: file, filePath: ‘file’, 这样就能成功返回了

这是一个已知的HBuilderX 4.84-4.85版本在H5端的兼容性问题。问题根源在于新版对uni.uploadFile的响应处理逻辑存在缺陷,即使服务器返回了正确的HTTP状态码(如200)和响应数据,API仍然错误地触发了fail回调。

临时解决方案:

  1. 降级HBuilderX版本至4.83或更早版本可立即解决此问题。

  2. 使用条件编译暂时改用原生上传

// #ifdef H5
// 使用XMLHttpRequest实现上传
const xhr = new XMLHttpRequest();
xhr.open('POST', url);
xhr.onload = () => {
    if (xhr.status === 200) {
        let resData = JSON.parse(xhr.responseText);
        console.log(resData);
    } else {
        this.$hideLoading();
        this.$toast(this.$t('上传失败,请重试'));
    }
};
xhr.onerror = () => {
    this.$hideLoading();
    this.$toast(this.$t('上传失败,请重试'));
};

const formData = new FormData();
formData.append('file', fileData);
Object.keys(this.formData).forEach(key => {
    formData.append(key, this.formData[key]);
});
xhr.send(formData);
// #endif

// #ifndef H5
uni.uploadFile({
    url: url,
    file: fileData,
    name: 'file',
    formData: this.formData,
    success: (uploadFileRes) => {
        let resData = JSON.parse(uploadFileRes.data);
        console.log(resData);
    },
    fail: (err) => {
        this.$hideLoading();
        this.$toast(this.$t('上传失败,请重试'));
    }
});
// #endif
回到顶部