JavaScript에서 객체의 파일 이름을 얻는 방법은 무엇입니까?

Question

사용자가 서버의 특정 파일을 업로드 할 수있는 응용 프로그램과 함께 작업하고 있습니다. 그리고 그것은 잘 작동합니다. 하지만 이제는 사용자가 특정 형식의 파일 만 업로드 할 수 있도록 JavaScript를 통해 파일 끝을 확인하려고합니다. 예 : * .txt

그러므로 파일 이름을 읽고 결말을 확인하고 싶습니다. 내 문제는, 그 파일 이름에 액세스하는 방법을 모른다. 나는 그것을 통해 문자열의 가치를 얻는 것이 매우 간단하다는 것을 안다 : document.getElementById ('Field'). value -> 이것은 나를 위해 일한다.

하지만 파일의 파일 이름은 어떻게 액세스 할 수 있습니까? fileReader와 같은 파일로 변환해야합니까? 파일 이름을 가져 오는 더 쉬운 방법은 없습니까?

업데이트 : HTML5 솔루션은 저에게 적합하지 않습니다. File-API 없이는 그렇게 할 수있는 다른 방법이 없습니까?

Answer 1

File API을 사용하면 파일 세부 정보에 액세스 할 수 있습니다.

// fileInput is a HTMLInputElement: <input type="file" multiple id="myfileinput"> 
var fileInput = document.getElementById("myfileinput"); 

// files is a FileList object (simliar to NodeList) 
var files = fileInput.files; 

for (var i = 0; i < files.length; i++) { 
    alert("Filename " + files[i].name); 
} 

Answer 2

두 가지 방법이 있습니다.

이미 지적한대로 입력 값을 확인할 수도 있고 브라우저가 HTML5 File API를 지원하면이 값을 사용하여 파일 이름을 결정할 수 있습니다.

document.getElementById('file').addEventListener('change', function(e) { 
    console.log(e.target.files[0].name); //myFile.txt 
}); 

이 방법을 사용하면 MIME 형식을 확인하여 콘텐츠 형식을 확인할 수도 있습니다.

document.getElementById('file').addEventListener('change', function(e) { 
    var type = e.target.files[0].type; 
    if(type === 'text/plain') //File contains plain text 
});