Data URI scheme.
The Data URI scheme is defined in RFC2397, with the purpose of embedding some small data directly into a web page, so that it does not need to be loaded from external files anymore. For example, the string of characters above is actually a small picture. Copy and paste these characters into the Firefox address bar and go to it, you can see it, a 2*2 white gif picture.
In the above Data URI, data represents the contract name of the data obtained, image/gif is the data type name, base64 is the encoding method of the data, and the comma is followed by the data encoded by the image/gif file base64.
Currently, the types supported by Data URI scheme are:
data:, text data
data:text/plain, text data
data:text/html, HTML code
data:text/html;base64, base64 encoded HTML code
data:text/css,CSS code
data:text/css;base64, base64 encoded CSS code
data:text/javascript,javascript code
data:text/javascript;base64, base64 encoded Javascript code
data:image/gif; base64, base64 encoded gif image data
data:image/png; base64, base64 encoded png image data
data:image/jpeg; base64, base64 encoded jpeg image data
data:image/x-icon; base64, base64 encoded icon image data
base64 Simply put, it translates some 8-bit data into standard ASCII characters. There are many free base64 encoding and decoding tools on the Internet. In PHP, you can use the function base64_encode() to encode, such as echo base64_encode(file_get_contents('images /log.gif”'));
Currently, IE8, Firfox, Chrome, and Opera browsers all support this kind of small file embedding.
Take an example of a picture:
An image on the web page can be displayed like this:
The code copy is as follows:
<img src="http://www.jwzzsw.com/images/log.gif"/>
It can also be displayed like this:
The code copy is as follows:
<img src="data:image/gif;base64,R0lGODlhAgACAIAAAP///wAAACwAAAAAgACAAAoRRADs="/>
We write the contents of the image file directly into the HTML file. The advantage of this is that it saves an HTTP request. The disadvantage is that the browser will not cache such images.
PS: Here we provide you with an online picture to base64 encoding tool and base64 encoding conversion tool for your reference:
Image conversion to Base64 encoding online tool : http://tools.VeVB.COM/transcoding/img2base64
BASE64 encoding and decoding tool: http://tools.VeVB.COM/transcoding/base64