base64 其實是一種編碼轉換方式, 將 ASCII 字符轉換成普通文本, 是網絡上最常見的用于傳輸8Bit字節代碼的編碼方式之一。

base64 由字母 a-z 、 A-Z 、 0-9 以及 + 和 / , 再加上作為墊字的 = , 一共65字符組成一個基本字符集, 其他所有字符都可以根據一定規則, 轉換成該字符集中的字符。

abcde => YWJjZGU= ABCDE => QUJDREU=

在日常開發中, 最常見的便是將 blob 和 base64 之間相互轉換.

// blob to base64function blobTobase64(blob) { const fileReader = new FileReader() let base64 = '' fileReader.onload = () => { base64 = fileReader.result // 讀取base64 } fileReader.readAsDataURL(blob) // 讀取blob}// base64 to blobfunction dataURItoBlob(dataURI) { var mimeString = dataURI .split(',')[0] .split(':')[1] .split(';')[0] // mime類型 var byteString = atob(dataURI.split(',')[1]) //base64 解碼 var arrayBuffer = new ArrayBuffer(byteString.length) //創建ArrayBuffer var intArray = new Uint8Array(arrayBuffer) //創建視圖 for (var i = 0; i < byteString.length; i++) { intArray[i] = byteString.charCodeAt(i) } return new Blob([intArray], { type: mimeString }) // 轉成 blob}

編碼和解碼

瀏覽器

最新的瀏覽器自帶了兩個方法用于 base64 的編碼和解碼

分別是 at

ob 和 btoa

對于舊版瀏覽器, 可以使用 js-base64

Node

目前 node 中還不支持使用 atob 和 btoa ，但是可以通過 Buffer 來實現,參考文檔

if (typeof btoa === 'undefined') { global.btoa = function (str) { return Buffer.from(str).toString('base64'); };}if (typeof atob === 'undefined') { global.atob = function (b64Encoded) { return Buffer.frome(b64Encoded, 'base64').toString(); };}

轉換方式

base64編碼方式對于中文是不適用的, 因為中文對應多個字節, 因此可以先使用 encodeURIComponent 編碼后再進行 base64 編碼.

源碼

編碼

每三個字節作為一組，每個字節8bit, 一共是24個二進制位。

'ABCD'["ABC", "D"] // 每三字節做一組['01000001010000100100001', '01000100'] // 轉成8bit

將每組的24個二進制位再細分為四組，每組有6個二進制位, 此時為二維數組。

[['010000', '010100', '001001', '000011'], ['010001', '00']]