Base64 Explained: The Computer Science Behind the Encoding
Base64 is everywhere — in JWTs, data URIs, email attachments. But do you actually understand how it works? Let's break it down from first principles.
这是大一计算机必修课的内容,但显然很多人毕业了也没搞明白。
Let me fix that. By the end of this article, you'll understand Base64 at the bit level — not just "paste text and click convert."
What Problem Does Base64 Solve?
Computers store data as bytes (8 bits). But some protocols — like email (SMTP), early HTTP, and URLs — only safely transmit ASCII text characters (A-Z, a-z, 0-9, +, /).
What happens when you need to send binary data (images, PDFs, encrypted content) through a text-only channel?
Encoding. You convert binary data into a text representation that only uses safe characters.
How Base64 Works (Bit by Bit)
Take the string "Hi!" as an example.
Step 1: Convert to binary
H = 72 = 01001000
i = 105 = 01101001
! = 33 = 00100001
Step 2: Concatenate bits
01001000 01101001 00100001
Step 3: Split into 6-bit groups
010010 000110 100100 100001
Step 4: Convert each group to decimal
010010 = 18 → S
000110 = 6 → G
100100 = 36 → k
100001 = 33 → h
Step 5: Map to Base64 alphabet
A=0, B=1, ..., Z=25, a=26, ..., z=51, 0=52, ..., 9=61, +=62, /=63
Result: SGkh
Why 3 Bytes Become 4 Characters
3 bytes = 24 bits. 24 / 6 = 4 groups. That's why Base64 always expands data by 33%.
| Input Size | Base64 Output |
|---|---|
| 3 bytes | 4 chars |
| 300 bytes | 400 chars |
| 3 MB | 4 MB |
Padding with =
If your input isn't divisible by 3, Base64 adds padding:
- 1 remaining byte → 2 Base64 chars +
== - 2 remaining bytes → 3 Base64 chars +
=
"Hi" (2 bytes) → "SGk="
"H" (1 byte) → "SA=="
Common Use Cases
-
Data URIs — Embed images directly in HTML/CSS:
<img src="data:image/png;base64,iVBORw0KGgo..."> -
JWT Tokens — The header and payload are Base64url-encoded:
eyJhbGciOiJIUzI1NiJ9.eyJ1c2VyIjoiYWRtaW4ifQ.abc123 -
HTTP Basic Auth —
Authorization: Basic base64(username:password) -
Email Attachments — MIME encodes attachments as Base64
Base64 vs Base64url
Standard Base64 uses + and /. URLs can't contain / safely. Base64url replaces:
+→-/→_
Use a Base64 Converter to encode/decode between standard and URL-safe variants.
Is Base64 Encryption?
No. Base64 is encoding, not encryption. Anyone can decode it. It's like putting a letter in an envelope — anyone can open the envelope and read it.
If you need secrecy, use encryption (AES, RSA). If you need safe transport through text channels, use Base64.
Quick Reference
| Operation | Tool |
|---|---|
| Text → Base64 | Base64 Converter |
| Base64 → Text | Base64 Converter |
| File → Base64 | Base64 Converter |
| JWT decode | JWT Decoder |
Encode and decode Base64 instantly with our free Base64 Converter — supports text, files, and URL-safe variants.
Try It Yourself
Put what you've learned into practice with our free online tools.
Related Articles
Base64 Encoding Explained: A Complete Guide for Developers
Learn everything about Base64 encoding, when to use it, common use cases, and how to encode and decode Base64 strings in JavaScript, Python, and more.
Recursion Demystified: From Confusion to Clarity
If you still don't understand recursion after this explanation, I'll be disappointed...
Python vs JavaScript: An Honest Comparison for Web Devs
Galera, let's settle this debate once and for all! Python or JavaScript?...