一、遇到的问题
开发过程中,使用uni.uploadFile上传多个文件时,在浏览器上运行能上传成功,真机运行时死活没反应
于是就同后端小伙伴一起找问题,找啊找,找啊找,终于解决了
真的太坑*(真的想爆粗口,啊啊啊啊啊啊啊啊啊🤬)了
二、一定要仔细阅读文档
文档地址:uniapp.dcloud.net.cn/api/request…
写这篇文章时才发现文档上写的清清楚楚,明明白白的😂
参数说明:
一定要注意这个参数!!!
三、具体实现
1、前端
uni.showLoading({
title: '上传中'
})
let temp = []
fileList.forEach((file, index) => {
temp.push({
// name和uri的传参是重点,一定要注意!!!
name: 'files' + index,
file: file,
uri: file.url
})
})
batchUpload(temp).then(res => {
console.log('上传成功', res)
}).finally(_ => {
uni.hideLoading()
})
/**
* 上传多个文件
*/
export function batchUpload(files) {
return uploadFile({
url: `${fsPrefix}/obsFileInfo/appBatchUpload`,
files
})
}
// files和filePath选其一
export const uploadFile = ({
url = '',
files = [],
filePath = '',
name = 'file',
formData = {},
}) => {
let apiUrl = config.baseUrl + url
let header = {}
if (getStorage('token')) {
header.Authorization = getToken()
}
return new Promise((resolve, reject) => {
uni.uploadFile({
header,
url: apiUrl,
files,
filePath,
name,
formData,
success: (uploadFileRes) => {
successHandle(uploadFileRes, resolve, reject, 'uploadFile')
},
fail: uploadFileErr => {
uni.showToast({
icon: 'none',
title: '请求接口失败'
})
reject(uploadFileErr)
}
})
})
}
// 接口成功处理
const successHandle = (res, resolve, reject, type) => {
let {
statusCode,
data
} = res
if (type === 'uploadFile') {
data = JSON.parse(data)
}
if (statusCode === 200) {
if (data.status === 2) {
// 业务数据被删除了
resolve(data)
} else if (data.status === 0) {
// 返回正常
resolve(data.data)
} else {
// 返回异常
data.message && uni.showToast({
icon: 'none',
title: data.message
})
reject(data)
}
} else {
if (statusCode === 401) {
// 跳转到登录页面
removeStoragePart()
uni.reLaunch({
url: '/pages/login/login'
})
uni.showToast({
icon: 'none',
// title: data.message
title: '该用户已在其他端登录系统,请重新登录。'
})
}
reject(data)
}
}