Base64 is one of the most commonly used encoding schemes in web development. From email attachments to inline images, from JWT Tokens to data URIs, it is everywhere. Yet many developers only understand it as a "conversion tool" without grasping its underlying principles and boundaries. This article systematically explains how Base64 works from the ground up.
Why Do We Need Base64?
In computer systems, data is stored and transmitted in binary form (0s and 1s). However, many communication protocols (such as SMTP email) and text formats (such as JSON, XML, and HTML) were originally designed to support only ASCII text. When binary data (images, audio, PDFs) needs to be transmitted through these text channels, a method is needed to convert binary data into a text string.
Base64 is exactly such a scheme: it converts arbitrary binary data into text strings containing only 64 safe ASCII characters, ensuring safe transmission through text channels.
Encoding Principles
The core idea of Base64 is to group binary data into chunks of 3 bytes (24 bits), then split each chunk into 4 units of 6 bits. Each 6-bit unit can represent a value from 0 to 63, corresponding to one character in the Base64 alphabet.
The Base64 Alphabet
Standard Base64 uses the following 64 characters:
- A-Z: 0-25
- a-z: 26-51
- 0-9: 52-61
- + /: 62-63
Encoding Example
Take the string "Man" as an example:
- Convert to ASCII binary:
01001101 01100001 01101110 - Split into 6-bit groups:
010011010110000101101110 - Convert to decimal: 19, 22, 5, 46
- Map to Base64: T, W, F, u
- Final encoded result:
TWFu
Padding
When the original data is not a multiple of 3 bytes, padding is required. Base64 uses the equals sign = for padding:
- 1 remaining byte: encoded as 2 characters + 2
= - 2 remaining bytes: encoded as 3 characters + 1
=
For example, the string "M" (1 byte) encodes to TQ==, and "Ma" (2 bytes) encodes to TWE=.
Base64 Is Not Encryption
This is the most common misconception. Base64 is an encoding, not encryption. Encoding is a reversible mapping process with no key involved—anyone can easily decode it. Encoding sensitive data with Base64 provides no security whatsoever.
If you need to protect data confidentiality, use real encryption algorithms like AES or RSA, combined with HTTPS/TLS for secure transmission.
URL-Safe Base64 (Base64URL)
The + and / characters in standard Base64 have special meanings in URLs (space and path separator). Passing them directly in URLs causes issues. URL-safe Base64 makes the following substitutions:
+→-/→_- Remove trailing
=padding
URL-safe Base64 is widely used in JWT Tokens, OAuth parameters, and URL shorteners.
Typical Use Cases
1. Inline Images (Data URIs)
After converting an image to Base64, it can be embedded directly in HTML or CSS without additional HTTP requests:
<img src="data:image/png;base64,iVBORw0KGgo..." />
This approach is suitable for small icons and background images, but for large images it increases file size by ~33%.
2. JWT Tokens
JSON Web Token headers and payloads are encoded with Base64URL. Decoding the dot-separated parts reveals the plain JSON data (note: the signature is for verification and should not be omitted).
3. Email Attachments (MIME)
The SMTP protocol only supports 7-bit ASCII text. Binary attachments (PDFs, images) in emails are embedded after Base64 encoding.
4. API Data Transfer
In RESTful APIs, binary data (such as image thumbnails) sometimes needs to be returned as text. Base64-encoded strings can be embedded directly in JSON responses.
Performance and Size Considerations
Base64 encoding increases data size by approximately 33% (3 bytes become 4 characters). For example, a 1MB file becomes about 1.37MB after encoding. In bandwidth-sensitive scenarios, this trade-off must be considered.
Additionally, Base64 encoding and decoding require extra CPU cycles. For high-frequency operations (such as real-time image streams), binary transmission should be used instead.
Conclusion
Base64 is a bridge between the binary and text worlds. Understanding its principles helps us use it correctly in appropriate scenarios. Remember the core principle: Base64 is encoding, not encryption. It is for data transmission, not data protection. For web URL scenarios, prefer URL-safe Base64. Used wisely, it becomes an indispensable part of your toolkit.