2012-09-12 13 views
17

Zaczynam od Web Audio API i zastanawiam się, czy możliwe jest użycie funkcji $ .ajax lub $ .load jQuery do utworzenia XMLHttpRequest, który odbiera dane audio. Czy obsługa $ .ajax lub $ .load responseType = arrayBuffer?

EDIT:

Ok, więc oto co mam do tej pory:

function loadAudio() { 
    $.ajax({ 
      url: sourceUrl 
     }).done(function(response){ 
      return response; 
     }) 
    } 

ale muszę zwrócić ArrayBuffer. Jak więc przekonwertować odpowiedź na ArrayBuffer?

+0

Powinieneś tego spróbować i zobaczyć. – Musa

Odpowiedz

16

O Twoim pytaniu, wygląda na to, że jQuery jeszcze go nie obsługuje. Przed użyciem tego, co zasugerowałem poniżej, rozważ, czy ta funkcja jest dostępna.

Dzięki XHTMLRequest możesz oszukać serwer i otrzymać ciąg znaków binarnych reprezentujący żądane bajty z serwera. Działa idealnie.

var xhr = new XMLHttpRequest(); 
xhr.open('GET', '/your/audio/file.wav', true); 

// Here is the hack 
xhr.overrideMimeType('text/plain; charset=x-user-defined'); 

xhr.onreadystatechange = function(event) { 
    if (this.readyState == 4 && this.status == 200) { 
    var binaryString = this.responseText; 

    for (var i = 0, len = binaryString.length; i < len; ++i) { 
     var c = binaryString.charCodeAt(i); 
     var byte = c & 0xff; //it gives you the byte at i 
     //Do your cool stuff... 

    } 
    } 
}; 

xhr.send(); 

Działa, jest powszechny ... ale ... wciąż jest hackerem.

Z Żądaniem XHTML, poziom 2, można określić responseType jako "arraybuffer" i faktycznie otrzymać ArrayBuffer. Jest o wiele ładniej. Problem polega na sprawdzeniu, czy twoja przeglądarka obsługuje tę funkcję.

var xhr = new XMLHttpRequest(); 
xhr.open('GET', '/your/audio/file.wav', true); 
xhr.responseType = 'arraybuffer'; 

xhr.onload = function(e) { 
    if (this.status == 200) { 
    //Do your stuff here 
    } 
}; 

xhr.send(); 

Mam nadzieję, że pomogłem.

1

Pobrałem dane z serwera jako ciąg (który jest zakodowany w base64), używając ajax get json, a następnie po stronie klienta zdekodowałem go do base64, a następnie do bufora tablicowego.

Kod próbki

function solution1(base64Data) { 

var arrBuffer = base64ToArrayBuffer(base64Data); 

// It is necessary to create a new blob object with mime-type explicitly set 
// otherwise only Chrome works like it should 
var newBlob = new Blob([arrBuffer], { type: "application/pdf" }); 

// IE doesn't allow using a blob object directly as link href 
// instead it is necessary to use msSaveOrOpenBlob 
if (window.navigator && window.navigator.msSaveOrOpenBlob) { 
    window.navigator.msSaveOrOpenBlob(newBlob); 
    return; 
} 

// For other browsers: 
// Create a link pointing to the ObjectURL containing the blob. 
var data = window.URL.createObjectURL(newBlob); 

var link = document.createElement('a'); 
document.body.appendChild(link); //required in FF, optional for Chrome 
link.href = data; 
link.download = "file.pdf"; 
link.click(); 
window.URL.revokeObjectURL(data); 
link.remove(); 

}

function base64ToArrayBuffer(data) { 
var binaryString = window.atob(data); 
var binaryLen = binaryString.length; 
var bytes = new Uint8Array(binaryLen); 
for (var i = 0; i < binaryLen; i++) { 
    var ascii = binaryString.charCodeAt(i); 
    bytes[i] = ascii; 
} 
return bytes; 

};

Powiązane problemy