FileAPI를 통한 파일 업로드

Question

하나의 함수로 여러 파일을 읽어야합니다. FileAPI를 사용해야합니다. 그러나 FileReader는 비동기 다운로드를 수행합니다. 함수 A의 끝에서 종료하지 않고 모든 파일의 내용을 가져올 수 있습니까, 안합니까?

Answer 1

FileReader은 아무 것도 다운로드하지 않으니까요. 디스크 내용을 비동기 적으로 메모리로 읽습니다. 그들이 모두 완료하면

는 콜백을, 당신이 원하는 것을 바로 읽기 파일을 추적하고 호출하려면 :

document.querySelector('[type="file"]').change = function(e) { 
    handleFiles(toArray(e.target.files), function(results) { 
    // results is an Array containing the FileReader results. 
    alert('Done!'); 
    }); 

function toArray(list) { 
    return Array.prototype.slice.call(list || [], 0); 
} 

function handleFiles(files, callback) { 
    var results = []; 

    files.forEach(function(file, i) { 
    var reader = new FileReader(); 

    // Closure to capture the file information. 
    reader.onload = function(e) { 
     results.push(e.target.result); 
     if (results.length == files.length) { 
     callback(results); 
     } 
    }; 
    reader.readAsDataURL(file); 
    }); 
} 

을보십시오 : 코드 예제 및 링크 http://jsbin.com/epatel/3/edit#html,live