Dynamic file download with flow-router

Hi, I’m trying to provide a link in my application to download a dynamically generated zip file. I have a server side route that generates the file:

Picker.route('/api/site/:siteId/config', function(params, req, res, next) {
  console.log('get /api/site', params);

  var site = Sites.findOne({_id: params.siteId});
  var site_ = JSON.stringify(site, undefined, 2);

  if (!site) {
    res.end();
  } else {
    var zip = new JSZip();
    zip.file('gateway-config.json', site_);
    var zip_ = zip.generate({type: 'nodebuffer', compression: 'DEFLATE'});
    
    //res.setHeader('Content-Type', 'application/octet-stream');
    res.setHeader('Content-disposition', 'attachment; filename=gateway-config.zip');

    res.end(zip_);
  }
});

Then, in the client, I present a link to the user by:

<a href="/api/site/{{_id}}/config">Download site config</a>

However, when I click on the link, flow router tells me:

There is no route for the path: /api/site/YvfC23KPMmeKfuFHZ/config

If I enter the URI directly in the browser, the download works fine.

So, wondering the best way to create a link in my app that will download a file.

Thanks!
Cliff

2 Likes

Here is one workaround:

<a href="/api/site/{{_id}}/config" target="_blank">Download site config</a>

The “_blank” causes a new browser tab to be opened, which bypasses flow router.

Also as noted by Arunoda the download attribute also works.

Thanks for the download tip, that works even better.

<a href="/api/site/{{_id}}/config" download>Download site config</a>