Data:image/png; what is Base64
you may notice that there are some pictures of SRC or background pictures behind a large string of characters, such as: Code]data:image/png; Base64, iVBORw0KGgoAAAANSUhEUgAAAAEAAAAkCAYAAABIdFAMAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAHhJREFUeNo8zjsOxCAMBFB/ KEAUFFR0Cbng3nQPw68ArZdAlOZppPFIBhH5EAB8b Tlt9MYQ6i1BuqFaq1CKSVcxZ2Acs6406KUgpt5/ LCKuVgz5BDCSb13ZO99ZOdcZGvt4mJjzMVKqcha68iIePB86GAiOv8CDADlIUQ Bs7MD3wAAAABJRU5ErkJggg==. So what is this? This is Data URI scheme. [/code]
Data URI scheme is defined in RFC2397 with the aim of embedding some small data directly into a web page so that it does not need to be loaded from an external file. For example, the string of characters, in fact, is a small picture that copies the characters to the Firefox's address bar and goes to it, and you can see it, a 1X36's gray PNG picture. In
, in the Data URI above, data represents the name of the protocol for the data, image/png is the name of the data type, the base64 is the encoding method of the data, and the comma is the data after the base64 encoded by the image/png file.
currently, the types of Data URI scheme are:
[code]data:, text data
data:text/plain, text data
data:text/html, HTML code. Ta:text/javascript, Javascript code
data:text/javascript; Base64, Base64 coded Javascript code
data:image/gif; Base64, Base64 encoded GIF picture data. Base64, Base64 encoded icon picture data
[/code]
Base64, in simple terms, it translates some 8-bit data into standard ASCII characters, and there are many free Base64 encoding and decoding tools on the Internet, and in PHP, a function base64_encode () can be encoded. ("wg.png");
currently, IE8, Firfox, Chrome and Opera browsers support this kind of small file embedding.
an example of a picture:
a picture in a web page that can be displayed in this way:
[code].lt; img src= "http://www.letuknowit.com/images/wg.png" /.gt. AEAAAAkCAYAAABIdFAMAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAHhJREFUeNo8zjsOxCAMBF
B/KEAUFFR0Cbng3nQPw68ArZdAlOZppPFIBhH5EAB8b Tlt9MYQ6i1BuqFaq1CKSVcxZ2Acs6406KUgpt5/LCKuVgz5BDCSb13ZO99ZOdcZGvt4mJjzMVKqcha68iIePB86GAiOv8CDADlIUQBs7MD
3wAAAABJRU5ErkJggg== '/.gt; [/code]
we wrote the contents of the image file directly in the HTML file. The advantage of this is that we save a HTTP request. The disadvantage is that browsers do not cache this image. We can make free choice according to the actual situation