[JavaScript] BOM(Byte Order Mark)을 이용한 CSV 파일 내보내기 한글 깨짐 현상 해결

BOM(Byte Order Mark)이란

문서 맨 앞에 눈에 보이지 않는 특정 바이트(byte)를 넣은 다음 이것을 해석해서 정확히 어떤 인코딩 방식이 사용되었는지 알아내는 방법.
인코딩 방식이 little-endian인지 big-endian인지 UTF-8인지 쉽게 알 수 있도록, 유니코드 파일이 시작되는 첫부분에 보이지 않게 2~3바이트의 문자열을 추가하는 것이다.

유니코드란

유니코드는 글자와 코드가 1:1매핑되어 있는 ‘코드표'이다. 국제적으로 전세계 언어를 모두 표시할 수 있는 표준코드.

인코딩이란

유니코드를 통해 코드표가 정의되었다. 남은 것은 그 ‘코드'가 컴퓨터에 어떻게 저장되어야 하는 것이다. 다른 말로 인코딩(encoding)이라고 하는데, 컴퓨터가 이해할 수 있는 형태로 바꿔주는 것이다.

UTF-8은 유니코드를 인코딩(encoding)하는 방식이다. 전세계에서 사용하는 약속이다.

CSV 파일 내보내기 시 한글 깨짐 현상 해결법

이는 결국 UTF-8 인코딩 과정에서 생긴 이슈이므로 \ufeff(UTF-8 문자열 BOM)을 추가해 해결하면 된다.

var blob = new Blob(["\ufeff"+csv], {type: 'text/csv;charset=utf-8;'});

참조

유니코드 BOM(Byte Order Mark)
자바스크립트에서 csv 파일 생성시 한글 깨짐 문제 해결
Unicode와 UTF-8 간단히 이해하기