要实现多个文件同时使用uni.uploadFile上传并最后汇总上传结果,可以采用以下步骤:
选择文件:首先使用uni.chooseMedia或uni.chooseImage等API选择需要上传的文件。
创建上传任务:对于选择的每个文件,创建一个uni.uploadFile的上传任务,并将其封装成一个Promise对象。
并行上传:使用Promise.all来并行执行所有的上传任务,这样可以同时上传多个文件。
处理结果:在Promise.all的.then方法中处理所有文件上传成功后的结果,这里可以汇总所有上传文件的结果。
错误处理:在Promise.all的.catch方法中处理上传过程中可能出现的错误。
下面是一个具体的代码示例:
// 选择文件 uni.chooseMedia({ mediaType: ['image'], // 选择图片 sourceType: ['album'], // 从相册选择 success: (res) => { const { tempFiles } = res; // 上传文件 uploadFiles(tempFiles); }, fail: () => { console.log('选择文件失败'); }, }); // 上传文件 const uploadFiles = (files) => { const uploadTasks = files.map((file) => { return new Promise((resolve, reject) => { const uploadTask = uni.uploadFile({ url: 'https://www.xxx.cn/v1/wxInvoice/upload', // 接口地址 filePath: file.tempFilePath, // 临时文件路径 name: 'files[]', // 服务器接收的文件字段名 header: { Authorization: 'Bearer ' + token.value, 'Content-Type': 'multipart/form-data', }, formData: { // 可以在这里添加额外的formData参数 }, success: (res) => { if (res.statusCode === 200) { resolve(res.data); // 解析响应数据 } else { reject(new Error('上传失败')); } }, fail: (err) => { reject(err); }, }); // 监听上传进度 uploadTask.onProgressUpdate((res) => { console.log('上传进度', res.progress); console.log('已经上传的数据长度', res.totalBytesSent); console.log('预期需要上传的数据总长度', res.totalBytesExpectedToSend); }); }); }); // 并行上传所有文件,并处理结果 Promise.all(uploadTasks) .then((results) => { console.log('所有文件上传成功', results); // 这里可以对results进行处理,比如汇总上传结果 }) .catch((err) => { console.log('文件上传失败', err); // 处理上传失败情况 }); };
这段代码首先选择文件,然后为每个文件创建一个上传任务,并使用Promise.all来并行上传所有文件。在上传成功后,可以在.then方法中汇总所有上传结果,在.catch方法中处理错误。这样就能实现多个文件的并行上传,并在最后汇总上传结果。
网友回复