javascript readAsArrayBuffer가 빈 배열 버퍼를 반환합니다.

FileReader readAsArrayBuffer 속성을 사용하여 로컬 파일을 읽으려고합니다. 읽기 성공이며 "onload"콜백에서 reader.result의 Array Buffer 객체를 볼 수 있습니다. 그러나 어레이 버퍼는 단지 비어 있습니다. 길이는 설정되지만 데이터는 설정되지 않습니다. 이 데이터를 얻으려면 어떻게해야합니까? 여기javascript readAsArrayBuffer가 빈 배열 버퍼를 반환합니다.

내 코드

<!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>

reader.result

의 콘솔 출력

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

사람이 어떻게 데이터를 얻을하는 방법을 말해 줄래? 보안 문제가 있습니까? 오류가 없으면 오류가 실행되지 않습니다.

의견 : 버퍼 내용에 액세스하는 방법을 알려주십시오. AudioContext을 사용하여 오디오 파일을 실제로 재생하려고합니다 ... 버퍼 데이터가 필요합니다 ...

출처

2014-06-05 Anand N

은 왜 생각하십니까 버퍼가 비어 있습니까? 코드가 실제로 버퍼 내용을 액세스/검사하지 않습니다. 아마도'console.log' 결과물에 혼란 스러울 것입니까? 'console.log()'는 버퍼의 내용을 출력하지 않습니다. – nmaier

감사합니다 nmaier, 나는 같은 생각 ...하지만 버퍼 내용에 액세스하는 방법을 모르겠다 ... 버퍼 내용에 액세스하는 방법을 알려주시겠습니까? AudioContext를 사용하여 오디오 파일을 재생하려고합니다 ... 버퍼 데이터가 필요합니다 ... 많은 도움을주었습니다 –

onloadend 이벤트 대신 onload 이벤트를 사용하고 있습니다. onloadend로 onload 이벤트를 대체하면 코드가 작동합니다. 참조 : https://developer.mozilla.org/en-US/docs/Web/API/FileReader – seb

음, AudioContext을 사용하여 사운드를 재생하는 것은 실제로 그렇게 어렵지 않습니다.

컨텍스트를 설정하십시오.
버퍼에 데이터를로드하십시오 (예 : 로컬 파일의 경우 FileReader, 원격 파일의 경우 XHR).
새 소스를 설정하고 시작하십시오. 모두

모든이 같은 :

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

가 파이어 폭스와 크롬에 나를 위해 작동하는 jsfiddle,이 라이브를 참조하십시오.

브라우저가 보통 (버퍼가 거대하지 않은 경우) 직접 내용을 기록하기 때문에 나는 좋은 조치로 console.log(new Uint8Array())을 던졌습니다. ArrayBuffer으로 수행 할 수있는 다른 작업에 대해서는 예 : corresponding MDN documentation. 여기

출처

2014-06-06 07:33:30 nmaier

나는 또한 같은 일을했지만 소리를 재생하는 동안 오류가 발생했습니다. 나에게 준 피들 역시 같은 오류를주었습니다. 아래는 ** 지금 [10] 디코딩에 실패 Uint8Array로 시작하는 사운드를 재생 ** '의해 ProgressEvent 콘솔 출력 : null'이 –

어쩌면 당신은 외설 일부 파일 형식을로드하려는 지원되지 않습니까? 모든 브라우저에서 모든 오디오 형식을 지원하는 것은 아닙니다. 내가 말했듯이 : 나는 OSX 10.9에서 크롬과 파이어 폭스 (29와 야간)에서이 바이올린을 테스트했고 그것은 나를 위해 작동한다. – nmaier

아뇨, 문제가 생깁니다. MP3 파일과 ogg 파일을 재생 해 보았습니다. 그들은 부패한 것처럼 보입니다. 나는 오디오 컨텍스트 예제를 찾으려고 노력하고 있던 동일한 사이트에서 다운로드 ... 코드를 사용하여 몇 가지 문제를 생각하면서 많은 대안을 시도했지만 단지 하루 종일 낭비했습니다 ... 나는 다른 파일을보고 작동하는지 확인하십시오 ... –

배열 버퍼를 읽고 당신은 항상 빈 개체를 얻을 CONSOLE.LOG 통해 ArrayBuffer를 인쇄하려고하면, 바이너리 문자열로

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

를 변환하는 방법은 {}

출처

2014-09-03 19:40:12

어떻게하면 이진 문자열을 배열 버퍼로 변환하겠습니까? –

javascript readAsArrayBuffer가 빈 배열 버퍼를 반환합니다.

답변

관련 문제