最近項目中用到向前端返回圖片用了“data:image/png;base64”格式。涉及到幾個點,第一個是 Data URI scheme,第二個是Base64編碼,第三個是計算機內存字節序的大端表示法和小端表示法。
“data:image/png;base64”這種方式是 Data URI scheme。以下是轉載內容data:image/png;base64的用法詳解,淺析data:image/png;base64的應用。
那麼這是什麼呢?這是Data URI scheme。
Data URI scheme是在RFC2397中定義的,目的是將一些小的數據,直接嵌入到網頁中,從而不用再從外部文件載入。比如上面那串字符,其實是一張小圖片,將這些字符複製黏貼到火狐的地址欄中並轉到,就能看到它了,一張1X36的白灰png圖片。
在上面的Data URI中,data表示取得數據的協定名稱,image/png 是數據類型名稱,base64 是數據的編碼方法,逗號後面就是這個image/png文件base64編碼後的數據。 目前,Data URI scheme支持的類型有:
格式 含義 data 文本數據 data:text/plain 文本數據 data:text/html HTML代碼 data:text/html;base64 base64編碼的HTML代碼 data:text/css CSS代碼 data:text/css;base64 base64編碼的CSS代碼 data:text/javascript Javascript代碼 data: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編碼的icon圖片數據
優點:
- 減少HTTP請求數,沒有了TCP連接消耗和同一域名下瀏覽器的併發數限制。
- 對於小文件會降低帶寬。雖然編碼後數據量會增加,但是卻減少了http頭,當http頭的數據量大於文件編碼的增量,那麼就會降低帶寬。
- 對於HTTPS站點,HTTPS和HTTP混用會有安全提示,而HTTPS相對於HTTP來講開銷要大更多,所以Data URI在這方面的優勢更明顯。
- 可以把整個多媒體頁面保存爲一個文件。
缺點:
- 無法被重複利用,同一個文檔應用多次同一個內容,則需要重複多次,數據量大量增加,增加了下載時間。
- 無法被獨自緩存,所以其包含文檔重新加載時,它也要重新加載。
- 客戶端需要重新解碼和顯示,增加了點消耗。
- 不支持數據壓縮,base64編碼會增加1/3大小,而urlencode後數據量會增加更多。
- 不利於安全軟件的過濾,同時也存在一定的安全隱患。
簡言之,就是可以將“data:image/png;base64”這種數據直接放到 html 代碼中,不用像之前放的是一個鏈接,需要再次請求服務器資源。
第二個是Base64編碼。Base64編碼之前接觸過多次,就是將字節數據轉換成64個符號表示的數據,這64個符號有一個符號表。這裏字節轉換成Base64符號,一個字節是 8 bit,而一個 Base64 符號是 6 bit,這樣,三個字節的數據恰好可以轉換成四個 Base64 符號。具體轉換方式見下邊代碼。
第三個是字節在內存中大端存儲和小端存儲。以下爲轉載內容。字節序:大端法和小端法
字節序即爲多字節對象存儲在內存中的字節順序,有兩種不同的存儲方案:大端法和小端法。現代的處理器大多爲雙端法,大小端都支持,可以配置稱大端法或者小端法。
大端法
最高有效字節在最前面的方式稱爲大端法,例如假設變量x類型爲int型,位於地址0x100的地方,其16進制值爲0x12345678,地址範圍爲0x100到0x103字節。
對於大端法的機器來說:
0x100 0x101 0x102 0x103 12 34 56 78 由上圖可見,地址從左向右增長,x的最高有效字節12在最前面存儲。這正好和我們平時書寫習慣一致,先書寫最高有效字節,再依次寫其餘字節。
小端法
最低有效字節在最前面的方式成爲小端法,這正好和大端法相反,仍然用大端法中舉的例子說明:
0x100 0x101 0x102 0x103 78 56 34 12 由上圖可見,地址依然從左向右增長,x的最低有效字節在最前面存儲,與大端法相反。
講大端,小端表示法是因爲圖片使用的是小端表示法,所以將圖片數據轉爲 Base64 格式時要將數據順序反過來。具體見代碼。
package cn.picclife.cust.rrd.util;
import java.io.IOException;
import cn.picclife.cust.integration.face.util.ImageBizUtil;
import sun.misc.BASE64Decoder;
/**
* Base64 編碼判斷工具
*/
public class Base64Util {
private static final char last2byte = (char) Integer.parseInt("00000011", 2);
private static final char last4byte = (char) Integer.parseInt("00001111", 2);
private static final char last6byte = (char) Integer.parseInt("00111111", 2);
private static final char lead6byte = (char) Integer.parseInt("11111100", 2);
private static final char lead4byte = (char) Integer.parseInt("11110000", 2);
private static final char lead2byte = (char) Integer.parseInt("11000000", 2);
private static final char[] encodeTable = new char[] {'A', 'B', 'C', 'D', 'E', 'F', 'G', 'H',
'I', 'J', 'K', 'L', 'M', 'N', 'O', 'P', 'Q', 'R', 'S', 'T', 'U', 'V', 'W', 'X', 'Y',
'Z', 'a', 'b', 'c', 'd', 'e', 'f', 'g', 'h', 'i', 'j', 'k', 'l', 'm', 'n', 'o', 'p',
'q', 'r', 's', 't', 'u', 'v', 'w', 'x', 'y', 'z', '0', '1', '2', '3', '4', '5', '6',
'7', '8', '9', '+', '/'};
public Base64Util() {}
public static String encode(byte[] from) {
StringBuilder to = new StringBuilder((int) ((double) from.length * 1.34D) + 3);
int num = 0;
char currentByte = 0;
int i;
for (i = 0; i < from.length; ++i) {
for (num %= 8; num < 8; num += 6) {
switch (num) {
//取第 0,3,6,9...個字節的前 6 位 bit 轉爲 base64 字符
case 0:
currentByte = (char) (from[i] & lead6byte);
currentByte = (char) (currentByte >>> 2);
case 1:
case 3:
case 5:
default:
break;
//取字節後 6 位轉換
case 2:
currentByte = (char) (from[i] & last6byte);
break;
case 4:
currentByte = (char) (from[i] & last4byte);
currentByte = (char) (currentByte << 2);
if (i + 1 < from.length) {
currentByte = (char) (currentByte | (from[i + 1] & lead2byte) >>> 6);
}
break;
case 6:
currentByte = (char) (from[i] & last2byte);
currentByte = (char) (currentByte << 4);
if (i + 1 < from.length) {
currentByte = (char) (currentByte | (from[i + 1] & lead4byte) >>> 4);
}
}
to.append(encodeTable[currentByte]);
}
}
if (to.length() % 4 != 0) {
for (i = 4 - to.length() % 4; i > 0; --i) {
to.append("=");
}
}
return to.toString();
}
/**
*
* @Title: imageSize
* @Description: 判斷字符流大小
* @param @param image base64長度
* @param @return
* @return Integer 返回類型
* @date 2018年4月12日 上午9:51:48
* @throws
*/
public static Integer imageSize(String image) {
String str = image.substring(22); // 1.需要計算文件流大小,首先把頭部的data:image/png;base64,(注意有逗號)去掉。
Integer equalIndex = str.indexOf("=");// 2.找到等號,把等號也去掉
if (str.indexOf("=") > 0) {
str = str.substring(0, equalIndex);
}
Integer strLength = str.length();// 3.原來的字符流大小,單位爲字節
return strLength;
}
public static void main(String[] args) {
String m = "123456789123456789123422222";
String b = m.substring(22);
System.out.println(b);
}
/**
*
* @Title: base64ToIo
* @Description: 轉換文件流 壓縮
* @param @param strBase64
* @param @return
* @return byte[] 返回類型
* @date 2018年4月12日 上午9:44:49
* @throws
*/
public static byte[] base64ToIo(String strBase64) {
String string = strBase64;
byte[] newbytes = null;
try {
// 解碼,然後將字節轉換爲文件
byte[] bytes = new BASE64Decoder().decodeBuffer(string); // 將字符串轉換爲byte數組
newbytes = ImageBizUtil.imageZip(bytes, 1440, 1080);
} catch (IOException ioe) {
ioe.printStackTrace();
}
return newbytes;
}
/**
*
* @Title: base64ToIo
* @Description: 原始轉換
* @param @param strBase64
* @param @return
* @return byte[] 返回類型
* @date 2018年4月12日 上午9:44:49
* @throws
*/
public static byte[] base64ToIoBase(String strBase64) {
String string = strBase64;
byte[] bytes = null;
try {
// 解碼,然後將字節轉換爲文件
bytes = new BASE64Decoder().decodeBuffer(string); // 將字符串轉換爲byte數組
} catch (IOException ioe) {
ioe.printStackTrace();
}
return bytes;
}
}