使用 Javascript FileReader 处理大文件

Question

我在使用 Javascript FileRead 尝试读取大文件时遇到问题。

例如，我有一个 200mb 的文本文件，每次我读取此文件时，代码都会停止工作。

可以读取文本文件，但例如只能读取前 10 行或在 10mb 后停止读取？

这是我的代码：

var file = form.getEl().down('input[type=file]').dom.files[0];
var reader = new FileReader();

reader.onload = (function(theFile) {
                return function(e) {
                    data = e.target.result;
                    form.displayedData=data;
                };
            })(file);

reader.readAsText(file);

e.target.result

始终拥有文件的全部数据。

我在这里能做什么？

谢谢

Answer 1

这只会读取前 10 mb:

var file = form.getEl().down('input[type=file]').dom.files[0];
var reader = new FileReader();

reader.onload = function(e) {
    var data = e.target.result;
    form.displayedData = data;
};

reader.readAsText(file.slice(0, 10 * 1024 * 1024));

Answer 2

要仅读取大文件的前 10 行或最多 10MB，您可以使用 FileReader 和 Blob.slice 分块读取文件。

var file = document.getElementById('fileInput').files[0], reader = new FileReader();
var maxLines = 10, maxSize = 10 * 1024 * 1024, offset = 0, chunkSize = 1024 * 1024, lines = [];

reader.onload = function(e) {
    lines = lines.concat(e.target.result.split(/\r?\n/));
    if (lines.length >= maxLines || offset >= maxSize) 
        form.displayedData = lines.slice(0, maxLines).join('\n');
    else 
        readNextChunk();
};

function readNextChunk() {
    if (offset < file.size && offset < maxSize) {
        reader.readAsText(file.slice(offset, offset + chunkSize));
        offset += chunkSize;
    }
}

readNextChunk();