uni-app关于上传接口uni.uploadFile的问题

uni-app关于上传接口uni.uploadFile的问题

开发环境 版本号 项目创建方式
Windows 不清楚 HBuilderX

产品分类：uniapp/App

PC开发环境操作系统：Windows

HBuilderX类型：正式

HBuilderX版本号：3.1.18

手机系统：Android

手机系统版本号：Android 10

手机厂商：小米

手机机型：redmi note 8 pro

页面类型：vue

打包方式：云端

示例代码：

let img=[] let url=“xxxxxxxxxxxxx” uni.uploadFile({ url: url, //仅为示例，非真实的接口地址 files: imgs, header: { “Authorization”: "Bearer " + token }, formData: parme, success: (res) => {


操作步骤：

let img=[]
let url="xxxxxxxxxxxxx"
uni.uploadFile({
url: url, //仅为示例，非真实的接口地址
files: imgs,
header: {
"Authorization": "Bearer " + token
},
formData: parme,
success: (res) => {

预期结果：

上传成功


实际结果：

上传方法没有任何反应，也不执行任何回调

bug描述：

uni.uploadFile多图上传时，如果files对应的值是空数组的话 例如：files:[]，手机上会报错，但是浏览器中是正常的，打开浏览器调试，发现浏览器中多出一个名为file的参数。这个file并不是我写上去的，所有猜想，这可能是浏览器和真机的区别导致的。 但是在线文档中并未提及这一问题， 我的处理方法是在空数组中写入了一个固定的{name:‘file’,uri:’’}对象。入股有上传图片就清除数组重新添加新数据。如果没有图片上传，只上传formdata的话，就让数组中默认有这么个对象。这样就不会报错了


更多关于uni-app关于上传接口uni.uploadFile的问题的实战教程也可以访问 https://www.itying.com/category-93-b0.html

1 回复

更多关于uni-app关于上传接口uni.uploadFile的问题的实战教程也可以访问 https://www.itying.com/category-93-b0.html


从你的描述来看，这是一个典型的uni.uploadFile参数处理问题。你的分析是正确的：在真机环境中，当files参数为空数组时，上传接口无法正常触发回调，而浏览器环境会自动处理这种情况。

核心问题在于uni.uploadFile的files参数在真机运行时的验证机制比浏览器更严格。即使你只需要上传表单数据而不需要上传文件，files数组也不能完全为空。

你的解决方案是合理的：在无文件上传时，给files数组设置一个默认的占位对象{name:'file', uri:''}。这样可以确保接口正常执行，同时空的uri值不会实际产生文件上传。

另一种更简洁的处理方式是在调用前进行条件判断：

let uploadFiles = imgs.length > 0 ? imgs : [{name: 'file', uri: ''}];

uni.uploadFile({
    url: url,
    files: uploadFiles,
    header: {
        "Authorization": "Bearer " + token
    },
    formData: parme,
    success: (res) => {
        // 处理成功回调
    },
    fail: (err) => {
        // 处理失败回调
    }
});
回到顶部