관리 메뉴

즐겁게, 코드

문자열에 약한 남자 본문

👨🏻‍💻 기록/기타

문자열에 약한 남자

Chamming2 2021. 6. 14. 18:33

한기대의 코인 이라는 프로젝트에서 영감을 얻어 시간표 부분을 항공대 버전으로 만들어볼 계획을 세우고 있었습니다.

(※ 저희 학교는 에브리타임 시간표 자동 불러오기를 지원하지 않아 학우들의 불만이 꽤 있습니다. 작은 학교 슬퍼요 ㅠ__ㅠ)

이미지) 코인 - 한기대 커뮤니티 서비스

아무튼 공사를 앞두고 어찌저찌 과목 정보까지는 가져오는데 성공했는데, 뭔가 쎄한걸 느꼈습니다.

획득한 과목 정보 텍스트 파일
Node.js 스트림으로 입/출력해본 결과물

두 텍스트가 약간씩 다른게 보이시나요?

분명 겉으로 봤을때는 멀쩡했는데, 노드 입출력을 거치니 "항우기학부" 는 "항우기학" 이 되어있고 "배재성" 은 "배재" 가 되어 있네요. 😣

 

벌써 어지러워졌지만 원인을 찾아 보기로 했습니다.

1. 인코딩을 의심하자

첫 번째로 의심한건 바로 인코딩이었습니다.

아니나 다를까 뭔가 이상하긴 했는데요, 응답 헤더에 담긴 인코딩 타입이 UTF-8이 아닌 EUC-KR 타입인걸 보고 쉽게 풀리나 했습니다.

그래서 이 블로그를 참고해 iconv-lite 모듈로 인/디코딩을 진행했지만, 그 결과 "占싱곤옙16:00~21:00占쏙옙 회占쏙옙占쏙옙..." 이라는 흥겨운 내용으로 파일이 변해버렸었네요.

 

[Node.js] iconv-lite 이용하여 한글(여러 언어) utf-8 에서 hex, mbcs 로 변환하기

Node.js로 긴급하게 스크립트를 짜다가 인코딩 관련 문제에 부딪혔습니다. 아무래도 문자열 관련 작업이다 보니, 필연적이었겠지만.. 또한, 한글 뿐만 아니라 여러 언어에서도 인코딩이 가능해야

blankspace-dev.tistory.com

그렇게 占쏙옙 리듬에 빠져있던 중 이상한 점을 하나 발견했는데요!

2. BOM? BOMB!

불러온 파일을 잘 보면 빨간 점들이 찍혀있다는 것이었습니다.

 

이게 무슨 의미인가 궁금해서 검색해 봤더니 "출력 불가능한 문자" 가 포함되어 있을때 나타나는 현상이라고 하는데, 이렇게 된 이유는 아마 UTF-8 인코딩에 BOM(Byte Order Mark)가 포함되었을 것이라는 답변을 확인할 수 있었습니다!

 

JSON response format error - red dot\bullet before response

I am sending an AJAX request expecting JSON response. However, the returned JSON is preceded with a red dot\bullet which is causing a parse error. Here is a screenshot from Postman: The dot is not

stackoverflow.com

아무튼 BOM을 박살내기 위해 맥의 BBEdit이라는 텍스트 편집기로 파일을 열어본 결과, 새빨간 적들을 확인할 수 있었습니다.

어... 그런데 이유는 모르겠지만 BBEdit으로 BOM을 날리면 한국어와 물결 기호가 함께 삭제되는 문제가 있었습니다.

답을 찾은 것 같았었는데, 여기서 막힐 때는 정말 서러웠네요. 😂

3. 킹갓패드, 그리고 진짜 범인

그렇게 첫 번째 실패가 끝나고 근-본의 노트패드로 파일을 열어봤습니다.

엥? 이전과는 다르게 BS라는 기호들이 막 추가되어 있는 모습인데요, 바로 여기서 진범을 찾게 되었습니다.

바로 저 빨간 점들의 정체가 BackSpace 문자였던 건데요, 그래서 빨간 점 앞에 있던 문자들이 하나씩 잘려 출력되는 것이었습니다!

(※ BackSpace처럼 특정 동작을 수행할 수 있는 문자를 Control Character(제어 문자)라고 합니다.)

 

그럼 이어서 제어 문자를 해치워 볼텐데요, 제어 문자는 라이브러리 없이도 간단하게 파싱할 수 있습니다.

// 제어 문자를 걸러내는 코드
const trimmed = 문제가_있는_문자열.replace(/[\x00-\x09\x0B-\x0C\x0E-\x1F\x7F-\x9F]/g, "");

문제가 해결된 모습입니다.

덕분에 노드에서 파일을 읽고 쓰는법을 조금 더 알아볼 수 있었고, BOM의 개념과 함께 인코딩에 대해 배워볼 수 있었습니다.

 

P.S. 다만 학교에서 왜 파일 사이사이에 BS 문자를 넣어둔지는 의문이네요! (부비트랩)

관련 검색어

  • red dot with response text file
  • missing text in utf8 format file
반응형

'👨🏻‍💻 기록 > 기타' 카테고리의 다른 글

교내 게시판 API 서버 분석 기록  (0) 2021.02.27
Comments
소소한 팁 : 광고를 눌러주시면, 제가 뮤지컬을 마음껏 보러다닐 수 있어요!
와!! 바로 눌러야겠네요! 😆