Base64 PNG 변환기

Base64 PNG를 만나는 곳

Base64로 가장 자주 마주치는 이미지 형식은 PNG입니다. 인수 없이 canvas.toDataURL()을 호출하면 PNG data URI가 반환됩니다. 브라우저 자동화 도구도 스크린샷을 Base64 PNG로 돌려주는데, Puppeteer의 page.screenshot({ encoding: 'base64' })나 Selenium의 get_screenshot_as_base64()가 그 예입니다. 차트 렌더러, QR 코드 생성기, 이미지 생성 API도 JSON 안의 Base64 필드로 이미지를 반환하는 경우가 많습니다.

PNG 문자열은 알아보기 쉽습니다. 항상 iVBORw0KGgo로 시작하는데, 이는 89 50 4E 47로 시작하는 8바이트 PNG 시그니처를 인코딩한 것입니다. 그 뒤에는 너비와 높이를 담은 IHDR 청크의 시작 부분인 AAAANSUhEUg가 이어집니다.

JSON에서 복사한 문자열은 먼저 간단히 확인해야 합니다. 예를 들어 PHP의 json_encode는 기본적으로 슬래시를 이스케이프하므로, PHP API에서 받은 PNG에는 \/ 시퀀스가 들어 있을 수 있습니다. 붙여넣기 전에 이를 /로 바꾸고 앞뒤의 따옴표를 지우십시오.

PNG로 저장하는 이유

PNG는 디테일을 잃지 않고 압축하며 완전한 알파 채널을 저장하므로 부드러운 그림자와 안티에일리어싱된 가장자리가 그대로 유지됩니다. 그래서 스크린샷, UI 요소, 다이어그램, 텍스트가 들어간 이미지에 가장 알맞습니다. 사진이라면 JPG나 WebP가 훨씬 작은 파일을 만듭니다.

JPEG나 WebP를 PNG로 변환하면 화면에 보이는 그대로 보존되지만, 손실 압축으로 이미 사라진 디테일을 되살릴 수는 없으며 PNG 파일은 대개 원본보다 큽니다.

코드에서 Base64 PNG 저장하기

# Python
import base64
with open('screenshot.png', 'wb') as f:
    f.write(base64.b64decode(b64_string))

// 브라우저: 직접 디코딩하지 않고 data URI를 Blob으로 변환
const blob = await (await fetch(dataUri)).blob();
const url = URL.createObjectURL(blob);

반대 방향이 필요하다면 PNG Base64 변환 도구로 파일을 문자열이나 data URI로 인코딩할 수 있습니다.