Data URIs(Data URI scheme)

Data URIs란

Data URIs(Data URI scheme)란 `data:` 스킴이 접두어로 붙은 URI. 작은 파일을 문서 내에 인라인으로 임베드하기 위한 URI 스킴이다. 주로 아이콘 등의 작은 이미지 파일에 사용된다. 

문법

data:[<mediatype>][;base64],<data>

• mediatype : MIME 타입. 생략된시, 기본 값 text/plain;charset=US-ASCII
• base64 : 데이터가 텍스트가 아닌 경우 base64 인코딩된 데이터가 필요하다.

특징

• 소스 코드 내 삽입
  • 추가적인 HTTP 요청이 일어나지 않는다.
  • 캐싱 되지 않는다.
• 용량
  • base64 포맷으로 인코딩하면 원본 파일보다 더 용량이 커진다.
• 긴 문자열
  • 브라우저에 따라 문자 길이에 제한이 있기 때문에, 용량이 큰 이미지 등은 처리하지 못할 수 있다.
  • 소스코드 상에 삽입하면 소스 가독성이 떨어질 수 있다.

브라우저 호환성

IE 8이상 지원. (참고 링크)

참고 링크

• Can I use - Data URIs
• MDN web docs - Data URIs
• Wikipedia - Data URI sceheme