Data URI란?
Data URI(또는 data URL)는 작은 파일을 텍스트에 직접 포함합니다. 형식: data:[mime][;charset][;base64],data.
일반적인 용도:
- HTML/CSS에 이미지 또는 폰트 인라인 삽입
- JSON/설정에 작은 리소스 저장
참고:
- 작은 파일에 적합하며, 긴 문자열은 페이지를 느리게 할 수 있습니다
- 바이너리는 Base64가 일반적입니다
예시
data:image/svg+xml;base64,PHN2ZyB4bWxucz0i...
쉼표 앞부분에는 MIME 유형과 Base64 사용 여부처럼 파일을 설명하는 정보가 들어갑니다. 쉼표 뒤부분은 인코딩된 실제 데이터입니다.
이 변환기가 특히 유용한 경우
- 로컬 파일을 HTML, CSS, JSON 또는 이메일 마크업에 바로 넣을 수 있는 문자열로 바꾸고 싶을 때
- 자산을 다른 곳에 호스팅하지 않고 자체 포함형 데모를 빠르게 만들고 싶을 때
- 결과를 다른 도구에 붙여 넣기 전에 감지된 MIME 유형을 확인하고 싶을 때
실무상 한계
- Data URI는 아이콘, 작은 이미지, 짧은 스니펫처럼 작은 파일에 가장 적합합니다
- Base64는 대략 33% 정도 크기를 늘리므로 최종 문자열은 원본 파일보다 커집니다
- 문자열이 너무 길면 길이 제한이 있는 폼, 설정, 편집기에 붙여 넣기 불편할 수 있습니다