base64 encode 如何把外部的檔放進同一個 html 中？

底下要談的主要是針對 SVG, 但是一般的 HTML 其實也行，只是範例是使用 SVG 來講解而已，請參考SVG 範例, HTML 範例

這邊有講解，並且有示範用 perl 如何完成。之所以能將外部的檔案放在 html / svg 裡，其原理是要先對想包的內容利用 base64 的演算法編碼過，這樣才不會在內容中有特殊字元，例如 ", ', <, >，或一般的控制字元(ASCII < 0x20)，而這樣的事是 W3C 制定的標準，因此瀏覽器必須支援.....(不支援的大概就是沒聽過的瀏覽器)

若要轉換，可以參考底下的線上轉換工具，或是安裝 cygwin, 或是在 Linux 下，都有預設的工具，其命令名稱就叫 base64(在 coreutils 套件下):

http://webnet77.com/cgi-bin/helpers/base-64.pl
http://rumkin.com/tools/compression/base64.php
這邊有一個用 javascript 寫的工具，你可以自己寫頁面來轉換, 上面有提到utf-8 的問題，值得大家參考。還有一點參考資料可助理解 base64. 這邊有一個號稱效率更高的演算法，用的是查表法.

在SVG 範例裡面，可以看到用法上如下，其中 &si; 其實是個變數，定義在前面

<!ENTITY si 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAA'>

<symbol id="Invader1b">
<image width="8" height="8" xlink:href="&si;EAAA...." />
</symbol>
====== 上面相當於 =====>
<symbol id="Invader1b">
<image width="8" height="8" xlink:href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEAAA...." />
</symbol>

上面 href="data:image/png;base64, 是型別宣告，若你的內容是 gif, jpg 請改成適當的字串值，後面接著的就是經過 base64 編碼後的內容，通常你用純文字檔檢視即可，複製後再貼上即可。要用 base64 進行轉換相當簡單，譬如把 a.png 編碼成 a.png.base64:
% base64 a.png > a.png.base64
反編碼(解碼)的話如下:
% base64 -d a.png.base64 > a.png

同樣的事若是放在 C/C++ 中呢？可以參考這一篇說的方式去做，這邊的意思是，原來說的是文字檔，其實任何檔都可以看成是文字檔不是嗎？差別只在於你怎麼用而已，而不是在轉換過程。這麼說不是沒根據的，譬如網頁，怎麼傳圖片？譬如 email 怎麼夾帶圖片與影片？我說個最簡單的，你想想看，同樣的內容用 printf() 裡面的 %d, %f, %x, %s 來印，結果是不是不相同？why?