>웹 프론트엔드 >JS 튜토리얼 >Node.js는 base64로 인코딩된 바이너리 스트림 웹 페이지 Images_javascript 기술을 표시합니다.

Node.js는 base64로 인코딩된 바이너리 스트림 웹 페이지 Images_javascript 기술을 표시합니다.

WBOY
WBOY원래의
2016-05-16 16:53:361261검색

데이터 URI 체계.
데이터 URI 체계는 RFC2397에 정의되어 있습니다. 그 목적은 일부 작은 데이터를 웹 페이지에 직접 삽입하여 외부 파일에서 로드할 필요가 없도록 하는 것입니다. 예를 들어 위의 문자열은 실제로는 작은 그림입니다. 이 문자를 Firefox의 주소 표시줄에 복사하여 붙여넣고 이동하면 2*2 흰색 gif 그림이 표시됩니다.
위 데이터 URI에서 data는 데이터를 얻기 위한 프로토콜 이름을 나타내며, image/gif는 데이터 유형 이름, base64는 데이터의 인코딩 방법, 쉼표 뒤에 오는 것은 이미지의 base64로 인코딩된 데이터입니다. /gif 파일입니다.
현재 데이터 URI 체계에서 지원되는 유형은
data:, text data
data:text/plain, text data
data:text/html, HTML code
data:text입니다. / html;base64,base64 인코딩된 HTML 코드
data:text/css,CSS 코드
data:text/css;base64,base64 인코딩된 CSS 코드
data:text/javascript,Javascript 코드
데이터 :text/javascript;base64,base64로 인코딩된 Javascript 코드
data:image/gif;base64,base64로 인코딩된 gif 이미지 데이터
data:image/png;base64,base64로 인코딩된 png 이미지 데이터
data:image/ jpeg;base64,base64-인코딩된 jpeg 이미지 데이터
data:image/x-icon;base64,base64-encoded 아이콘 이미지 데이터
base64 간단히 말하면 일부 8비트 데이터를 표준 ASCII 문자의 경우 다음과 같이 변환합니다. 인터넷에는 많은 무료 base64 인코딩 및 디코딩 도구가 있습니다. PHP에서는 echo base64_encode(file_get_contents('images/log.gif''))와 같은 base64_encode() 함수를 사용하여 인코딩할 수 있습니다.
현재 IE8 , Firefox, Chrome 및 Opera 브라우저는 모두 이러한 종류의 작은 파일 삽입을 지원합니다.
사진의 예:
웹 페이지의 사진은 다음과 같이 표시될 수 있습니다.

코드 복사 코드는 다음과 같습니다.


은 다음과 같이 표시할 수도 있습니다.
코드 복사 코드는 다음과 같습니다.

이미지 파일의 내용을 HTML 파일에 직접 작성했습니다. 이것의 장점은 HTTP 요청을 저장한다는 것입니다. 단점은 브라우저가 이 이미지를 캐시하지 않는다는 것입니다.
성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.