Загрузка изображения Multipart: Boundary not found?

Question

[WhatIsHTML]

При отправке изображения получаю ошибку Error: Multipart: Boundary not found
На фронтенде отправка выглядит следующим образом
1. View

<input type="file" id="file" (change)="handleFileInput($event.target.files)">

2. Component

handleFileInput(files: FileList) {
        this.fileToUpload = files.item(0);
        this.userService.postFile(this.fileToUpload)
            .subscribe(
                response => {
                    console.log(response);
                },
                error => {
                    console.log('error', error);
                }
            );
    }

3. Service

postFile(fileToUpload: File): Observable<any> {
        const formData: FormData = new FormData();
        formData.append('fileKey', fileToUpload, fileToUpload.name);
        return this.apiService.post(this.apiConfig.photo, formData, true);
    }

Вот что я вижу во вкладке Network
General

Request URL: http://localhost:8000/api/photo
Request Method: POST
Status Code: 500 Internal Server Error
Remote Address: [::1]:8000
Referrer Policy: no-referrer-when-downgrade
<b>Response Headers</b>
Access-Control-Allow-Credentials: true
Access-Control-Allow-Headers: Origin, X-Requested-With, Content-Type, Accept, Authorization
Access-Control-Allow-Methods: GET,PUT,POST,PATCH,DELETE
Access-Control-Allow-Origin: *
Connection: keep-alive
Content-Length: 1864
Content-Security-Policy: default-src 'self'
Content-Type: text/html; charset=utf-8
Date: Mon, 07 May 2018 12:56:18 GMT
X-Content-Type-Options: nosniff
X-Powered-By: Express

Request Headers

Accept: application/json, text/plain, */*
Accept-Encoding: gzip, deflate, br
Authorization: xxx
Cache-Control: no-cache
Connection: keep-alive
Content-Length: 2
Content-Type: multipart/form-data
Host: localhost:8000
Origin: http://localhost:4200
Pragma: no-cache
Referer: http://localhost:4200/user/test

Request payload

{}
No properties

На бекенде NodeJS использую multer

const multer = require("multer");

var eventStorage = multer.diskStorage({
  destination: function (req, file, cb) {
    cb(null, "./storage");
  },
  filename: function (req, file, cb) {
    var filename = "";
    var possible = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789";
    for (var i = 0; i < 20; i++) {
      filename += possible.charAt(Math.floor(Math.random() * possible.length));
    }
    cb(null, filename + '.' + mime.extension(file.mimetype));
  }
});
var uploadEvent = multer({
  storage: eventStorage
});
router.post('/api/photo', auth.ensureAuthenticated, uploadEvent.any() , function (request, response) {
  console.log(request.files);
  handler.success(response, '', request.files);
});

Я не могу понять, где косяк - на фронтенде или бекенде?
Смущает пустой объект в Request payload, по идее там должен быть файл в виде хеша или типа того?

Comments

[Abcdefgk]

Ну короче, вот эта строчка в заголовках - Content-Type: multipart/form-data должна быть длиньше

Content-Type: multipart/form-data; boundary=туткакаянибудьслучайнаяфигня

И хоть я вообще не понимаю, чего это за многа букав тут написано (хотя отправить файл на сервер это так просто, что даже скучно), но легко заключаю: на фронтэнде данные не кодируются нормальным образом (если они вообще отправляются).