Webaudio API: store arraybuffer on server as file and retrieve it later?

I am desperate to find a solution to my problem.

CONTEXT: a web application that manages audio via the WebAudio API; JavaScript + jQuery client side; PHP5 server. (Sorry, I had to chop off some of the code below to keep this post short and readable)

1) I have an arraybuffer object that is read locally from filereader obj and stored locally in the vis.js dataset (which essnetially does) like this ...

var reader = new FileReader();
reader.onload = function(ev) { 
            //this store the content into an "audiodata" property of an item part of a vis.js dataset whose name is "clips"
            songModule.createNewClip({  arrayBufferObj:ev.target.result }) 
        };
reader.readAsArrayBuffer(file); 

      

        
        
        
      

    

IMPORTANT: at this point this object is also passed to audioContext.decodeAudioData (arrayBufferObj, function (buffer) {..} THAt WORKS AND AND RIVE OUTPUT .. So far so good ..

2) I upload an object to the server like this:

var formData  = new FormData(document.getElementById("temporaryForm"))
...
formData.append('audiodata', clips.get(localClipId).audiodata) 

        $.ajax({                                      
            type: 'POST',
            url: 'addUpdateClip.php',                  
            data:  formData ,                                     
            //dataType: 'json',    
            processData: false, //It’s imperative that you set the contentType option to false, forcing jQuery not to add a Content-Type header for you
            contentType: false,
            cache: false, 
            ...
)}

      

        
        
        
      

    

3) PHP page addUpdateClip.php extracts and saves server data to file:

... $myfile = fopen($uniqueFileName, "w");
if (!fwrite($myfile, getValueFromPostOrGet('audiodata')))  //=$_POST["audiodata"]
fclose($myfile);    

      

        
        
        
      

    

The file seems to be written correctly on the server

4) .. But ... Re-navigating the generated file directly to the server and going to the audioContext.decodeAudioData function raises the error "Uncaught SyntaxError: Failed to execute" decodeAudioData "in" AudioContext: Invalid ArrayBuffer for audio data. ". Below is the latest version of my experiments.

var xhr = new XMLHttpRequest();
                xhr.open('GET', Args.filename , true);
                xhr.responseType = 'arraybuffer';   
                xhr.onload = function(e) {
                  if (this.status == 200) {
                    var responseArrayBuffer=xhr.response
                    if (responseArrayBuffer){                           
                        var binary_string = ''
                        bytes = new Uint8Array(xhr.response);
                        for (var i = 0; i < bytes.byteLength; i++) {
                            binary_string += String.fromCharCode(bytes[i]);
                        }
                        base64_string = window.btoa(binary_string);
                        console.log(base64_string)

                        //var blob = new Blob([responseArrayBuffer], {type: "audio/wav"});

                        songModule.clipAudioDataReceived(newId, blob, Args.waveformDataURL )
                    }
                  }
                xhr.onreadystatechange=function(){console.log(xhr.readyState,xhr.status, xhr.responseText )}
                };
                xhr.send();         

      

        
        
        
      

    

Any hint?

___________ To answer the question: ___________________

Request URL:http://XXXXXXX/addUpdateClip.php
Request Method:POST
Status Code:200 OK


Accept:`*/*`

Accept-Encoding:gzip,deflate
Accept-Language:it-IT,it;q=0.8,en-US;q=0.6,en;q=0.4,en-GB;q=0.2,fr;q=0.2
Cache-Control:no-cache
Connection:keep-alive
Content-Length:43324
Content-Type:multipart/form-data; boundary=----WebKitFormBoundaryaWagMNKe8hprn1pI
Cookie:PHPSESSID=m3okfanf1isbstueih9qq3k6r3
Host:onlinedaw
Origin:http://xxxxxxxxx
Pragma:no-cache
Referer:http://xxxxxxxxx/editSong.php?song_id=9
User-Agent:Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/38.0.2125.104 Safari/537.36
X-Requested-With:XMLHttpRequest
Request Payload
------WebKitFormBoundaryaWagMNKe8hprn1pI
Content-Disposition: form-data; name="mode"

add
------WebKitFormBoundaryaWagMNKe8hprn1pI
Content-Disposition: form-data; name="id"

7961f2b6-92cd-be59-f7a7-5c59f1c69fc5
------WebKitFormBoundaryaWagMNKe8hprn1pI
Content-Disposition: form-data; name="song_id"

9
------WebKitFormBoundaryaWagMNKe8hprn1pI
Content-Disposition: form-data; name="group"

13
------WebKitFormBoundaryaWagMNKe8hprn1pI
Content-Disposition: form-data; name="start"

2010-01-01 00:02:58
------WebKitFormBoundaryaWagMNKe8hprn1pI
Content-Disposition: form-data; name="startMs"

748
------WebKitFormBoundaryaWagMNKe8hprn1pI
Content-Disposition: form-data; name="clipDurationMs"

8617
------WebKitFormBoundaryaWagMNKe8hprn1pI
Content-Disposition: form-data; name="audiodata"

[object ArrayBuffer]
------WebKitFormBoundaryaWagMNKe8hprn1pI
Content-Disposition: form-data; name="extension"

wav

Do you see anything strange?