title: How to send parsed .csv file as a byte array or ArrayBuffer data from Node.js backend to AngularJS frontend?
body: <p>I'm working on AngularJS app.
  Module I'm currently working on should be able to either show a preview of a spreadsheet file or allow to download it.</p>
  
  <p>The steps:</p>
  
  <ol>
  <li>When clicked on "Preview File" it should send request with needed file's name as a parameter of POST request.</li>
  <li>Backend will find neede file, which is a .csv file, convert it to byte array type and send it to frontend.</li>
  <li>Frontend should handle this byte array and convert it to .xls or .xlsx filetype</li>
  <li>The spreadsheet data should be opened in some small preview read-only window, like 1000x1000 px.</li>
  </ol>
  
  <p>The POST request line looks like that:</p>
  
  <pre><code>this.$http.post(this.url + 'endpoint/getFile', params, 
       {responseType: "arraybuffer", showLoadingOverlay: true}
  )
  </code></pre>
  
  <p>The response looks indeed like ArrayBuffer: three of it in one object, i.e. Uint8Array, Uint16Array and Uint32Array.</p>
  
  <p>The code which should read this and convert to content suitable for preview is not working:</p>
  
  <pre><code>const byteArray = new Uint8Array(data);
  const blob = new Blob([byteArray], { type: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet' });
  const objectUrl = URL.createObjectURL(blob);
  this.$window.open(objectUrl, 'C-Sharpcorner', 'width=1000,height=1000');
  </code></pre>
  
  <p>Because when created the blob, it already has 0 length in bytes, so there's no data inside.</p>
  
  <p>The matter of visualising the .xls in browser window, I think, can be achieved with <a href="https://github.com/TonyGermaneri/canvas-datagrid" rel="nofollow noreferrer">canvas-datagrid</a> library. Haven't used but it looks cool.</p>
  
  <p>Also, I have a problem with trying to set up a mock data for node.js (and AngularMock), for local testing when there's no data on a java backend.</p>
  
  <p>I'm using 'fs' and 'csv-parse':</p>
  
  <pre><code>const fs = require('fs');
  const csvParse = require("csv-parse/lib/es5");
  
  module.exports = function stir(app) {
      const getFile = () =&gt; {
          const csvOutput = csvParse('../static/someData.csv', (parsed) =&gt; {
              return parsed;
          });
          fs.readFileSync(csvOutput);
       };
       app.post('/stir/getFile', (req, res) =&gt; res.json(getFile()));
  };
  </code></pre>
  
  <p>Which results in error: </p>
  
  <blockquote>
    <p>TypeError: path must be a string or Buffer</p>
  </blockquote>
  
  <p>What is the proper way of parsing the .csv using 'csv-parse' and sending parsed data as an ArrayBuffer to frontend in Node and AngularMock?
  csv-parse docs are telling that underneath, the lib will convert the parsed object to node stream.
  So why that error happens?</p>