JavaScript는 어떻게 다른 브라우저에서 로컬 파일 내용을 읽을 수 있습니까?

다양한 브라우저의 JavaScript로 클라이언트측 파일 내용 읽기

브라우저를 사용하여 클라이언트 시스템에서 파일 내용을 읽으려고 하면 스크립트 전용 솔루션은 Firefox 및 Internet Explorer용으로 개발되었습니다. 이 솔루션은 Firefox용 파일 API와 Internet Explorer용 ActiveXObject를 활용합니다.

Firefox용 파일 API

function getFileContents() {
    var fileForUpload = document.forms[0].fileForUpload;
    var fileName = fileForUpload.value;

    if (fileForUpload.files) {
        var fileContents = fileForUpload.files.item(0).getAsBinary();
        document.forms[0].fileContents.innerHTML = fileContents;
    }
}

Internet Explorer용 ActiveXObject

function ieReadFile(filename) 
{
    try
    {
        var fso  = new ActiveXObject("Scripting.FileSystemObject"); 
        var fh = fso.OpenTextFile(filename, 1); 
        var contents = fh.ReadAll(); 
        fh.Close();
        return contents;
    }
    catch (Exception)
    {
        return "Cannot open file :(";
    }
}

크로스 브라우저 지원

단, Safari, Chrome 등 다른 브라우저에서는 위의 방법으로 이 작업을 수행할 수 있는 알려진 방법이 없습니다. 이러한 브라우저에 구현된 파일 API는 파일 이름과 파일 크기에 대한 액세스만 제공하며 콘텐츠를 읽는 기능은 부족합니다.

파일 API 업데이트

파일 이후 API는 IE 10 이상을 포함한 대부분의 최신 브라우저에서 표준화되고 구현되었습니다. 이 API는 비동기식 파일 읽기, 바이너리 파일 처리 및 텍스트 인코딩 디코딩을 지원합니다.

var file = document.getElementById("fileForUpload").files[0];
if (file) {
    var reader = new FileReader();
    reader.readAsText(file, "UTF-8");
    reader.onload = function (evt) {
        document.getElementById("fileContents").innerHTML = evt.target.result;
    }
    reader.onerror = function (evt) {
        document.getElementById("fileContents").innerHTML = "error reading file";
    }
}

WebKit 및 HTML 5 제안

또는 원할 경우 제출할 수도 있습니다. HTML 5에 포함할 Mozilla API를 패치하거나 제안하여 향후 브라우저 간 호환성 가능성을 높입니다.

위 내용은 JavaScript는 어떻게 다른 브라우저에서 로컬 파일 내용을 읽을 수 있습니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!