How do I send a POST request to send BLOB data from a java script client and receive it through an MVC controller?

My current code:

Javascript

function pushFunc() {

    mediaRecorder.requestData();
    console.log(mediaRecorder.state);

    mediaRecorder.ondataavailable = function (e) {
        console.log("data size: ", e.data.size);
        var encodeData = new Blob([e.data], { type: 'video/mp4' });
        postBlobData(encodeData);
    }

}


function postBlobData(blob) {

    var formData = new FormData();

    formData.append("blobContent", blob);

    var request = new XMLHttpRequest();
    request.open("POST", "/Device/Upload");
    request.send(formData);
}

      

        
        
        
      

    

ASP.NET

**File: DeviceController.cs**

[HttpPost]
        public string Upload(HttpPostedFileBase blobContent)
        {
            ...
            // return View();
        }

      

        
        
        
      

    

Java script code gets blob from media recorder and tries to send it to controller.

• Do I grab and send the drops the way I should?

• Should HttpPostedFileBase be used to receive a server side post request?

Screenshot # 1 Screenshot Screenshot

Screenshot # 2 Screenshot Screenshot

Screenshot of the 3rd Fiddler screenshot