Questions about importing XLSX files into a Workbook

Posted by: achort on 5 May 2023, 5:52 pm EST

  • Posted 5 May 2023, 5:52 pm EST

    Hello, I have a few questions regarding XLSX files in SpreadJS

    1. Does ExcelIO.open [A] support passing a ReadableStream and if so, does that make the process less memory hungry?

      Context: I’m using fetch to download a XLSX file from the server and then passing it to ExcelIO.open but I noticed this means SpreadJS will only start importing once the entire file has been downloaded. This also means the entire file needs to be in memory. I’m Trying to see points of improvements on my process so it takes less time and memory.

    2. I’ve noticed SpreadJS version 16 introduced a new API for importing files (Workbook.import [B]).

      Is this using ExcelIO.open under the hood or is it different?

    3. What is the recommended way of importing XLSX files into SpreadJS?

    Thank you

    [A] https://www.grapecity.com/spreadjs/docs/versions/v14/online/SpreadJS~GC.Spread.Excel.IO~open.html

    [B] https://www.grapecity.com/spreadjs/api/classes/GC.Spread.Sheets.Workbook#import

  • Posted 7 May 2023, 8:45 pm EST - Updated 7 May 2023, 8:45 pm EST

    1. ExcelIO.open [A] has ReadableStream transfer support and takes less memory

    2. SpreadJS supports the ExcelIO module by which you could import/export excel files. Please refer to the following demo which demonstrates the same.

    How can I open my folder in a browser to see a list of my xlsx files,

    You need to use the input element with file type by which you could select any file from the system.

  • Posted 7 May 2023, 8:47 pm EST - Updated 8 May 2023, 12:34 pm EST

  • Posted 8 May 2023, 12:23 am EST

    Thank you for all your answers.

    I just have one follow up regarding ReadableStream support in ExcelIO.open.

    I just tried it and got an error. I’m using v14.1.2. Tried the same with latest (v16.1.0) and got the same error.

    This is basically what I’m doing:

    async function loadUsingExcelIO(spread, url) {
      const excelIo = new GC.Spread.Excel.IO();
      const stream = await fetch(url).then(res => res.body);
      return new Promise((resolve, reject) => {
        excelIo.open(
          stream,
          function (json) {
            spread.fromJSON(json);
            resolve();
          },
          function (e) {
            console.error(e);
            reject(e);
          }
        );
      });
    }

    This is the error message I get when running:

    Uncaught (in promise) TypeError: FileReader.readAsArrayBuffer: Argument 1 does not implement interface Blob.
        loadFile gc.spread.excelio.14.1.2.min.js:25
        open gc.spread.excelio.14.1.2.min.js:22
        loadUsingExcelIO excelIO.js:15
        loadUsingExcelIO excelIO.js:14

  • Posted 8 May 2023, 3:34 pm EST - Updated 8 May 2023, 3:39 pm EST

    Hello,

    Please refer to the answers below for your questions.

    We are sorry for the inconvenience caused. SpreadJS (including ExcelIO.open()) does not support passing ReadableStream for importing xlsx file.

    The IO module which implements workbook.import(), workbook.export(), workbook.save(), workbook.open() APIs is different from ExcelIO module. The IO module was released in SpreadJS V16. There is a difference in their implementation.

    The recommended way of importing xlsx files is to use new IO module. It has improved performance as the excel file can be imported directly without converting it to json and then loading on spread like ExcelIO module does. Also, IO module support SJS file format which is SpreadJS specific file format. SJS file format is basically a zipped folder. It reduces the overall size of files and has improved loading performance. You can also import xlsx, sjs file in lazy load and incremental load to reduce loading time.

    Please refer to https://www.grapecity.com/spreadjs/docs/features/spreadjs-file-format#site_main_content-doc-content_title for more information on SJS format respectively.

    Please note that SpreadJS ExcelIO and IO module does not support importing xlsx file using readable streams. However, you can load xlsx file from the blob files.

    Please refer to the code snippet which demonstrates how you can import xlsx file with ExcelIO and IO module respectively.

    // imports xlsx file using ExcelIO module
    async function loadUsingExcelIO(spread, url) {
        const excelIo = new GC.Spread.Excel.IO();
        const blob = await fetch(url).then(res => res.blob());
        return new Promise((resolve, reject) => {
            excelIo.open(
                blob,
                function (json) {
                    spread.fromJSON(json);
                    resolve('file loaded successfully');
                },
                function (e) {
                    console.error(e);
                    reject(e);
                }
            );
        });
    }
    
    // imports xlsx file using IO module
    async function loadUsingIO(spread, url) {
        const excelIo = new GC.Spread.Excel.IO();
        const blob = await fetch(url).then(res => res.blob());
        return new Promise((resolve, reject) => {
            spread.import(blob, () => {
                resolve('file loaded successfully');
            }, () => {
                reject(e);
            });
        });
    }

    Please let us know if you face any issues or if you have any doubts. We will help you accordingly.

    Regards,

    Avinash

Need extra support?

Upgrade your support plan and get personal unlimited phone support with our customer engagement team

Learn More

Forum Channels