Javascript | 브라우저에서 자바스크립트로 엑셀파일로 다루기 (xlsx)

사내 관리자 페이지 작업 중, 유저 리스트에 대한 정보를 엑셀로 다운로드하는 기능을 요청 받았다. xlsx 라이브러리를 사용해 간단하게 구현 할 수 있었다.

​

---

Excel 파일 만들기

2차원 배열 or json형식의 데이터를 엑셀 파일로 만들수 있다.
​

1. 2차원 배열 xlsx

XLSX를 사용하는 방법은 아래 코드와 같다

const aoa_data = [
  ["이름", "나이"],
  ["karo", "29"],
  ["mui", "32"],
];

const createXlsx = () => {
	const XLSX = require("xlsx");
	// 워크북 만들기
    const workbook = XLSX.utils.book_new();
	// 워크 시트 만들기 (2차원 배열을 넘긴다)
    const worksheet = XLSX.utils.aoa_to_sheet(aoa_data);

	// 워크북에 워크시트 추가하기
	// 마지막 파라미터에 sheet명을 입력해준다.
    XLSX.utils.book_append_sheet(workbook, worksheet, "sheet_one");
    XLSX.utils.book_append_sheet(workbook, worksheet, "sheet_two");

	// 생성할 엑셀 워크북과 엑셀 파일 명을 넘겨준다.
    XLSX.writeFile(workbook, "aoa.xlsx");
};

​
​

2. json파일 엑셀파일로 만들기

2차원 배열을 했을 때와 거의 동일하다

워크시트를 만들때 메서드를 aoa_to_sheet에서 json_to_sheet로 변경해준다.

const json_data = [
  { 이름: "karo", 나이: "9" },
  { 이름: "mui", 나이: "2" },
];

const createXlsx = () => {
	const XLSX = require("xlsx");
	// 워크북 만들기
    const workbook = XLSX.utils.book_new();
	// 워크 시트 만들기 (json 데이터를)
	const worksheet = XLSX.utils.json_to_sheet(json_data);

	// 워크북에 워크시트 추가하기
	// 마지막 파라미터에 sheet명을 입력해준다.
    XLSX.utils.book_append_sheet(workbook, worksheet, "sheet_one");
    XLSX.utils.book_append_sheet(workbook, worksheet, "sheet_two");

	// 생성할 엑셀 워크북과 엑셀 파일 명을 넘겨준다.
    XLSX.writeFile(workbook, "json.xlsx");
};

​

---

Excel 파일 읽기

필요하진 않았지만 이왕 하는거 엑셀 파일을 읽어보는것까지 시도해봤다.

엑셀파일의 데이터를 뽑을때도 2차 배열 혹은 json형태로 데이터를 받을수 있었다.

const readExcel = (e: React.ChangeEvent<HTMLInputElement>) => {
    const XLSX = require("xlsx");

    if (e.target.files) {
      const file = e.target.files[0];

      const reader = new FileReader();

      reader.onload = function (e) {
        if (e.target) {
          // 엑셀 파일을 워크북으로 변환
          const workbook = XLSX.read(e.target.result, { type: "binary" });
          // 시트 선택
          const sheetName = workbook.SheetNames[0];
          const worksheet = workbook.Sheets[sheetName];

          // 워크시트를 JSON 형식으로 변환
          const json = XLSX.utils.sheet_to_json(worksheet);
          // option파라미터에 header:1을 설정해주면 2차원 배열로 변환
          const aoa = XLSX.utils.sheet_to_json(worksheet, { header: 1 });

          console.log(json);
          console.log(aoa);
        }
      };

      reader.readAsArrayBuffer(file);
    }
  };

<input type="file" onChange={readExcel}></input>

​
​

참고
xlsx 라이브러리