JavaScript 中 Generator 怎么实现大文件分片上传的暂停恢复-js教程-PHP中文网

generator 本身不直接处理文件上传，仅提供可暂停、可恢复的函数执行机制；真正实现大文件分片上传的暂停与恢复需结合 generator 控制流程、前端存储（如 indexeddb）记录进度、后端支持断点续传。

javascript 中 generator 怎么实现大文件分片上传的暂停恢复

Generator 本身不直接处理文件上传，它只是提供一种可暂停、可恢复的函数执行机制。真正实现大文件分片上传的暂停与恢复，需要结合 Generator 控制分片流程 + 前端存储（如 IndexedDB 或 localStorage）记录已上传进度 + 后端支持断点续传（如通过分片标识和校验）。Generator 的作用是让上传逻辑更清晰、更可控，而不是替代网络或存储能力。

用 Generator 管理分片上传流程

把整个上传拆成“生成分片 → 逐个上传 → 暂停/恢复”三个阶段，Generator 负责按需产出下一个待上传的分片，便于外部控制节奏。

定义一个 generator 函数，每次 yield 一个分片 Blob 和元信息（如索引、hash、offset）
调用 next() 触发上传一个分片；调用 throw() 或外部状态控制来暂停
配合闭包或 class 实例保存当前迭代位置，便于恢复时从上次 yield 后继续

保存和恢复上传进度

仅靠 Generator 内部状态无法跨页面刷新保留，必须将关键进度持久化。

Java JDK 25

Java JDK 25 来自 OpenJDK 官方归档，版本为 JDK 25，本条下载地址已指向官方 Windows x64 zip 安装包直链，适合调试旧项目或兼容旧版 Java 运行环境。

下载

每成功上传一个分片，把 分片编号、大小、唯一 hash、服务端返回的确认标识 存入 IndexedDB
上传开始前先查数据库，过滤出已成功上传的分片，跳过重传
恢复时，用已存进度初始化 Generator 的起始 offset，并重建分片迭代器

前后端协同支持断点续传

前端暂停再恢复，后端必须能识别“这个文件的第 X 片是否已收”，否则会重复写或覆盖。

每个分片请求带上 fileId（全局唯一）、chunkIndex、totalChunks、chunkHash
后端收到请求先查该分片是否已存在，存在则直接返回 success，不重复存储
所有分片上传完成后，前端发起合并请求（merge），后端按序拼接并校验完整文件 hash

简易代码结构示意

不是完整可运行代码，而是体现核心协作关系：

function* createChunkIterator(file, chunkSize = 1024 * 1024) {
  let start = 0;
  while (start class ResumableUploader {
constructor(file) {
this.file = file;
this.iterator = createChunkIterator(file);
this.progress = await this.loadProgress(); // 从 IndexedDB 读
}<p>async uploadNext() {
const { value, done } = this.iterator.next();
if (done) return { done: true };</p><pre class="brush:php;toolbar:false;">if (this.progress.has(value.index)) {
  return { skipped: true, index: value.index };
}

await this.uploadChunk(value);
await this.saveProgress(value.index); // 存入 IndexedDB
return { uploaded: true, index: value.index };

} }

Java免费学习笔记：立即使用
解锁 Java 大师之旅：从入门到精通的终极指南