[CS] Base64 인코딩이란

insung·2025년 4월 20일

CS

목록 보기
12/19

학습 자료: https://www.youtube.com/watch?v=CY-snpNApNM

정의

  • 이진 데이터를 ASCII 문자열로 변환하는 인코딩 방식.

Base64는 왜 사용하는가

  • 이진 데이터를 텍스트 기반 환경에서 안전하게 전송하고 처리하기 위해서

동작 방식

  1. 이진 데이터를 앞에서부터 3바이트 단위로 나눔.
  2. 나뉜 3바이트를 다시 6비트 단위로 분할.
  3. 각 6비트 값을 Base64 색인표에 따라 ASCII 문자로 매핑하여 문자열로 표현.
  4. 원본 데이터가 3바이트보다 작을 경우, 남은 부분을 0으로 채우고 패딩 문자 =을 추가.

6비트 인코딩 가능 이유

  • Base64에서 사용하는 ASCII 코드는 제어 문자를 제외한 64개의 문자(알파벳 대소문자, 숫자 0-9, +, /)로 구성된 테이블을 사용하기 때문.

패딩 문자 = 사용 이유

  • 현재 인코딩 중인 바이트의 길이가 3 미만일 경우, 6비트 단위로 매핑할 수 없는 부분이 생김. 이 빈 공간을 채우기 위해 =을 사용.

사용 사례

  • 작은 이미지/아이콘 인라인 처리: 서버 요청 없이 브라우저에서 직접 로드. Webpack 등 번들러에서 지원.
  • 데이터 손실 없는 문자열 변환: JWT 인증 토큰 등에서 정보 손실 방지.

JWT와 Base64

  • JWT는 HTTP 헤더나 URL 파라미터로 전달되므로 문자열 형태여야 함.
  • 헤더와 페이로드는 JSON 데이터이므로, 문자열로 안전하게 변환하기 위해 Base64 인코딩 사용.
  • URL 파라미터에 안전한 문자열 생성을 위해 +, /, = 등의 특수문자가 제외된 URL-safe Base64 인코딩 사용.
  • JWT Base64 인코딩 관련 명세는 RFC 7519 문서에서 확인 가능.

단점

  • 데이터 크기 증가: 약 33% 증가. 3바이트가 4바이트로 변환되기 때문.
  • 로딩 속도 저하: 큰 이미지 Base64 인코딩 시, 미적용 시 대비 로딩 속도 감소 가능.
  • 캐싱 비효율: 이미지 단위 캐싱 불가능. HTML 문서와 함께 캐싱됨.
profile
안녕하세요 프론트엔드 관련 포스팅을 주로 하고 있습니다

0개의 댓글