Search code examples
htmlgetusermedia

how to upload to remote folder saved audio from html5 getusermedia microphone


I have this file thats created with html5, I am just starting to learn. Basically when I am recording from the microphone and stop the record I am finding it hard to upload the outputted file to a folder on the server.

Here is the page i am testing on.

http://2click4.com/playground.php


Solution

  • You use Blob and createObjectURL in your code on example page. You create ObjectURL, so you can send it by XMLHttpRequest to server:

    var blob = new Blob ( [ view ], { type : 'audio/wav' } );
    // let's save it locally
    outputElement.innerHTML = 'Handing off the file now...';
    var url = (window.URL || window.webkitURL).createObjectURL(blob);
    var xhr = new XMLHttpRequest();
    xhr.open('POST', 'link_to_server', true);
    xhr.onload = function (e) {
        var result = e.target.result;
    };
    xhr.send(url);//url is Blob