Introduction
Base64 turns binary data into text that can be sent in JSON, URLs, or email. You’ll see it in API tokens, data URLs, and config. Quick rundown: what it is and when to reach for it.
What Is What Is Base64
Base64 is an encoding scheme that represents binary data using 64 ASCII characters: A–Z, a–z, 0–9, plus + and /. Each group of 3 bytes (24 bits) becomes 4 characters; padding with = is used when the input length isn’t a multiple of 3. The result is larger than the original (about 4/3) but safe for text-only channels.
Why It Matters
Many systems only accept text. JSON, XML, and headers don’t carry raw bytes. Base64 lets you embed images, keys, or binary payloads as strings. Decoding is the reverse: text → bytes. APIs and tools often use it for credentials or small binary blobs.
How to Calculate It
| Property | Value |
|---|---|
| Alphabet size | 64 |
| Input bytes per block | 3 |
| Output chars per block | 4 |
| Encoding ratio (chars/bytes) | 4/3 ≈ 1.333 |
Real-Life Example
A data URL for a tiny image: data:image/png;base64,iVBORw0KGgo... The part after base64, is the image bytes encoded in Base64. In JavaScript, atob() turns that string into a binary string; you can then convert to a Uint8Array or blob for use in an image or download.
Common Mistakes
Using Base64 for large data (it inflates size and CPU). Forgetting that btoa/atob in browsers are Latin1-based; use TextEncoder/TextDecoder for UTF-8 text. Confusing Base64 with encryption (it’s encoding; anyone can decode). Using Base64URL (which uses - and _) where standard Base64 (+ and /) is expected.
Practical Tips
- Use Base64 when the channel requires text (JSON, headers, URLs).
- For UTF-8 text, encode to bytes first, then Base64; decode back to bytes, then UTF-8.
- Prefer Base64URL for URLs and tokens to avoid + and / issues.
- Don’t use Base64 for compression; it increases size.
- Validate padding and character set when decoding; reject invalid input.
FAQs
Conclusion
Base64 is for turning binary into text when the medium is text-only. Use it for small payloads, tokens, or data URLs; use UTF-8-aware encode/decode for text; and don’t treat it as security. For URLs and tokens, prefer Base64URL to avoid + and /; for UTF-8 text always encode and decode via bytes so round-trip is correct.