一文讲清base64编码原理（一文讲清便秘药物有哪些名字）难以置信

目录前言base64 由来base64 的编码原理base64 编码对照表base64 的编码转换规则base64 优缺点JavaScript 的 base64 转码方法Web API 二进制与 base64 转换base64 转二进制base64 转成 Blob相关文献

| 文本 | L | J | Y |
| ASCII | 76 | 74 | 89 |
| 二进制位 | 01001100 | 01001010 | 01011001 |
| 分组二进制 | 010011 | 000100 | 101001 | 011001 |
| 分组二进制补2个0 | 00010011 | 00000100 | 00101001 | 00011001 |
| 分组索引 | 19 | 4 | 41 | 25 |
| base64编码 | T | E | p | Z |

主要展示：
转换前二进制位: 01001100 01001010 01011001
转换后二进制位: 00010011 00000100 00101001 00011001
复制代码

<!– 缺2位字符,字符串以A为例转换base64后位QQ==–>
| 文本（1Byte） | A | | |
| 二进制位 | 01000001 | | |
| 分组二进制 | 010000 | 010000 | | |
| 分组二进制补0 | 00010000 | 00010000 | | |
| 分组索引 | 16 | 16 | | |
| base64编码 | Q | Q |=|=|

<!– 缺1位字符,字符串以AB为例转换base64后位QUI=–>
| 文本（1Byte） | A | B | |
| 二进制位 | 01000001 | 01000010 | |
| 分组二进制 | 010000 | 010100 | 001000 | |
| 分组二进制补0 | 00010000 | 00010100 | 00001000 | |
| 分组索引 | 16 | 20 | 8 | |
| base64编码 | Q | U | I |=|
复制代码

// 简单数据
const encodedData=btoa(‘Hello, world’); // encode a string
const decodedData=atob(encodedData); // decode the string

// convert a Unicode string to a string in which
// each 16-bit unit occupies only one byte
function toBinary(string) {
const codeUnits=new Uint16Array(string.length);
for (let i=0; i < codeUnits.length; i++) {
codeUnits[i]=string.charCodeAt(i);
}
const charCodes=new Uint8Array(codeUnits.buffer);
let result=”;
for (let i=0; i < charCodes.byteLength; i++) {
result +=String.fromCharCode(charCodes[i]);
}
return result;
}
function fromBinary(binary) {
const bytes=new Uint8Array(binary.length);
for (let i=0; i < bytes.length; i++) {
bytes[i]=binary.charCodeAt(i);
}
const charCodes=new Uint16Array(bytes.buffer);
let result=”;
for (let i=0; i < charCodes.length; i++) {
result +=String.fromCharCode(charCodes[i]);
}
return result;
}

// a string that contains characters occupying > 1 byte
const myString=’?’;

const converted=toBinary(myString);
const encoded=btoa(converted);
console.log(encoded); // OCY5JjomOyY8Jj4mPyY=const decoded=atob(encoded);
const original=fromBinary(decoded);
console.log(original); // ?

// base64编码表
const map={
0: 52,
1: 53,
2: 54,
3: 55,
4: 56,
5: 57,
6: 58,
7: 59,
8: 60,
9: 61,
A: 0,
B: 1,
C: 2,
D: 3,
E: 4,
F: 5,
G: 6,
H: 7,
I: 8,
J: 9,
K: 10,
L: 11,
M: 12,
N: 13,
O: 14,
P: 15,
Q: 16,
R: 17,
S: 18,
T: 19,
U: 20,
V: 21,
W: 22,
X: 23,
Y: 24,
Z: 25,
a: 26,
b: 27,
c: 28,
d: 29,
e: 30,
f: 31,
g: 32,
h: 33,
i: 34,
j: 35,
k: 36,
l: 37,
m: 38,
n: 39,
o: 40,
p: 41,
q: 42,
r: 43,
s: 44,
t: 45,
u: 46,
v: 47,
w: 48,
x: 49,
y: 50,
z: 51,
‘+’: 62,
‘/’: 63,
};

function base64to2(base64) {
let len=base64.length * 0.75; // 转换为int8array所需长度
base64=base64.replace(/=*$/, ”); // 去掉=号（占位的）

const int8=new Int8Array(len); //设置int8array视图
let arr1,
arr2,
arr3,
arr4,
p=0;

for (let i=0; i < base64.length; i +=4) {
arr1=map[base64[i]]; // 每次循环 都将base644个字节转换为3个int8array直接
arr2=map[base64[i + 1]];
arr3=map[base64[i + 2]];
arr4=map[base64[i + 3]];
// 假设数据arr 数据 00101011 00101111 00110011 00110001
int8[p++]=(arr1 << 2) | (arr2 >> 4);
// 上面的操作 arr1向左边移动2位 变为10101100
// arr2 向右移动4位：00000010
// | 为’与’操作: 10101110
int8[p++]=(arr2 << 4) | (arr3 >> 2);
int8[p++]=(arr3 << 6) | arr4;
}
return int8;
}

// base64图片转blob
function base64toBlob(base64) {
var arr=base64.split(‘,’),
mime=arr[0].match(/:(.*?);/)[1] || ‘image/png’,
bstr=atob(arr[1]), // 将base64转为Unicode规则编码
n=bstr.length,
u8arr=new Uint8Array(n);
while (n–) {
u8arr[n]=bstr.charCodeAt(n); // 转换编码后才可以使用charCodeAt 找到Unicode编码
}
return new Blob([u8arr], { type: mime });
}

function base64ToBlob(base64) {
var arr=base64.split(‘,’);
var mime=arr[0].match(/:(.*?);/)[1] || ‘image/png’;
// 去掉url的头，并转化为byte
var bytes=window.atob(arr[1]);
// 处理异常,将ascii码小于0的转换为大于0
var ab=new ArrayBuffer(bytes.length);
// 生成视图（直接针对内存）：8位无符号整数，长度1个字节
var u8arr=new Uint8Array(ab);

for (var i=0; i < bytes.length; i++) {
u8arr[i]=bytes.charCodeAt(i);
}

return new Blob([u8arr], { type: mime });
}

您可能感兴趣的文章:Base64编码的深入认识与理解Base64 编码介绍、Base64编码转换原理与算法解读Base64编码中为什么会有等号(=)问题