要实现支持进度条回调的大文件分片上传,需将文件切片、并发上传、进度汇总和错误重试封装进promise链,并通过回调实时通知进度。分片进度由xmlhttprequest.upload.onprogress提供,整体进度按(已传字节数+当前分片已传字节)/总大小计算;用file.slice()按固定大小切片,维护uploadedbytes累加成功分片长度;并发用promise.allsettled控制(如3个),每个分片promise支持abort和重试;进度回调onprogress(ratio, status)需throttle防卡顿;全流程返回promise,含初始化、分批上传、失败重试、合并提交,支持续传。

要实现支持进度条回调的大文件分片上传,核心是把文件切片、并发上传、进度汇总和错误重试都封装进 Promise 链中,同时通过回调函数实时通知上传进度(包括分片上传进度 + 整体进度)。
1. 分片与整体进度分离计算
单个分片的上传进度由 XMLHttpRequest.upload.onprogress 提供;而整体进度需根据已成功上传的字节数(含当前正在传的分片)除以总文件大小得出。不能只靠“已完成分片数 / 总分片数”,因为分片大小可能不均等(尤其最后一片)。
- 用
File.slice()按固定大小(如 2MB)切片,记录每片起始偏移量和长度 - 维护一个全局已上传字节计数器(
uploadedBytes),每次分片上传成功后累加其长度 - 在每个分片的
onprogress中,计算该分片内进度,并更新整体进度:(uploadedBytes + 已传字节) / totalSize
2. 并发控制 + 顺序保障
并发上传能提速,但必须保证服务端能按序拼接(通常靠分片序号)。前端不强制要求严格顺序上传,但需确保最终所有分片都成功,且上传完成后触发合并请求。
在 Java 中初始化和管理阿里云 SDK客户端。包括单例模式、线程安全、endpoint 与 region 配置、VPC 终端节点、同步与异步等。
- 用
Promise.allSettled()执行一组并发上传 Promise(例如最多 3 个并发) - 每个分片上传返回一个 Promise,内部使用
fetch或XMLHttpRequest,并支持 abort 和重试(如失败重试 2 次) - 上传成功后返回 { index, size },失败则保留错误信息,后续统一处理失败分片
3. 进度回调设计为函数参数
进度回调应接收两个参数:当前整体进度(0–1)、状态描述(如 "uploading", "merging", "success"),便于 UI 灵活响应。
- 定义回调形如
onProgress: (ratio: number, status: string) => void - 在分片上传中调用时传入实时 ratio;上传全部完成但未合并前,可设为 0.95;合并接口返回后才设为 1
- 避免高频触发(如 throttle 到 50ms 一次),防止 UI 卡顿
4. 完整上传流程 Promise 封装
整个函数返回一个 Promise,resolve 时带上传结果(如文件 ID),reject 时带错误详情(含哪些分片失败)。关键点是把异步操作串成可组合、可中断、可监听的链式结构。
- 初始化:校验文件、生成唯一 uploadId、预传元数据(可选)
- 分片循环:用 async/await + for-of 控制并发批次,每批用
Promise.allSettled - 失败重试:对 failed 结果筛选出错误分片,重新发起上传(避免重复传成功的)
- 合并提交:所有分片成功后,调用 merge 接口,等待其完成再 resolve
不复杂但容易忽略:务必在上传前读取 file.size 做总大小基准;服务端需支持接收 chunkIndex、totalChunks、uploadId 等字段;前端需处理网络中断时的续传(记录已传分片列表,下次跳过)。
Java免费学习笔记:立即使用
解锁 Java 大师之旅:从入门到精通的终极指南










