uni-app uni.uploadFile 在 ios18.5 微信版本8.0.60 内置浏览器 safari QQ 浏览器 中上传文件 失败

uni-app uni.uploadFile 在 ios18.5 微信版本8.0.60 内置浏览器 safari QQ 浏览器 中上传文件 失败

开发环境 版本号 项目创建方式
Windows 10 专业版 22H2 HBuilderX
示例代码:


    const uploadTask = uni.uploadFile({  
        url: `${BASE_URL}/${options.fileType === "quick" ? "fileTransfer" : "upload"}`,  
        name: "upload_file_iot",  
        filePath: options.filePath,  
        formData: {  
            file_name: Base64.encode(options.fileName),  
            times: options.type.includes("video") ? "1" : "10",  
            duration: options.type.includes("video") ? "1" : "10"  
        },  
        timeout: 3000000,  
        success: (res) => {  
            console.log("res-----", res);  
            const data = JSON.parse(res.data);  
            if (data.success) {  
                progressHandlers.forEach((func) => func({ progress: 100, totalBytesExpectedToSend: options.fileSize, totalBytesSent: options.fileSize }));  
                options.success && options.success(res);  
            } else {  
                uni.showToast({  
                    title: data.message  
                });  
                options?.fail?.(data.message);  
            }  
        },  
        fail: (err) => {  
            options?.fail?.(err);  
            if (err.errMsg.includes("abort")) {  
                uni.showToast({  
                    title: "上传失败,用户取消上传"  
                });  
                return;  
            }  
            uni.showToast({  
                title: "文件上传失败,请检查网络后重试"  
            });  
        },  
        complete: (data) => {  
            options?.complete?.(data);  
            clearInterval(timeTask);  
            console.log(data);  
        }

操作步骤:

  • uni.chooseFile 选择文件后上传

预期结果:

  • 预期成功上传

实际结果:

  • 上传失败

bug描述:

uni.uploadFile 在 ios18.5 微信版本8.0.60 内置浏览器 、 safari QQ 浏览器 中上传文件 失败 , android 下成功上传、ios 下 百度、uc 成功上传

没有详细报错直接 走fail failMsg: upload falil


更多关于uni-app uni.uploadFile 在 ios18.5 微信版本8.0.60 内置浏览器 safari QQ 浏览器 中上传文件 失败的实战教程也可以访问 https://www.itying.com/category-93-b0.html

4 回复

你可以链接手机调试看一下,成功的网络请求和不成功的网络请求,差别是什么

更多关于uni-app uni.uploadFile 在 ios18.5 微信版本8.0.60 内置浏览器 safari QQ 浏览器 中上传文件 失败的实战教程也可以访问 https://www.itying.com/category-93-b0.html


不成功的网络请求 Request Headers 为空,成功的网络请求正常。

回复 Gongwannan: 你代码中也没有设置 hearder 啊 ,你的请求头是啥?

从问题描述来看,这是一个典型的iOS特定环境下的文件上传兼容性问题。以下是可能的原因和解决方案:

1. 文件路径格式问题 iOS系统对文件路径格式要求更严格,建议使用临时文件路径:

// 在选择文件后处理路径
uni.chooseFile({
  success: (res) => {
    const tempFilePaths = res.tempFilePaths;
    // 使用临时路径上传
    options.filePath = tempFilePaths[0];
  }
});

2. Base64编码问题 iOS对特殊字符处理更敏感,建议对文件名进行URL安全编码:

formData: {
  file_name: encodeURIComponent(options.fileName),
  // 移除Base64.encode,直接使用原文件名或URL编码
}

3. 超时时间设置 当前设置的3000000毫秒(50分钟)过长,建议调整为合理值:

timeout: 60000 // 60秒

4. 网络请求头检查 iOS对请求头验证更严格,可以尝试添加User-Agent:

header: {
  'User-Agent': 'uni-app',
  'Content-Type': 'multipart/form-data'
}

5. 错误信息细化 修改fail回调以获取更详细的错误信息:

fail: (err) => {
  console.error('上传失败详情:', JSON.stringify(err));
  // 其他错误处理逻辑
}
回到顶部