[javscript/jquery] 자바스크립트 sheet.js 로 엑셀 읽기 예제

[javscript/jquery] 자바스크립트 sheet.js 로 엑셀 읽기 예제

 

자바스크립트로 엑셀을 업로드하여

 

읽는 방법을 공유합니다.

 

우선 페이지 상단에 아래와 같은 cdn 엑셀 js 를 로드합니다.

 

<script src="https://cdnjs.cloudflare.com/ajax/libs/xlsx/0.16.9/xlsx.full.min.js"></script>

 

그리고 업로드 액션을 동작시킬 file input 을 선언한 후 

 

onchange 액션을 걸어줍니다.

<input type="file" id="id_file_upload" onchange="upload(event)"/>

 

그리고 나서 onchange 액션시 동작할

 

스크립트를 아래와 같이 작성해줍니다!

<script>
function upload(event){
    var input = event.target;
    var reader = new FileReader();
    reader.onload = function(){
        var fdata = reader.result;
        var read_buffer = XLSX.read(fdata, {type : 'binary'});
        read_buffer.SheetNames.forEach(function(sheetName){
            var rowdata =XLSX.utils.sheet_to_json(read_buffer.Sheets[sheetName]);
            console.log(JSON.stringify(rowdata));
        })
    };
    reader.readAsBinaryString(input.files[0]);
}
</script>

 

위 스크립트에서 console.log 를 출력해놨으니 업로드 하신 내용을

 

크롬 개발자 모드에서 확인해보시면 됩니다!!!

 

 

엑셀버전은 아래 링크타고 들어가시면 잘 나와있으니 확인 후 사용하시면 됩니다!

 

참고들하세요!

 

문서와 소스 링크 : https://github.com/SheetJS/js-xlsx

SheetJS/sheetjs

 

버전 링크 : cdnjs.com/libraries/xlsx

xlsx - Libraries - cdnjs - The #1 free and open source CDN built to make life easier for developers