I'm trying to give my users a way to record audio files and post them to my server. I'm using Recorder.js for the recording part, and I can have an element populated by the user's (webrtc) recording as a blob generated by the javascript library. I am able to record and download the recording, just like on this demo: http://webaudiodemos.appspot.com/AudioRecorder/index.html
Question is, instead of downloading the file, how could I include this recording into a jQuery ajax post? Goal is to post the recording along with some data on a and the receiving server would save the data into a database and the recording file onto its disk.
audioRecorder && audioRecorder.exportWAV(function (blob) {
//Here we get the blob object url, which can be set as audio element source
var url = URL.createObjectURL(blob);
//Here we download the recording file
audioRecorder.forceDownload(blob, 'output.wav');
//I can set the audio element for pre-listening before user POSTs the form
var au = $('#myaudioelement').attr("src",url);
});
So when the user sends the ajax POST, I'd need to add the content of 'myaudioelement' to the data field in the $.ajax call, along with something like value of , how can I accomplish this?