Quick try::
hello, world
αβγδ
道可道非常道
𠮷
🍉🍇🍑🍓🥝

Conversion Process Analysis

Text(Unicode)
UInt8Array
Binary
Base64 Index
Base64 Char

Lookup Table

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

Base64 在线编码与解码

Base64 小解

Base64 是基于 64 个可打印字符来表示二进制数据的一种编码方式,是最为流行的 binary-to-text 编码算法。见 Base64

在前端工程化实践过程中,将会把二进制JPG/PNG图片转化为 base64 的 Data URI,用以减少 HTTP 请求次数。

base640-9A-Za-z+/ 组成,但是在 URL 中使用 base64 时,/ 容易与路径符号发生冲突。

因此,URL Safe Base64+ 替换为 _/ 替换为 -

通过 Base64 编码,每 3*8bit 的字节转换为 4*6bit 的字节,剩下的两位用 00 补齐。因此就有了常听到的 Base64 编码后的数据比编码之前大 1/3 的说法。

10101101, 10111010, 01110110
00101011, 00011011, 00101001, 00110110

转化过程

  1. 将数据转化为 uint8 二进制
  2. 将转化后的二进制每六个分为一组,共有 64 中可能 (0-63)
  3. 将六位一组的二进制,计算出 Index (0-63),并根据以上速对表及 Index 找到对应的 base64 字符
  4. 由此编码后 base64 长度为 4 的倍数,不足使用 = 进行填充

PS: 关于第4点,使用 = 进行补充,规范描述: base64 将原数据三个字节数最终编码为四个字节,但是原数据字节数最终有可能不足三个,原数据字节数可能会多一到两个字节。如果多一个字节,则编码结果最后填充 ==,如果多两个字节,则编码结果最后填充 =

见: https://datatracker.ietf.org/doc/html/rfc4648#section-4

  1. The final quantum of encoding input is an integral multiple of 24 bits; here, the final unit of encoded output will be an integral multiple of 4 characters with no "=" padding.
  2. The final quantum of encoding input is exactly 8 bits; here, the final unit of encoded output will be two characters followed by two "=" padding characters.
  3. The final quantum of encoding input is exactly 16 bits; here, the final unit of encoded output will be three characters followed by one "=" padding character.

规范以原字节数为视角进行描述,如果原数据字节数为 1,编码结果长度为2,需填充 2 个 =,原数据字节数为 2,编码结果长度为 3,需填充 1 个 =。换算成编码后视角而言,则为编码输出最终必须为 4 的倍数,不足使用 = 进行补齐。

API

Rest API

本站点对 Base64 提供对外 API 接口可供调用:

# 编码
$ curl -L devtool.tech/api/base64?s=hello

# 解码
$ curl -L devtool.tech/api/base64?s=5bGx5pyI&d

Live Demo

JS

在浏览器环境中可借助 btoa/atob 编码解码,在 Node 环境中借助于 Buffer API 编码解码。另可借助于 base64-js

const base64 = {
  encode (v: string) {
    return isBrowser ? btoa(v) : Buffer.from(v).toString('base64')
  },
  decode (v: string) {
    return isBrowser ? atob(v) : Buffer.from(v, 'base64').toString()
  }
}

Bash

Mac/Linux 中可以通过命令行工具 base64 进行解码编码

# 编码
$ echo hello | base64
aGVsbG8K

# 解码
$ echo aGVsbG8K | base64 -d
hello