node.js flatiron - file uploads by multipart/form-data

Question

I have a flatiron app that now needs to be expanded to handle multipart/form-data upload of images.

How does one handle file uploads in a flatiron app? union/director seem to ignore multipart/form-data, and all my attempts to integrate formidable have failed - I assume this is because of the actions union performs before formidable gets a hold of the request object.

I have tried normal and streaming: true routes, as well as raw handling in the before array.

I can't be the only person who needs this, so it's probably been addressed and I apologize. I just can't find any reference materials.

Answer 1

You can use union with connect.multipart (or bodyParser) which already uses node-formidable.

var connect = require('connect'),
    union = require('union');


var server = union.createServer({
  buffer: false,
  before: [
    connect.bodyParser(),
    function(req, res) {
                if (req.method==='POST'){
                        console.log(req.files);
                        res.end('Done');
                }else{
                        res.writeHead(200, { 'Content-Type': 'text/html' });
                        res.end('<form method="post" enctype="multipart/form-data">' +
                                '<input type="file" name="file" />' +
                                '<input type="submit" value="Upload" />' +
                                '</form>');
                }
    },
  ]
}).listen(8000);

Answer 2

Apparently you have to turn buffering off in the Union options, and streaming: true in your endpoint's options:

var fs = require('fs'),
    path = require('path'),
    union = require('../../lib'),
    director = require('director'),
    favicon = require('./middleware/favicon'),

    // for uploading:
    formidable = require('formidable'),
    util = require('util');

var router = new director.http.Router();

var server = union.createServer({
  buffer: false,
  before: [
    favicon(path.join(__dirname, 'favicon.png')),
    function (req, res) {
      var found = router.dispatch(req, res);
      if (!found) {
        res.emit('next');
      }
    }
  ]
});

router.get('/foo', function () {
  this.res.writeHead(200, { 'Content-Type': 'text/html' });
  this.res.end('<form action="/foo" enctype="multipart/form-data" method="post">'+
    '<input type="text" name="title"><br>'+
    '<input type="file" name="upload" multiple="multiple"><br>'+
    '<input type="submit" value="Upload">'+
    '</form>');
});

router.post('/foo', { stream: true }, function () {
  var req = this.req,
      res = this.res,
      writeStream;

      var form = new formidable.IncomingForm();

      console.log('Receiving file upload');

      form
        .on('field', function(field, value) {
          console.log(field, value);
        })
        .on('file', function(field, file) {
          console.log(field, file);
        })
        .on('progress', function(rec, expected) {
          console.log("progress: " + rec + " of " +expected);
        })

        .parse(req, function(err, fields, files) {

          console.log('Parsed file upload' + err);

          res.writeHead(200, { 'Content-Type': 'text/plain' });
          if (err) {
            res.end('error: Upload failed: ' + err);
          }
          else {
            res.end('success: Uploaded file(s): ' + util.inspect({fields: fields, files: files}));
          }
        });

});

server.listen(9090);
console.log('union with director running on 9090');