View
이번에 엑셀다운로드를 구현하는 일을 맡게 되었다.
이전까지는 엑셀 다운로드를 할 때 단일 시트형식이었기 때문에 큰 어려움은 없었다.
하지만 이번에는 테이블에 따라 시트를 나눠달라는 요구사항이 추가 되었다.
여기저기 열심히 구글을 찾아본 결과 SheetJS를 이용하기로 했다.
가장 큰 이유는 상업적용도로 이용 가능하기 때문이었다.
👉 Is SheetJS open source?
오늘의 목표 : 구현된 테이블 별로 엑셀시트를 만들어 엑셀을 다운로드해보자
1 🔥 JS 파일 다운로드 받기
Download 행에 있는 버튼말고 버전 옆에 있는 버튼 이미지를 눌러야 다운로드 된다.
👉 FileSaver.min.js/v1.3.8
👉 xlsx.full.min.js/v14.3
스크립트 단에 해당 스크리브의 주소를 직접 호출해도 작동은 하지만 혹시 모르니 다운로드 받아 사용했다
2 🔥 SheetJS 함수 이용하기
👉 SheetJS_Doc
해당 사이트에 가면 각종 함수들 설명과 사용방법을 볼 수 있다.
일단 프론트단에 id="tb1", id="tb2", id="tb3"가 있다고 생각하고 함수를 만들어본다
function fnTbInfo_Excel() {
//XLSX.utils.book_new() 를 이용해서 새 통합 문서 객체 생성
workBook = XLSX.utils.book_new();
//테이블을 시트로 변환 (table_to_sheet 이용)
//워크북을 시트로 변환 (book_append_sheet 이용)
XLSX.utils.book_append_sheet(workBook , XLSX.utils.table_to_sheet(document.getElementById('tb1')), "tb1NAME");
XLSX.utils.book_append_sheet(workBook , XLSX.utils.table_to_sheet(document.getElementById('tb2')), "tb2NAME");
XLSX.utils.book_append_sheet(workBook , XLSX.utils.table_to_sheet(document.getElementById('tb3')), "tb3NAME");
XLSX.writeFile(workBook, 'excelTest.xlsx', { bookType: 'xlsx', type: 'binary' });
}
- XLSX.utils.book_append_sheet(workbook, 워크시트, 시트명)
- XLSX.utils.table_to_sheet(시트로 바꿀 테이블)
- XLSX.writeFile(워크북, 엑셀이름, 옵션)
이렇게 넣어주면 해당 테이블을 이용해
시트별로 엑셀이 만들어진다!
나는 테이블을 엑셀로 만드는 것이 필요했기 때문에 이 함수들을 썼지만
혹시 다른 것이 필요하다면 저 SheetJS DOC 문서를 참고하시길
다음에 이어지는 포스팅으로는 시트별로 나누어진 엑셀에서
데이터를 JSON형식으로 가져와 처리하는 방법을 적을 예정입니다
'JavaScript' 카테고리의 다른 글
javascript :: CapsLock 버튼 감지하기 (0) | 2023.10.10 |
---|---|
javascript :: POST 방식으로 새 창 띄우기 (0) | 2022.03.08 |
javascript :: keyCode 목록과 keycode 이벤트 이용하여 엔터키 실행하기 (0) | 2020.08.04 |
reply