[EXT-032][실무] 글자와 UTF-8 바이트 안전하게 바꾸기 > IT 기술 공유

• 목록

[이번 수업]

프로그램의 문자열을 파일이나 네트워크로 보내려면 글자를 바이트, 즉 0부터 255까지의 숫자 묶음으로 바꿔야 합니다. 이번에는 웹 표준 API인 TextEncoder와 TextDecoder로 UTF-8 변환을 하고, 잘못된 바이트를 조용히 고칠지 오류로 중단할지 선택합니다.

[선수지식]

JavaScript 변수, 배열, try/catch를 알고 터미널에서 Node.js 파일을 실행할 수 있으면 됩니다. EXT-031의 유니코드 문자열과 대체 문자 개념을 먼저 보면 좋습니다.

[학습목표]

1. 문자열과 바이트 배열의 차이를 설명한다.
2. UTF-8로 인코딩하고 다시 문자열로 디코딩한다.
3. 손상된 입력에 replacement와 fatal 정책을 알맞게 적용한다.

[핵심개념]

인코딩은 글자를 정해진 숫자 규칙으로 바꾸는 일이고, 디코딩은 그 반대입니다. UTF-8은 유니코드 문자를 1~4바이트로 표현합니다. 따라서 화면의 글자 수와 저장 공간의 바이트 수는 같지 않을 수 있습니다.

TextEncoder는 문자열을 UTF-8 Uint8Array로 만듭니다. Uint8Array는 각 칸에 0~255를 담는 바이트 배열입니다. TextDecoder는 바이트를 문자열로 되돌리며, 문자 인코딩 이름을 생략하면 UTF-8을 사용합니다.

잘못된 바이트를 만났을 때 기본 디코더는 replacement 모드로 U+FFFD 대체 문자(�)를 넣고 계속합니다. 반면 { fatal: true }를 지정하면 TypeError를 던집니다. 화면 미리보기처럼 일부 표시가 더 중요한 곳은 replacement를 검토할 수 있지만, 식별자·서명 입력·설정 파일처럼 원문 보존이 중요한 곳은 fatal로 실패를 드러내는 편이 안전합니다.

[따라하기]

아래 내용을 text-bytes.mjs로 저장합니다.

```js
const encoder = new TextEncoder();
const bytes = encoder.encode('한글 A');
console.log([...bytes].join(' '));
console.log(new TextDecoder('utf-8').decode(bytes));

const invalid = Uint8Array.of(0xC3, 0x28);
console.log(new TextDecoder('utf-8').decode(invalid));

try {
  new TextDecoder('utf-8', { fatal: true }).decode(invalid);
} catch (error) {
  console.log(error.name);
}
```

터미널에서 실행합니다.

```text
node text-bytes.mjs
```

예상 결과는 다음과 같습니다.

```text
237 149 156 234 184 128 32 65
한글 A
�(
TypeError
```

Windows PowerShell, macOS 터미널, Linux 셸에서 실행 명령은 같습니다. 다만 터미널 글꼴에 따라 �의 모양은 조금 다를 수 있습니다. 첫 줄은 ‘한’과 ‘글’이 각각 3바이트, 공백과 A가 각각 1바이트라서 모두 8개의 숫자가 나옵니다.

[흔한 실수]

charCodeAt() 결과를 UTF-8 바이트로 착각하지 마세요. 이 메서드는 UTF-16 코드 단위를 돌려주므로 이모지 같은 문자를 그대로 전송할 수 없습니다. 또한 text.length와 bytes.length를 같은 크기로 가정하면 한글과 이모지에서 버퍼 계산이 틀어집니다. 손상된 입력을 기본 디코더로 읽고도 정상 데이터라고 판단하는 실수도 흔합니다. 발신자와 수신자가 사용할 인코딩을 합의하고, 정확성이 필요하면 fatal 정책으로 검증하세요.

[보안 주의]

인코딩은 암호화가 아니므로 변환된 바이트에 비밀번호나 토큰을 그대로 기록하거나 로그로 남기지 마세요. 외부 입력은 먼저 허용할 최대 바이트 크기를 정한 뒤 처리해 메모리 고갈을 막습니다. 디코딩 오류를 대체 문자로 숨기면 서로 다른 원문이 같은 표시로 보일 수 있으므로 권한 식별자나 보안 판단에는 fatal 디코딩과 별도 형식 검증을 사용하세요. 실습은 본인 소유의 로컬 파일과 예제 바이트로만 진행합니다.

[직접 해볼 과제]

문자열을 ‘A