Base64 編碼與解碼

Base64 是做什麼的

Base64 用 64 個字元重新表示任意位元組，讓資料能通過只接受文字的系統：電子郵件內文、JSON 字串、 網址、HTML 屬性。它是編碼，不是加密——任何人都能解回原樣。千萬不要用它來隱藏任何東西。

代價是體積。每 3 個位元組會變成 4 個字元，編碼後大約會膨脹 33%。

UTF-8 是多數工具出錯的地方

瀏覽器內建的 btoa 只處理 Latin-1 字碼單位，遇到 你好 會直接丟出例外，超過 U+00FF 的字元也會 被破壞。正確的做法是先把文字轉成 UTF-8 位元組：

// 錯誤：遇到非 Latin-1 字元會丟出例外
btoa('你好')

// 正確
btoa(String.fromCharCode(...new TextEncoder().encode('你好')))

上面的工具兩個方向都這樣處理，因此中文、日文與 emoji 都能完整還原。如果解碼後出現亂碼，代表輸入 原本就不是 UTF-8 文字——常見的情況是那其實是二進位檔案，而不是文字。

標準格式與網址安全格式

兩種字母表編碼的是同樣的位元組，只有三個字元不同。

在網址查詢字串中 + 會被解析成空格，/ 則會切斷路徑，所以 JWT 與帶簽章的網址都採用去掉補位的 網址安全格式。上面的解碼器兩種都接受，有沒有補 = 都可以。

Data URI

Data URI 就是在 Base64 前面加上媒體型別，讓小圖或字型直接嵌在 CSS 或 HTML 裡，不必再發一次請求：

data:image/png;base64,iVBORw0KGgo…

只有真正很小的檔案才划算——那 33% 的膨脹每次載入頁面都要付一次，而且這些位元組無法單獨快取。

你的資料只留在這裡

編碼與解碼都在你的瀏覽器完成，貼上的內容不會上傳。這一點值得留意：被貼進線上解碼器的 Base64 內容，往往就是權杖與工作階段 Cookie。