Angular 5: Upload file to Node.js with Multer

Question

I have the following code in my service:

uploadFiles( files ) {
    let fd = new FormData();
    let xhr = new XMLHttpRequest();
    fd.append( 'file', files[0], files[0].name );

    return new Promise((resolve, reject) => {
      xhr.onreadystatechange = function() {
        if( xhr.readyState === 4 ) {
          if( xhr.status === 200 ) {
            console.log('file uploaded');
            resolve(xhr.response );
          } else {
            console.log('Fail');
            reject( xhr.response );
          }
        }
      };

      xhr.open('POST', `${this.url}/equipos/uploadfiles`);
      xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
      xhr.send(fd);
    });
  }

When I send to the backend (in Node) I get the following error in the console.log( req ); object:

When I remove the line xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded'); I get an error with Multer but I do not know how to debugge:

Multer works well when I use it with Postman, but not with my application in Angular.

I have also reviewed this thread but I have the same problem.

Answer 1

I found my error and I share it with the community. In my routes I had:

api.post('/equipos/uploadfiles', upload.array('arch', 12), equipoController.uploadFiles);

I was using archi instead of file. Change that line for this and it worked:

api.post('/equipos/uploadfiles', upload.array('file', 12), equipoController.uploadFiles);