I'm trying to post an audio blob and a string to my server with javascript XMLHttpRequest. The server code is PHP. I can manage to post the string, but the blob is not going through:
Javascript:
var formData = new FormData();
formData.append("string", words);
formData.append("blobData", clipBlob);
var xmlhttp = new XMLHttpRequest();
var url = "https://www.website.com/file.php";
xmlhttp.responseType = 'json';
xmlhttp.open("POST", url, true);
xmlhttp.onload = function () {
console.log(xmlhttp.response[0]);
console.log(xmlhttp.response[1]);
};
xmlhttp.send(formData);
PHP:
$sentence = $_POST["string"];
$blob = $_POST["blobData"];
file_put_contents("clip.wav",$blob);
$aud = 'clip.wav';
$audData = base64_encode(file_get_contents($aud));
$src = 'data:audio/wav;base64,'.$audData;
echo json_encode(array($sentence,$src));
The $sentence variable echos back to my html page, but the $src doesn't. In fact, the wav file is empty because the blob info isn't being recognized.
EDIT: I changed the PHP for the blob to this and it worked:
// get the temporary name that PHP gave to the uploaded file
$tmp_filename=$_FILES["blobData"]["tmp_name"];
// rename the temporary file (because PHP deletes the file as soon as it's done with it)
rename($tmp_filename,"clip.wav");