how to get image uploaded from angular in firebase cloud node function?

Question

I am trying to upload an image to firebase firestore , but before that I need to resize the image through cloud functions.

Below is the code I tried with:

component.html

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

The component.ts file

handleFileInput(files: FileList){
  console.log("uploaded files.......", typeof files.item(0));

  let postData = new FormData();
  postData.append("image", files.item(0));

  console.log('postData.................', postData);

  this.http.post('https://[.....]/app/resize', postData).subscribe(data => {
    console.log(".........", data);
  });
} 

And here is my cloud function:

const upload = multer.diskStorage({
  destination: (req, file, cb) => {
    console.log('upload called...............................');
    const isValid = MIME_TYPE_MAP[file.mimetype];
    let error = new Error("Invalid mime type");
    if (isValid) {
      error = null;
    }
    cb(error, "../tmp/");
  },
  filename: (req, file, cb) => {
    console.log('something is here........', file);
    const name = file.originalname
      .toLowerCase()
      .split(" ")
      .join("-");
    const ext = MIME_TYPE_MAP[file.mimetype];
    cb(null, name + "-" + Date.now() + "." + ext);
  });
app.post('/resize', multer({ storage: upload }).single("image"), (req, res) => {
  cors(req, res, () => { });
  res.set('Access-Control-Allow-Origin', "*");
  res.set('Access-Control-Allow-Methods', 'GET, POST');
  console.log("##", req.body);
  console.log("##", req.file);
}    

I am getting req.body as empty object {} and req.file as undefined?

I am not able to debug it to understand if the problem is in angular side or on firebase node-express side.

The postData is formData and its content is not visible in the console of browser.

Could you please guide me to fix this issue?