Gettting an Array, but of scrambled data 😰

[ckhatton]

Hi there

I'm using Nuxt.js.

I have const xlsx = require('xlsx'); in my script and then passing xlsx the URL data using:

const fr = new FileReader();
fr.readAsDataURL(event.target.files[0]);
fr.addEventListener('load', () => {
  this.file.url = fr.result; // 'data:application/vnd.openxmlformats-officedocument.spreadsheetml.sheet;base64,UEsDBBQABgAIAAAAIQDv...
});
.
.
.
handleForm(event) {
    const workbook = xlsx.read(this.file.url);
    const sheetNameList = workbook.SheetNames;

    sheetNameList.forEach(function (y) {
      const worksheet = workbook.Sheets[y];
      const headers = {};
      const data = [];

      for (const z in worksheet) {
        if (z[0] === '!') continue;
        // parse out the column, row, and value
        let tt = 0;
        for (let i = 0; i < z.length; i++) {
          if (!isNaN(z[i])) {
            tt = i;
            break;
          }
        };
        const col = z.substring(0, tt);
        const row = parseInt(z.substring(tt));
        const value = worksheet[z].v;

        // store header names
        if (row === 1 && value) {
          headers[col] = value;
          continue;
        }

        if (!data[row]) data[row] = {};
        data[row][headers[col]] = value;
      }
      // drop those first two rows which are empty
      data.shift();
      data.shift();
      console.log(data);
    });
  }

It is returning an Array of Objects, but the contents is gobbledygook! 😬

Example: data[0] returns...

{u«Zjše‰Æ­Š‰ÿ¾wh¥éñšWè®f­²‡ß‰Ç¡Ë¦z{l¦·švÈ^zÙ¥²žµ¶¬{®ÀÁ�
€���@<oxŸ@@�
@�À�–ÐÛ۝[Õ\\×Kž[(�Š(��€�������������������������������������������������������������������������������������������������������������������������������������������������������������������������������������������������������������������������������������������������������������������������������������������������������������������������������������������������������������������������������������������������������������������������������������������������������������������������������������������������������������������������������+%2Z°Ì!»áo ômvžŠ)q:hrìCI@5F±Èµ ™¬¯_qҔ’²šµ¼Ÿÿÿ5š</: 'TÔä=ïw ë/\bÜ%\x14éÈa Õê5o){\x1BqpÆÉ÷ñ¢{\x19lë\x90åP¡t&\x92\x84FåBéýÈ.kÚÔà}µw', ›m "1®Ô½"ç²0W†ÍËquù_Ådœ–­wJu 8ž^Ìæ+�Ø1®Çe¨ˆB“Ô˜µV>�#™Ú‡ëH¿£ÆU: '\x9D H`´¶\x00$\x1BbÄ\x03DøÆ".\f\x05<\x88\fТåÐmÕEo\fÆpñ\x81/8ô£Ä%­·\x80Æ6él²®…r=?/áI\x1CÁ¢-\x1B\x80kÇ^Ä\x8FQÛ\x95\x01\x0FI\x8F¼têÆþ*ßr\x81íøJ> 7:DK\x93ØuÕ·{\x8F', undefined: '\x04\x11\f¼6Ö!öËäkâ_ñ÷Oi\x10GØ2Ý;ÃÀ\x00\x00?ÿÀÀ\x14\x12ÀÁ\x05\x00\x01\x80\x02\x00\x00\x00\b@9>…§\x8B1 \x8Fno4\x9C¬&<\x8C\x1D4¨Æ¬\bîJ²ÎÆ\x99\x90\x0FrÅ\x16×Pv:\x86Ä3tyäÿäËKIu&\x14'}

Example.xlsx

[SheetJSDev]

Are you using the latest version of the library?

If you are and are still encountering this issue, try removing the data URI header:

xlsx.read(this.file.url.slice(this.file.url.indexOf(",") + 1));

If updating and applying the patch fails, please reply and we'll try to reproduce the issue.

PS: you can use sheet_to_json to greatly simplify the data processing.

[ckhatton]

😃 It was the data URL header it didn't like! 🥳

Thank you so much! 🙏