HTML中img标簽base64顯示圖檔

在浏覽網頁的時候大家可能會注意到一個奇怪的現象，有的圖檔的路徑後面是一串很長的字元串，例如：
           

這其實是Data URI scheme，它的作用是将一些小型資料直接嵌入到網頁中，進而可以不使用外部檔案導入的方式加載。例如上面的例子就是一張圖檔。data表示取得資料的協定名稱，image/jpg是資料類型名稱，base64是資料的編碼方法，逗号後面就是這個image/jpg檔案base64編碼後的資料。目前，Data URI scheme支援的資料類型有：

data:,文本資料 
data:text/plain,文本資料 
;javascript:;,HTML代碼 
;javascript:;;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圖檔資料
           

以img标簽為例進行舉例說明：

1、正常形式：
           

2、base64轉碼後的形式：