API Webaudio: сохранить массив буфера на сервере в виде файла и получить его позже?

Я отчаянно пытаюсь найти решение своей проблемы.

КОНТЕКСТ: веб-приложение, управляющее аудио через API WebAudio; JavaScript + jQuery на стороне клиента; PHP5 серверная часть.
(Извините, мне пришлось отрубить часть кода ниже, чтобы этот пост был коротким и читабельным)

1) У меня есть объект arraybuffer, который читается локально с помощью программы чтения файлов obj и хранится локально в наборе данных vis.js (это то, что делает по существу) следующим образом …

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);

ВАЖНО: На этом этапе этот объект также передается в audioContext.decodeAudioData (arrayBufferObj, function (buffer) {..}, который работает правильно и дает правильный выход
.. Все идет нормально..

2) Я загружаю объект на сервер следующим образом:

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-страницу addUpdateClip.php извлекают и сохраняют в файл на сервере данные:

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

Кажется, файл правильно написан на сервере

4) .. Но … Получение позже непосредственно сгенерированного файла на сервере и передача в
Функция audioContext.decodeAudioData вызывает ошибку «Uncaught SyntaxError: Не удалось выполнить« decodeAudioData »для« AudioContext »: недопустимый ArrayBuffer для audioData.». Ниже последняя версия моих экспериментов.

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();

Любая подсказка?

___________ Для ответа на этот вопрос: ___________________

Request URL:http://XXXXXXX/addUpdateClip.php
Request Method:POST
Status Code:200 OKAccept:`*/*`

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?

3

Решение

Ответ, опубликованный ОП в вопросе:

Я продолжал использовать один и тот же волновой файл для тестирования, поэтому размер файла на сервере всегда был одинаковым (11 байт). Таким образом, я не понял, что клиент НИКОГДА не отправлял данные, предназначенные для приведения, но строку «aray buffer».
После дальнейшего копания я заметил, что всякий раз, когда я пытался сохранить буфер массива в форме набора данных vis.js, он превращался в его описание: строка «буфер массива», которая действительно составляет 11 байтов!

Решение: просто, по моему мнению, набор данных vis.js не подходит для размещения буфера массива. Вместо этого я использовал параллельный массив JavaScript, и он работал.

0

Другие решения

Других решений пока нет …

По вопросам рекламы [email protected]