Sending file to NodeJS from Angular

Question

This is a common question, however I still didn't manage to make this work.

From an Angular app, using uppy, I have the following code in my component:

const XHRUpload = require('@uppy/xhr-upload')
    this.uppy = new Uppy({
      id: 'uppyContent',
      debug        : true,
      autoProceed  : false,
      restrictions : {
        //allowedFileTypes : [ 'image/*', 'video/*','audio/*','application/pdf','.obj','.FBX','.OBJ','.fbx' ],
        allowedFileTypes: [fileTypes],
        maxNumberOfFiles: 1
      },
      meta : {
         ProjectID: this.projectID, Componente: componente
      }
    })
      .use(Dashboard, {
        trigger              : '.UppyModalOpenerBtn',
        inline               : true,
        target               : '.DashboardContainer',
        replaceTargetContent : true,
        note                 : fileTypeDescription+' only, 1 file, up to 1 GB',
        maxHeight            : 450,
        metaFields           : [
          { id : 'license', name : 'License', placeholder : 'specify license' },
          {
            id          : 'caption',
            name        : 'Caption',
            placeholder : 'describe what the image is about'
          }
        ]
      })
      .use(XHRUpload, {
        endpoint: this.globalService.API_PATH + 'urluploadhere',
        formData: true,
        fieldName: 'files[]'
      })
      //.use(Tus, { endpoint : this.globalService.API_PATH + 'globalProjectFileUpload', resume : true })
      .use(RestoreFiles, {
        serviceWorker : true,
        indexedDB     : {
          maxFileSize  : 1024 * 1024 * 1024, // 1GB => Each file
          maxTotalSize : 1024 * 1024 * 1024 * 1024 // 1 TB

        }
      })
      .run();

The following is a screenshot of my Chrome's debugger, using the Network tab:

In my NodeJS I have the following snippet:

var bodyParser = require("body-parser");
app.use(bodyParser.json()); // support json encoded bodies
app.use(bodyParser.urlencoded({ extended: true })); // support encoded bodies

var multer = require( 'multer');
var upload = multer();
app.use(upload.array());

app.post('/v1/urluploadhere', function(req, res) {
  console.log(req.body.files);
  res.end();
});

However, it crashes with the following

MulterError: Unexpected field

What should I do to correct this?

Thanks!

Answer 1

Try removing app.use(upload.array()); line and use app.use(upload.single('field name in the formData')) since you are trying to upload an single file.

And if you are trying to send an array of files specify the fieldName (files[]) in the array method app.use(upload.array('field name in the formData'));