javascript readAsArrayBuffer restituisce il buffer di array vuoto

Sto provando a leggere un file locale utilizzando la proprietà ReadAsArrayBuffer di FileReader. La lettura è riuscita e nel callback "onload", vedo l'oggetto Array Buffer in reader.result. Ma l'Array Buffer è solo vuoto. La lunghezza è impostata, ma non i dati. Come ottengo questi dati?javascript readAsArrayBuffer restituisce il buffer di array vuoto

Ecco il mio codice

<!DOCTYPE html> 
<html> 

<body> 
    <input type="file" id="file" /> 
</body> 

<script> 
    function handleFileSelect(evt) { 

     var files = evt.target.files; // FileList object 

     var selFile = files[0]; 
     var reader = new FileReader(); 
     reader.onload = function(e) { 
      console.log(e.target.result); 
     }; 

     reader.onerror = function(e) { 
      console.log(e); 
     }; 
     reader.readAsArrayBuffer(selFile); 
    } 


    document.getElementById('file').addEventListener('change', handleFileSelect, false); 
</script> 

</html>

l'output su console per reader.result

e.target.result 
ArrayBuffer {} 
e.target.result.byteLength 
25312

Qualcuno può dirmi come ottenere questi dati? c'è qualche problema di sicurezza? Non c'è nessun errore, l'onerror non viene eseguito.

Dai commenti: Per favore fatemi sapere come accedere al contenuto del buffer? In realtà sto provando a riprodurre un file audio usando AudioContext ... Per quello avrei bisogno dei dati del buffer ...

fonte

2014-06-05 Anand N

Perché pensi che la il buffer è vuoto? Il tuo codice in realtà non accede/ispeziona il contenuto del buffer. Forse sei confuso dall'output di 'console.log'? 'console.log()' non stamperà il contenuto del buffer. – nmaier

Grazie nmaier, ho pensato lo stesso ... ma non so come accedere al contenuto del buffer ... Per favore, fammi sapere come accedere al contenuto del buffer? In realtà sto provando a riprodurre un file audio utilizzando AudioContext ... Per questo avrei bisogno dei dati del buffer ... Molte grazie per il tuo aiuto –

Stai utilizzando l'evento onload invece dell'evento onloadend. Il codice funzionerà se si sostituisce l'evento onload da onloadend. Vedi: https://developer.mozilla.org/en-US/docs/Web/API/FileReader – seb

Beh, riprodurre un suono usando la roba AudioContext non è poi così difficile.

Impostare il contesto.
Carica tutti i dati nel buffer (ad esempio FileReader per i file locali, XHR per le cose remote).
Imposta una nuova sorgente e avvialo.

Tutto sommato, qualcosa di simile:

var context = new(window.AudioContext || window.webkitAudioContext)(); 

function playsound(raw) { 
    console.log("now playing a sound, that starts with", new Uint8Array(raw.slice(0, 10))); 
    context.decodeAudioData(raw, function (buffer) { 
     if (!buffer) { 
      console.error("failed to decode:", "buffer null"); 
      return; 
     } 
     var source = context.createBufferSource(); 
     source.buffer = buffer; 
     source.connect(context.destination); 
     source.start(0); 
     console.log("started..."); 
    }, function (error) { 
     console.error("failed to decode:", error); 
    }); 
} 

function onfilechange(then, evt) { 
    var reader = new FileReader(); 
    reader.onload = function (e) { 
     console.log(e); 
     then(e.target.result); 
    }; 
    reader.onerror = function (e) { 
     console.error(e); 
    }; 
    reader.readAsArrayBuffer(evt.target.files[0]); 
} 


document.getElementById('file') 
    .addEventListener('change', onfilechange.bind(null, playsound), false);

Vedi questo live in un jsfiddle, che lavora per me in Firefox e Chrome.

Ho gettato un console.log(new Uint8Array()) per buona misura, in quanto il browser di solito registra i contenuti direttamente (se il buffer non è enorme). Per altre cose che è possibile fare con ArrayBuffer s, vedere ad es. il corresponding MDN documentation.

fonte

2014-06-06 07:33:30 nmaier

Ho anche fatto la stessa cosa, ma ricevevo un errore durante la riproduzione del suono ... Anche il violino che mi hai dato ha dato lo stesso errore. Qui di seguito è ** ** output della console 'ProgressEvent ora riproduzione di un suono, che inizia con Uint8Array [10] non è riuscito a decodificare: null' –

Forse si sta cercando di caricare un po 'di formato di file che isn supportato? Non tutti i browser (su tutte le piattaforme) supportano tutti i formati audio. Come ho detto: ho testato questo violino in Chrome e Firefox (29 e Nightly) su OSX 10.9 e funziona per me. – nmaier

Oh no, ho il problema, Ho provato a riprodurre un file mp3 e un file ogg. Sembra che siano corrotti. Ho scaricato dallo stesso sito in cui stavo cercando di trovare alcuni esempi di contesto audio ... Stavo provando tante alternative, pensando a qualche problema con il codice, ho semplicemente perso tutto il mio giorno ... Proverò a suonare qualche altro file e vedere se funziona ... –

Ecco come leggere buffer di matrice e convertirlo in stringa binaria,

function onfilechange(evt) { 
var reader = new FileReader(); 
reader.onload = function(evt) { 
    var chars = new Uint8Array(evt.target.result); 
    var CHUNK_SIZE = 0x8000; 
    var index = 0; 
    var length = chars.length; 
    var result = ''; 
    var slice; 
    while (index < length) { 
    slice = chars.subarray(index, Math.min(index + CHUNK_SIZE, length)); 
    result += String.fromCharCode.apply(null, slice); 
    index += CHUNK_SIZE; 
    } 
    // Here you have file content as Binary String in result var 
}; 
reader.readAsArrayBuffer(evt.target.files[0]); 
}

Se si tenta di stampare ArrayBuffer via console.log si ottiene sempre oggetto vuoto {}

fonte

2014-09-03 19:40:12

Come si converte la stringa binaria in buffer di array –

javascript readAsArrayBuffer restituisce il buffer di array vuoto

risposta

Problemi correlati