如何使用 filereader 和 xlsx 读取大型 excel 文件的一部分以防止浏览器崩溃答案

【问题标题】：how to read portion of large excel file to prevent browser crashing using filereader and xlsx如何使用 filereader 和 xlsx 读取大型 excel 文件的一部分以防止浏览器崩溃
【发布时间】：2020-06-18 20:31:04
【问题描述】：

我可以使用下面的代码和 FileReader 和 xlsx 包在前端读取/解析 excel 文件。但是，对于非常大的文件，这会使浏览器崩溃。我只需要阅读前几行，我怎样才能做到这一点？

工作代码

const xlsxParse = (file) => {
    var reader = new FileReader();
    reader.onload = function (e) {
        var data = e.target.result;
        let readedData = XLSX.read(data, { type: 'binary' });
        const wsname = readedData.SheetNames[0];
        const ws = readedData.Sheets[wsname];

        /* Convert array to json*/
        const dataParse = XLSX.utils.sheet_to_json(ws, { header: 1 });
    };
    reader.readAsBinaryString(file)
}

我尝试阅读前几行。不工作

const xlsxParse = (file) => {
    var reader = new FileReader();
    reader.onprogress = (e) => {
        var data = e.target.result;
        let readedData = XLSX.read(data, { type: 'binary' });
        if (readedData) {
            const wsname = readedData.SheetNames[0];
            const ws = readedData.Sheets[wsname];

            /* Convert array to json*/
            const dataParse = XLSX.utils.sheet_to_json(ws, { header: 1 });
            console.log('dataParse', dataParse)
            if (dataParse.length > 3) {
                reader.abort()
            }
        }
    reader.readAsBinaryString(file)
}

谢谢

【问题讨论】：

我建议在将文件读入内存之前调整其大小。进一步阅读：Accessing partial results of a FileReader in Firefox
在 exceljs 中看到了一些新的东西——异步迭代器。你必须改用它。

标签： javascript excel reactjs xlsx filereader

【解决方案1】：

这可以帮助你。基本上，sheetRows 代表读取前 n 行：

handleFile = (file /*:File*/) => {
    /* Boilerplate to set up FileReader */
    const reader = new FileReader();
    const rABS = !!reader.readAsBinaryString;
    reader.onload = e => {
      /* Parse data */
      const bstr = e.target.result;
      const wb = XLSX.read(bstr, { type: "binary", sheetRows: 100});
      /* Get first worksheet */
      const wsname = wb.SheetNames[0];
      const ws = wb.Sheets[wsname];
      /* Convert array of arrays */
      const data = XLSX.utils.sheet_to_json(ws);
      const tableColumns = Object.keys(data[0]);
      console.log('data', data);
    };
    if (rABS) reader.readAsBinaryString(file);
    else reader.readAsArrayBuffer(file);
};

【讨论】：