uni-app uni.uploadFile APP批量上传只成功了1张图片,同样的代码H5批量上传是正常的
uni-app uni.uploadFile APP批量上传只成功了1张图片,同样的代码H5批量上传是正常的
开发环境 | 版本号 | 项目创建方式 |
---|---|---|
Windows | Windows 10 专业版 20H2 | HBuilderX |
操作步骤:
uni.uploadFile({
url,
files: this.upload_files,
formData: {
‘tid’: this.tid
},
success: (res) => {
console.log(res);
}
# 预期结果:
像H5一样,可以通过files字段批量上传图片
# 实际结果:
files 参数只写了uri,多图上传可以成功1张,如果给name填不同值则1张也不会成功
# bug描述:
uni.uploadFile APP批量上传只成功了1张图片,同样的代码H5批量上传是正常的
打印this.upload_files; files数组中name是不是相同了
files只有uri,没写name。如果给name写了不同值,1张也传不上去
看下官方文档
官方文档Tip跟没说一样,只是可能,没说解决方法,name已经改为不同值了,就一张也传不成功了
回复 开心团子: 我之前按他需求多张是正常的
回复 开心团子: 你现在是如何解决的
回复 开心团子: 你现在解决没
现在如何解决啊
请问你解决了吗
回复 31231312: 没有解决
我也遇到这个问题了,批量上传文件,安卓端只能收到一个文件,H5端是正常的,不知道咋办。也没人回复。
在uni-app中处理文件上传时,确实可能会遇到一些平台差异性问题,特别是在APP和H5之间。针对你提到的uni.uploadFile
在APP中批量上传只成功了一张图片的问题,我们可以尝试通过以下方式优化代码,以确保批量上传能够正常进行。这里提供一个较为完整的示例代码,用于展示如何在uni-app中实现批量图片上传。
首先,确保你的前端代码能够正确获取到所有需要上传的图片文件列表。然后,使用Promise.all
来处理并发上传,这样可以更好地管理异步操作。
// 假设我们有一个图片文件列表files
const files = [...]; // 这里应该是你通过文件选择器获得的文件列表
// 定义一个上传文件的函数
function uploadFile(filePath) {
return new Promise((resolve, reject) => {
uni.uploadFile({
url: 'https://your-server-upload-url.com/upload', // 替换为你的上传接口
filePath: filePath,
name: 'file',
formData: {
user: 'test'
},
success: (uploadFileRes) => {
resolve(uploadFileRes);
},
fail: (err) => {
reject(err);
}
});
});
}
// 批量上传文件
async function batchUploadFiles(files) {
try {
const uploadResults = await Promise.all(files.map(file => uploadFile(file.path)));
console.log('All files uploaded successfully:', uploadResults);
} catch (error) {
console.error('Error during batch upload:', error);
}
}
// 调用批量上传函数
batchUploadFiles(files);
在上面的代码中,我们定义了一个uploadFile
函数,该函数返回一个Promise
,用于处理单个文件的上传。然后,我们使用Promise.all
来并发地上传所有文件,这样可以确保所有文件都尝试上传,并且在全部完成后处理结果。
需要注意的是,如果你的APP在上传过程中遇到了权限问题或网络问题,可能会导致上传失败。确保你的APP已经请求并获得了必要的存储和网络权限。此外,检查服务器端的处理逻辑,确保它能够正确处理批量上传的请求。
如果问题依然存在,你可能需要检查以下几个方面:
- 确保每个文件的路径都是正确的。
- 检查APP的网络请求是否被某些策略(如防火墙、代理等)所阻断。
- 查看APP的日志输出,是否有更详细的错误信息可以帮助定位问题。
希望这个示例能够帮助你解决问题!如果还有其他疑问,欢迎继续讨论。