JS는 Base64에 인코딩 된 이진 스트리밍 웹 페이지 사진을 표시합니다

데이터 URI 체계.

데이터 URI 체계는 RFC2397로 정의되며 일부 작은 데이터를 웹 페이지에 직접 포함시키기 위해 더 이상 외부 파일에서로드 할 필요가 없습니다. 예를 들어, 위의 문자는 실제로 작은 그림을 복사하여 Firefox 주소 막대에 붙여 넣어 2*2 흰색 GIF 사진을 볼 수 있습니다.

위의 데이터 URI에서 데이터는 얻은 데이터의 계약 이름을 나타내고, 이미지/gif는 데이터 유형 이름이고, Base64는 데이터의 인코딩 메소드이며, Comma는 이미지/gif 파일 Base64로 인코딩 된 데이터가 뒤 따릅니다. .

현재 데이터 URI 체계가 지원하는 유형은 다음과 같습니다.

데이터 :, 텍스트 데이터

데이터 : 텍스트/일반, 텍스트 데이터

데이터 : 텍스트/html, HTML 코드

데이터 : Text/Html; Base64, Base64 인코딩 된 HTML 코드

데이터 : 텍스트/CSS, CSS 코드

데이터 : Text/CSS; Base64, Base64 인코딩 된 CSS 코드

데이터 : 텍스트/JavaScript, JavaScript 코드

데이터 : Text/JavaScript; Base64, Base64 인코딩 된 JavaScript 코드

데이터 : 이미지/gif; Base64 인코딩 된 GIF 이미지 데이터

데이터 : 이미지/PNG; Base64 인코딩 된 PNG 이미지 데이터

데이터 : 이미지/JPEG; Base64 인코딩 된 JPEG 이미지 데이터

데이터 : 이미지/X-ICON; Base64 인코딩 된 아이콘 이미지 데이터

BASE64는 몇 가지 8 비트 데이터를 표준 ASCII 문자로 변환합니다. 'images /log.gif”));

현재 IE8, Firfox, Chrome 및 Opera 브라우저는 이러한 종류의 작은 파일 임베딩을 지원합니다.

사진의 예를 찍으십시오.

웹 페이지의 이미지는 다음과 같이 표시 될 수 있습니다.

코드 사본은 다음과 같습니다.

<img src = "http://www.jwzzsw.com/images/log.gif"/>

다음과 같이 표시 할 수 있습니다.

코드 사본은 다음과 같습니다.

<img src = "data : image/gif; base64, r0lgodlhagacaiaaap /// waaacwaaaagacaaaorrads ="/>

이미지 파일의 내용을 HTML 파일에 직접 작성합니다. 단점은 브라우저가 그러한 이미지를 캐시하지 않는다는 것입니다.

추신 : 여기에서는 Base64 인코딩 도구와 Base64 인코딩 변환 도구에 대한 온라인 사진을 제공합니다.

Base64 인코딩 온라인 도구로 이미지 변환 : http://tools.vevb.com/transcoding/img2base64

Base64 인코딩 및 디코딩 도구 : http://tools.vevb.com/transcoding/base64