Trying to upload audio blob from angular to ASP.NET Web API

Question

I am trying to upload an audio blob file from Angular, but I am not receiving any files on the server side. I tested my ASP.NET Web API code in ApiDog, and It's working without any issues. I need some suggestions about this issue.

My Angular code:

upload(blob: Blob): void {
    const formData = new FormData();
    formData.append("file",blob,'audio file');
    
    let headers = new HttpHeaders({
      'Content-Type': 'multipart/form-data'});
    let options = { headers: headers };
    this.http.post('/api/fileUpload', formData,options).subscribe(
      (response) => console.log(response),
      (error) => console.log(error)
    );
}

ASP.NET Web API:

I check the file count in the following code block on my controller.

var httpRequest = HttpContext.Current.Request;

if (httpRequest.Files.Count > 0)
{
    var file = httpRequest.Files[0];
}

Thanks for your time!

Do you see any errors on the developer console ? You should also read the comments on this answer when you are using HttpContext: stackoverflow.com/a/20356591/1807452 — Rahul Sharma
– Rahul Sharma, Commented Apr 15, 2024 at 4:46
I do not see any errors in the console tab. I will go through the comments you have provided. I think there is no issue with Web API because I can make successful rest calls from Postman / Api Dog and get the file in Api. I am having the issue only when doing a rest call from Angular. — bobby
– bobby, Commented Apr 15, 2024 at 5:22
Just to confirm (sometimes Post Owner may tag incorrectly), are you using .NET Framework or .NET Core (including .NET 5 and so on)? If you are using ASP.NET Core, have you tried HttpContext.Request.Form.Files? What is the alternative of Httpcontext.Current.Request.Files in Asp.Net Core 2.0? — Yong Shun
– Yong Shun, Commented Apr 15, 2024 at 6:42

traynor · Accepted Answer · 2024-04-15 08:19:36Z

0

As it's missing boundary directive, try excluding 'Content-Type': 'multipart/form-data' header, it should be handled automatically:

this.http.post('/api/fileUpload', formData).subscribe(

More about content type header and AJAX: Pass Data to Service in Axios

edited Apr 15, 2024 at 8:19

answered Apr 15, 2024 at 8:04

traynor

10.5k3 gold badges15 silver badges30 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Trying to upload audio blob from angular to ASP.NET Web API

1 Answer 1

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related