javascript - 逐行读取 FileReader 对象而不将整个文件加载到 RAM 中

标签 javascript html filereader

现在许多浏览器都支持使用 HTML5 的 FileReader 读取本地文件,这为网站打开了大门,这些网站超越了“数据库前端”,进入了脚本,这些脚本可以对本地数据执行一些有用的操作,而无需先将其发送到服务器.

除了上传前预处理图像和视频,FileReader 的一个大型应用程序是将数据从某种磁盘表(CSV、TSV 等)加载到浏览器中进行操作——可能用于在 D3 中绘图或分析.js 或在 WebGL 中创建景观。

问题是,StackOverflow 和其他网站上的大多数示例都使用 FileReader 的 .readAsText() 属性,它会在返回结果之前将整个文件读入 RAM。

javascript: how to parse a FileReader object line by line

要在不将数据加载到 RAM 的情况下读取文件,需要使用 .readAsArrayBuffer(),而这篇 SO 帖子是我能得到的最接近好的答案:

filereader api on big files

但是,它对于那个特定问题来说有点太具体了,老实说,我可以花几天时间尝试使解决方案更通用,但结果却空手而归,因为我不明白 block 大小或为什么使用 Uint8Array。解决更普遍的问题,即使用用户可定义的行分隔符逐行读取文件(最好使用 .split(),因为它也接受正则表达式),然后每行执行一些操作(例如将其打印到console.log) 将是理想的。

最佳答案

我在以下 Gist URL 中创建了一个 LineReader 类。正如我在评论中提到的,使用 LF、CR/LF 和 CR 以外的其他行分隔符是不常见的。因此,我的代码仅将 LF 和 CR/LF 视为行分隔符。

https://gist.github.com/peteroupc/b79a42fffe07c2a87c28

例子:

new LineReader(file).readLines(function(line){
 console.log(line);
});

关于javascript - 逐行读取 FileReader 对象而不将整个文件加载到 RAM 中,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/30440709/

相关文章:

javascript - 文件读取器到字符串

javascript - 即使在输入正确的值后 HTML 表单仍显示错误

javascript - 使用 XMLHttpRequest 在 JS 中写入文件?

javascript - 如何使用 window.open() 下载文件

javascript - 使用 lodash 进行分组

php - HTML、Javascript、PHP 和 Actionscript 全部集成在一个 Eclipse 安装中 (2010)

javascript - 通过压缩大图像来加快网页速度

javascript - 单击时如何在可折叠 div 上同时扩展宽度和高度?

JavaScript FileReader 使用大量内存

Java filereader bufferedreader打印出一定数量的行