유틸리티

Base64 인코딩 쉽게 이해하기 - 이미지를 텍스트로 바꾸는 원리

웹 개발을 하다 보면 Base64라는 단어를 자주 만나게 됩니다. 이미지를 텍스트로 변환한다니, 처음엔 이해하기 어려울 수 있습니다. 오늘은 Base64가 무엇이고 어디에 쓰이는지 쉽게 설명해보겠습니다.

Base64란?

Base64는 바이너리 데이터(이미지, 파일 등)를 텍스트 문자로 변환하는 인코딩 방식입니다. 0과 1로 이루어진 데이터를 A-Z, a-z, 0-9, +, / 총 64개의 문자로 표현합니다. 그래서 이름이 Base64입니다.

왜 Base64를 사용할까?

이메일 시스템은 원래 텍스트만 전송하도록 설계되었습니다. 이미지를 첨부하려면 바이너리 데이터를 텍스트로 바꿔야 했고, 이때 Base64가 사용되었습니다. 현재는 더 다양한 용도로 활용됩니다.

실제 활용 사례

  • HTML에 이미지 직접 삽입: data:image/png;base64,... 형태로 이미지 삽입
  • API 인증: 사용자명:비밀번호를 Base64로 인코딩하여 전송
  • JSON 데이터 전송: 바이너리 데이터를 JSON에 포함할 때
  • 쿠키 저장: 특수문자 문제를 피하기 위해 인코딩

인코딩과 디코딩

Base64 인코딩은 데이터를 약 33% 더 크게 만듭니다. 원본 데이터 3바이트가 4개의 Base64 문자로 변환되기 때문입니다. Base64 변환기를 사용하면 인코딩과 디코딩을 즉시 할 수 있습니다.

개발 중 활용 팁

작은 아이콘이나 로고는 Base64로 변환하여 CSS에 직접 넣으면 HTTP 요청을 줄일 수 있습니다. 다만 큰 이미지는 오히려 페이지 로딩을 느리게 만들 수 있으니 주의하세요. 온라인 Base64 인코더로 변환 결과를 미리 확인해보세요.

보안과 Base64

Base64는 암호화가 아닙니다. 누구나 쉽게 디코딩할 수 있으므로 민감한 정보를 숨기는 용도로 사용하면 안 됩니다. Base64 디코딩 도구만 있으면 원본 데이터를 바로 확인할 수 있습니다.