데이터 인코딩/디코딩 종합 가이드
웹 개발에서 데이터 인코딩은 필수적인 기술입니다. Base64, URL 인코딩 등 주요 인코딩 방식을 이해하고 실무에 적용하는 방법을 알아봅니다.
1. 인코딩의 기본 개념
왜 인코딩이 필요한가?
- 바이너리 데이터를 텍스트로 전송
- URL에 특수문자 안전하게 포함
- 데이터 무결성 보장
- 다양한 시스템 간 호환성
2. Base64 인코딩 심화
Base64란?
바이너리 데이터를 64개의 ASCII 문자로 표현하는 방식입니다.
// Base64 인코딩
const text = "Hello, World!";
const encoded = btoa(text);
console.log(encoded); // "SGVsbG8sIFdvcmxkIQ=="
// Base64 디코딩
const decoded = atob(encoded);
console.log(decoded); // "Hello, World!"
실무 활용
- 이미지를 Data URL로 변환
- API 인증 토큰
- 이메일 첨부파일
- JSON 내 바이너리 데이터 포함
3. URL 인코딩과 활용
URL 인코딩이 필요한 이유
URL에는 특정 문자(?, &, =, #, / 등)가 특별한 의미를 가지므로 인코딩이 필요합니다.
// URL 인코딩
const param = "안녕하세요! Hello?";
const encoded = encodeURIComponent(param);
console.log(encoded);
// "%EC%95%88%EB%85%95%ED%95%98%EC%84%B8%EC%9A%94!%20Hello%3F"
// URL 디코딩
const decoded = decodeURIComponent(encoded);
console.log(decoded); // "안녕하세요! Hello?"
함수 비교
encodeURI(): 전체 URL 인코딩 (/, ?, & 등은 유지)encodeURIComponent(): 쿼리 파라미터 인코딩 (모든 특수문자 인코딩)