UniApp文件上传的核心在于选择文件（uni.chooseFile）和发送请求（uni.uploadFile）。开发者需充分理解文件上传流程，包括选择文件、发送请求、接收后端响应。进阶考虑：大文件分片上传、错误处理、进度条展示；性能优化：减少请求次数、使用快速网络、压缩文件；踩坑指南：文件类型/大小限制、网络问题、token失效等。
UniApp文件上传：不止是简单的代码堆砌
很多开发者在UniApp里折腾文件上传，最后搞得一团糟。为啥？因为他们只看到了表面，没看到背后的坑。这篇文章，咱们就来扒一扒UniApp文件上传的那些事儿，让你不再被它折磨。读完后，你不仅能轻松实现文件上传，还能理解其背后的原理，写出优雅高效的代码。
先说结论：UniApp文件上传没啥高深的，核心是选择文件、发送请求，但魔鬼藏在细节里。
基础知识：你得懂这些
UniApp本身不直接处理文件上传，它需要借助后端接口。所以，你需要一个后端（比如Node.js, Python Flask/Django, Java Spring等等），负责接收文件并存储。前端UniApp只是负责把文件“递”给后端。 UniApp用的是uni.chooseFile选择文件，uni.uploadFile发送文件。 别小看这俩API，它们的参数设置和返回结果的处理，决定了你的代码能不能优雅运行。
核心：文件上传的来龙去脉
uni.chooseFile允许用户选择本地文件，返回一个包含文件路径和一些其他信息的数组。关键是tempFilePaths，它包含了临时文件路径。记住，这只是临时路径，文件真正上传成功前，它随时可能消失。
然后，uni.uploadFile拿着这些临时文件路径，向后端发送POST请求。关键参数是filePath（就是tempFilePaths[0]），url（后端接口地址），name（后端接收文件参数名）。 别忘了header，很多后端接口需要你带上身份验证信息。
一个简单的例子，让你感受一下：
部分功能简介：商品收藏夹功能热门商品最新商品分级价格功能自选风格打印结算页面内部短信箱商品评论增加上一商品，下一商品功能增强商家提示功能友情链接用户在线统计用户来访统计用户来访信息用户积分功能广告设置用户组分类邮件系统后台实现更新用户数据系统图片设置模板管理CSS风格管理申诉内容过滤功能用户注册过滤特征字符IP库管理及来访限制及管理压缩，恢复，备份数据库功能上传文件管理商品类别管理商品添加/修改/
uni.chooseFile({
count: 1,
type: 'file',
success: (res) => {
let filePath = res.tempFilePaths[0];
uni.uploadFile({
url: '你的后端接口地址',
filePath: filePath,
name: 'file',
header: {
'Authorization': 'Bearer ' + uni.getStorageSync('token') // 你的token获取方式
},
success: (res) => {
console.log('上传成功', JSON.parse(res.data)); //后端返回结果处理
},
fail: (err) => {
console.error('上传失败', err);
}
});
}
});进阶：处理大文件和错误
上面的代码太简单了，实际应用中，你需要考虑很多问题。比如，大文件上传，你需要分片上传，避免请求超时。 错误处理也至关重要，网络请求可能失败，后端可能返回错误码，你都需要优雅地处理，给用户友好的提示。 别忘了进度条，用户需要知道上传进度。
// 模拟分片上传 (简化版，实际应用中需要更复杂的逻辑)
function uploadFileChunk(filePath, chunkSize, start, end, uploadUrl, resolve, reject) {
const blob = new Blob([new Uint8Array(filePath.slice(start, end))]);
const formData = new FormData();
formData.append('file', blob, 'file.txt'); // 文件名需要根据实际情况修改
uni.request({
url: uploadUrl,
method: 'POST',
data: formData,
success: (res) => {
resolve(res);
},
fail: (err) => {
reject(err);
}
});
}性能优化：别让用户等太久
性能优化是永恒的主题。 减少请求次数，使用更快的网络，压缩文件大小，都可以提升上传速度。 合理的错误处理和用户反馈，也能提升用户体验。
踩坑指南：别让这些坑绊倒你
- 文件类型限制: 后端通常会限制上传文件类型，前端需要校验。
- 文件大小限制: 同样，后端也会限制文件大小，前端也需要校验，并提示用户。
- 网络问题: 网络不稳定会导致上传失败，需要重试机制。
- token失效: 如果你的后端需要token验证，token失效会导致上传失败，需要重新登录。
记住，UniApp只是工具，理解原理，才能写出高质量的代码。 别只顾着复制粘贴，多思考，多实践，才能成为真正的编程大牛。
