How to Upload an Excel File in SAPUI5?

Question

so I have this app where I upload a csv file using FileUploader. However now my requirement is to also allow excel files. The problem is that FileUploader doesn't support excel as it reads garbage. This is my attempt at parsing an excel file based on this example http://oss.sheetjs.com/js-xlsx/

Code:

        var fileUpload = this.getView().byId("fileUploader");
        var domRef = fileUpload.getFocusDomRef();
        var file = domRef.files[0];
        var XLSX = new ExcelPlus();
        XLSX.createFile(["CT_MAIN"]);

        var reader = new FileReader();

        reader.onload = function(e) {
            var strCSV = e.target.result;
            var arr = String.fromCharCode.apply(null, new 
            Uint8Array(strCSV));

          //  var arr = fixData(strCSV);

            console.log('data');
            console.log(arr);

            var workbook = XLSX.read(arr, {type : 'base64'});
             console.log('output');
             console.log(workbook);

            //var output = toCsv(workbook); 
            //each one of the rows in the csv file
            //var rows = arr;//strCSV.split("\n");
            var rows = arr.split("\n");
            ..... 

        };

        //reader.readAsText(file);
        reader.readAsArrayBuffer(file);
          //reader.readAsBinaryString(file);

If I upload a csv file using this code everything works fine. If I use an excel file I get the following

[1][Content_Types].xml ¢ [1]( [1]¬”ËNÃ0E÷HüCä-Jܲ@5í‚Ç Q>Àēƪc[žiiÿž‰ûB¡ j7± ÏÜ{2ñÍh²nm¶‚ˆÆ»R‹ÈÀU^7/ÅÇì%¿’rZYï @1__f›˜q·ÃR4DáAJ¬h >€ãÚÇV ßƹ ªZ¨9ÈÛÁàNVÞ 8Ê©ÓãÑ Ôji){^óã-I‹"{Üv^¥P!XS)bR¹rú—K¾s(¸3Õ`c[1]Þ0†½ ÝÎß»¾7 M4²©ŠôªZÆk+¿|\|z¿(Ž‹ôPúº6 h_-[ž@!‚ÒØPk‹´¬2nÏ}Ä? £LËð Ýû%á ÄßdºždN"m,à¥ÇžDO97‚~§Èɸ8ÀOíc |n¦Ñä Eøÿ ö éºóÀBÉÀ!$}‡íàÈé;{ìÐå[ƒîñ–é2þÿÿ

what am I doing wrong, or what am I missing here?

Edit: after doing var workbook = XLSX.read(arr, {type : 'base64'}); I get null for both file types. The above garbage log comes from console.log(arr);

Answer 1

Since you are getting the file from the domRef you wouldn't need ExcelPlus. You just need to read the file as a binary string using xlsx. You will have to include the xlsx.full.min.js in your script.

var fileUpload = this.getView().byId("fileUploader");
    var domRef = fileUpload.getFocusDomRef();
    var file = domRef.files[0];
    //var XLSX = new ExcelPlus();
    //XLSX.createFile(["CT_MAIN"]);

    var reader = new FileReader();
    var name = file.name;

    reader.onload = function (e) {
        var data = e.target.result;
        var workbook = XLSX.read(data, { type: 'binary' });

        var result = {};
        workbook.SheetNames.forEach(function (sheetName) {
            var rObjArr = XLSX.utils.sheet_to_row_object_array(workbook.Sheets[sheetName]);
            if (rObjArr.length > 0) {
                result[sheetName] = rObjArr;
            }
        });
        var output = JSON.stringify(result, 2, 2);

        console.log('output');
        console.log(output);
    };

    reader.readAsBinaryString(file);