大文件变量是 file/blob 只读引用;分片用 slice() 截取字节,推荐 1mb;须用 filereader+uint8array+textdecoder 流式解码防乱码;按需行缓冲处理换行符;串行调度、断点续传、超时重试保障稳定。

大文件变量在前端通常指 File 或 Blob 对象,它本身不存储内容,只是浏览器对文件的只读引用。所谓“数组分片拷贝”,本质是利用 ArrayBuffer、Uint8Array 和 Blob.slice() 在字节层面对数据做可控截取,再配合流式解码或缓冲拼接,实现安全、低内存、可中断的读取管理。
用 slice() 生成字节级 Blob 分片
File 继承自 Blob,支持原生 .slice(start, end) 方法,单位是字节(不是字符或行)。这是所有分片操作的起点:
- 起始偏移
start和结束位置end必须为整数,且end ≤ file.size - 推荐分片大小为
1024 * 1024(1MB),平衡请求频次与内存压力 - 不能用
file.slice(0, 100)后直接readAsText()——UTF-8 多字节字符可能被截断,导致乱码或解码失败
用 FileReader + Uint8Array + TextDecoder 流式解码
避免一次性加载全部内容,也不依赖易出错的字符串拼接。核心是把原始字节交给 TextDecoder 流式处理:
- 创建
new TextDecoder('utf-8', { stream: true }),启用流模式 - 每次
FileReader读完一个Blob分片,得到ArrayBuffer,转为Uint8Array - 调用
decoder.decode(uint8, { stream: true })累加结果,末尾必须补一次decoder.decode()(无参数)收尾缓冲区 - 这样能自动处理跨分片的 UTF-8 字节边界,比如一个汉字被切在两片之间,也能正确还原
按需构建行缓冲以支持日志/CSV 场景
如果业务需要逐行处理(如解析日志、CSV),不能假设分片边界对齐换行符。必须引入行缓冲逻辑:
- 维护一个字符串变量
buffer,用于暂存未闭合的行(即末尾无\n或\r\n的片段) - 每次解码后,将新内容追加到
buffer,再用buffer.split(/\r\n|\n/)提取完整行 - 保留最后一个不带换行符的子串作为下一轮的前缀
- 注意:Windows 换行符是
\r\n,正则比单纯split('\n')更鲁棒
控制读取节奏与错误恢复
分片读取不是并发发起一堆请求,而是串行调度、可暂停、可重试:
- 用递归函数或
async/await链控制每次只读一片,读完再触发下一片,避免堆栈溢出或内存堆积 - 记录当前
offset和已成功读取的分片数,异常中断后可从断点继续 - 对每片设置超时(如 30s),
FileReader无原生超时,可用Promise.race()包裹 - 读取失败时,跳过该片或降级为更小分片重试,避免整个流程卡死










