I want to download a zip file in MEAN stack

Question

Here is frontend code (Angular):-

  download(user) {


    this.clientAPI.get(Endpoints.DOWNLOAD).toPromise()
      .then(res => {
      
        let blob = new Blob([new Uint8Array(res.file)], { type: 'application/zip' });
          console.log('blob',blob);
        let a = document.createElement('a');
        a.href = (URL.createObjectURL(blob));
        a.download = res.filename;
        document.body.appendChild(a);
        a.click();
         a.remove();
        //  this.downloadComplete(user);
      })
      .catch(err => console.error("download error = ", err))
  }

Here is my backend code (Node Js):-

exports.download = function (req, res) {

  let file = process.env.NOCE_ENV === 'local' ? `${process.cwd()}/server/downloads/eFAST-Release-20.5.17.19.zip` :
    `${process.cwd()}/server/downloads/eFAST-Release-20.5.17.19.zip`;
  let filename = path.basename(file);
  res.setHeader('Content-disposition', 'attachment; filename=' + filename);
  res.setHeader('Content-type', "application/zip");
  let filestream = fs.createReadStream(file);
  
 // console.log('filestream',filenter code hereestream)
  res.jsonp({ filename: filename, file: filestream });
};

I am able to download the file but that is not in zip format . that is in .txt format and zero byte.

Please have a look and let me know hpw can i do this ?

Are you trying to unzip a downloaded zip file on the client? There are libraries on npm for that `zip.js` and more. — Isaak Eriksson, Aug 10 '20 at 12:06

Maxim · Answer 1 · 2020-08-10T12:34:34.893

0

You can use res.download("link_to_file") in express to download it.

More info here.

i used res.download but how could i manage this in angular ?

I'm not sure about angular but I think you can use plain js here to navigate to new tab where download will start.

window.open('https://YOUR-LINK-TO-FILE/download','_blank')

By the way, you have typo: process.env.NOCE_ENV

edited Aug 10 '20 at 12:34

answered Aug 10 '20 at 12:02

Maxim

475
1
5
15

i used res.download but how could i manage this in angular ? – Deepika vijay Aug 10 '20 at 12:24
but i don't want to use window.open – Deepika vijay Aug 10 '20 at 12:36
@Deepikavijay Ok, I didn't used angular for that but for React I used npm package that initiates Save File dialog on the page. So you can try to find something like that https://www.npmjs.com/package/angular-file-saver or look into their source code to implement it for youself – Maxim Aug 10 '20 at 12:41
@Deepikavijay I think instead of window.open you can just place the link to the file like that `` and then use express with res.download – Maxim Aug 10 '20 at 12:54
I am trying by this download(user) { this.clientAPI.get(Endpoints.DOWNLOAD).toPromise() .then(res => { let a = document.createElement('a'); a.href = (URL.createObjectURL(res)); a.download = 'test'; document.body.appendChild(a); a.click(); a.remove(); }); and in backend exports.download = function (req, res) { let file = process.env.NOCE_ENV === 'local' ? `${process.cwd()}/server/downloads/eFAST-Release-20.5.17.19.zip` : `${process.cwd()}/server/downloads/eFAST-Release-20.5.17.19.zip`; res.download(file); }; – Deepika vijay Aug 10 '20 at 13:34
but all is vain – Deepika vijay Aug 10 '20 at 13:35

score 0 · Answer 2 · answered Aug 10 '20 at 14:08

You need to pipe the filestream (from fs.createReadStream()) into res (the response). If you read the nodejs docs about stream and http, one will notice that res is actually also a Writable stream that you can pipe into like:

// set status code
res.setStatus(200); // 200 means ok
// set headers beforehand
// octet-stream means binary
res.setHeader('content-type', 'application/octet-stream');
filestream.pipe(res);

Streams are what make NodeJS powerful and efficient. It's an event-based emitter that passes chunks of data at a threshold limit by a configurable highWaterMark property (I think 16KB per chunk). You normally pipe a Readable into a Writable stream (in your case a readable file stream into a writable http response stream). You can read more about them here: https://nodejs.org/api/stream.html

I want to download a zip file in MEAN stack

2 Answers2