missing content-type boundary when uploading IFormFile with Content-Type multipart/form-data

Question

I have this code to upload file to aspnet core Api

 [HttpPost]
    [Produces(typeof(MissionBalanceWithMissionBalanceLinesModel))]
    public async Task<IActionResult> UploadBalance(IFormFile upload)
    {
        return Ok("successfully uploaded");
    }

And the angular code

   const file: File = event.target.files[0];
   const upload= new FormData();
   fileToUpload.append('upload', file, file.name);
   const blob = fileToUpload as any
   let options_ : any = {
        body: blob,
        observe: "response",
        responseType: "blob",           
        headers: new HttpHeaders({
            /* "Content-Type": "multipart/form-data", */
            "Accept": "text/plain"
        })
    };

    return this.http.request("post", url_, options_)...

Error: System.IO.InvalidDataException: Missing content-type boundary.

Commenting the /* "Content-Type": "multipart/form-data", */ line helps but since this is NswagStudio generated code, I would like to find another workaround solution.

Or how to tell NswagStudio not to generate this Content-Type header?

Answer 1

You should try to avoid the request method use Post method instead. You can view doc here

addHero (hero: Hero): Observable<Hero> {
  return this.http.post<Hero>(this.heroesUrl, hero, httpOptions)
    .pipe(
      catchError(this.handleError('addHero', hero))
    );
}

So your code should be

const httpOptions = {
  headers: new HttpHeaders({
    'Content-Type':  'multipart/form-data'
  })
};

return this.http.post(url, fileToUpload, httpOptions)