I am writing HTML WYSIWYG application. After a user edits a web page, they should be able to click a download button, and be prompted by their browser to save their edited web page. I do not want to store their edited web page on my server, but send the file to their local machine.

So far in my application, I am able to edit a template, grab its HTML when the user clicks the download button, and using NodeJS's fs.createWriteStream method, write the HTML to a newly created HTML file. However, it creates the file on my server instead of prompting the browser to save the file in a Downloads folder. I am using Socket.io to tell the server to download the HTML content.

After research, I figured out that in order to make the browser prompt the user to save a download file, the HTTP headers must be set using the Content-Disposition: attachment header.

In Summary, when the user clicks the download button in my application, what should I do so that a new file is created and saved directly on the users local puter instead of on my server?

This is what I have in my server.js file:

io.sockets.on('connection', function(socket) {
    socket.on('downloadHTML', function(data) {
        var file = fs.createWriteStream('PearlEdit-template-Martketing.html', {flags: 'w'})
                .write(data.html);
    });

});

I am writing HTML WYSIWYG application. After a user edits a web page, they should be able to click a download button, and be prompted by their browser to save their edited web page. I do not want to store their edited web page on my server, but send the file to their local machine.

So far in my application, I am able to edit a template, grab its HTML when the user clicks the download button, and using NodeJS's fs.createWriteStream method, write the HTML to a newly created HTML file. However, it creates the file on my server instead of prompting the browser to save the file in a Downloads folder. I am using Socket.io to tell the server to download the HTML content.

After research, I figured out that in order to make the browser prompt the user to save a download file, the HTTP headers must be set using the Content-Disposition: attachment header.

In Summary, when the user clicks the download button in my application, what should I do so that a new file is created and saved directly on the users local puter instead of on my server?

This is what I have in my server.js file:

io.sockets.on('connection', function(socket) {
    socket.on('downloadHTML', function(data) {
        var file = fs.createWriteStream('PearlEdit-template-Martketing.html', {flags: 'w'})
                .write(data.html);
    });

});

• javascript
• node.js
• stream
• http-headers
• content-disposition

• 2 Just serve the file with the proper headers when the link is clicked, don't use websockets for that – adeneo Commented Jan 2, 2014 at 6:48
• I'm not 100% sure what you mean. Could you elaborate? – Rashad Commented Jan 2, 2014 at 8:12

1 Answer 1

You can simply use something like this (answer referenced from here)

app.get('/download', function(req, res){

  var file = __dirname + '/upload-folder/dramaticpenguin.MOV';

  var filename = path.basename(file);
  var mimetype = mime.lookup(file);

  res.setHeader('Content-disposition', 'attachment; filename=' + filename);
  res.setHeader('Content-type', mimetype);

  var filestream = fs.createReadStream(file);
  filestream.pipe(res);
});