💻개발자 필수 인코딩 지식 총정리 — Base64·URL·HTML·JSON
웹 개발을 하다 보면 Base64, URL 인코딩, HTML Entity, JSON 이스케이프 등 다양한 인코딩 방식을 만납니다. 각각 언제, 왜 사용하는지 헷갈리는 경우가 많습니다. 2026년 기준 실무에서 자주 쓰이는 4가지 인코딩을 한 곳에 정리했습니다.
4가지 인코딩 한눈에 비교
| 인코딩 종류 | 목적 | 입력 예시 | 출력 예시 |
|---|---|---|---|
| Base64 | 바이너리 → 텍스트 변환 | 안녕하세요 | 7JWI64WV7ZWY7IS47JqU |
| URL 인코딩 | URL 안전 전송 | 안녕하세요 | %EC%95%88%EB%85%95%ED%95%98%EC%84%B8%EC%9A%94 |
| HTML Entity | HTML 특수문자 표시 | <script> | <script> |
| JSON 이스케이프 | JSON 문자열 안전 처리 | He said "hi" | He said "hi" |
Base64 인코딩
Base64는 바이너리 데이터(이미지, 파일)를 ASCII 문자로 변환하는 방식입니다. 이메일 첨부파일, JWT 토큰, 이미지 인라인 삽입에 많이 사용됩니다.
// JavaScript
btoa("Hello") // "SGVsbG8="
atob("SGVsbG8=") // "Hello"
// Node.js
Buffer.from("Hello").toString("base64") // "SGVsbG8="
Buffer.from("SGVsbG8=", "base64").toString() // "Hello"
⚠️ Base64는 암호화가 아닙니다. 쉽게 디코딩되므로 민감 정보를 숨기는 용도로 사용하면 안 됩니다.
URL 인코딩 (퍼센트 인코딩)
URL에는 한글, 공백, 특수문자를 그대로 쓸 수 없습니다. 이를 %XX 형태로 변환하는 것이 URL 인코딩입니다.
// JavaScript
encodeURIComponent("안녕 세상") // "%EC%95%88%EB%85%95%20%EC%84%B8%EC%83%81"
decodeURIComponent("%EC%95%88%EB%85%95") // "안녕"
// 전체 URL은 encodeURI, 파라미터 값은 encodeURIComponent 사용
encodeURI("https://example.com/검색?q=안녕")
encodeURIComponent("검색?q=안녕") // 더 많은 문자 인코딩
HTML Entity 인코딩
HTML에서 <, >, &, " 등의 문자는 태그로 해석될 수 있어 Entity로 변환해야 합니다. XSS 방어의 핵심입니다.
| 원문 | HTML Entity | 주의사항 |
|---|---|---|
| < | < | 태그 시작 문자 |
| > | > | 태그 종료 문자 |
| & | & | Entity 시작 문자 |
| " | " | 속성값 구분 |
| ' | ' | 속성값 구분 |
JSON 이스케이프
JSON 문자열 값 안에 큰따옴표, 백슬래시, 제어 문자가 있으면 이스케이프 처리가 필요합니다.
// 자동 처리
JSON.stringify({ msg: 'He said "hello"' })
// {"msg":"He said "hello""}
자주 묻는 질문
Base64와 URL 인코딩의 결정적 차이는?
Base64는 바이너리 데이터를 텍스트로 변환하는 것이 목적이고, URL 인코딩은 URL에서 사용할 수 없는 문자를 안전하게 전송하는 것이 목적입니다. Base64 문자열을 URL 파라미터로 전송할 때는 URL-safe Base64(+→-, /→_)를 사용하거나 추가로 URL 인코딩해야 합니다.
XSS 방어에 어떤 인코딩을 써야 하나요?
사용자 입력을 HTML에 표시할 때는 반드시 HTML Entity 인코딩을 적용해야 합니다. JavaScript 컨텍스트에서는 JSON.stringify, URL 컨텍스트에서는 encodeURIComponent를 사용합니다. 각 컨텍스트에 맞는 인코딩이 중요합니다.
인코딩과 암호화의 차이는?
인코딩은 데이터를 다른 형식으로 변환하는 것으로 복원이 가능하고 보안 목적이 아닙니다. 암호화는 키 없이는 원본을 복원할 수 없어 보안을 보장합니다. Base64는 인코딩이므로 비밀번호 등 민감한 정보에 사용하면 안 됩니다.