Base64 Encoding: When It's Useful and When to Stop

Base64 shows up everywhere in modern web development — JWTs, data URIs, email attachments, API responses. Understanding when to use it and what it actually provides saves both bugs and security mistakes.

What Base64 Is For

Base64 solves one problem: moving binary data through text-only channels. Email was originally designed for ASCII text. Some JSON parsers don't handle raw binary. HTML attributes expect text strings. When you need to put binary data (an image, a file, encrypted bytes) into one of these contexts, Base64 encodes it as text.

Common Legitimate Uses

• Data URIs: embedding small images directly in HTML/CSS (data:image/png;base64,...)
• Email attachments: MIME encoding uses Base64 to embed binary files in text email
• JWTs: the header and payload sections are Base64URL encoded
• API responses: when an API needs to return binary data in a JSON field
• Cryptographic operations: encoding encrypted bytes or keys for storage/transmission

What Base64 Is Not For

Obfuscation: the assumption that encoded strings are safe because they're unreadable is wrong. Any developer (or attacker) with access to a decoder tool reads Base64 instantly. Compression: Base64 expands data by 33%, the opposite of compression. It's sometimes confused with compression because both transform data — they don't work the same direction.

Decoding in JavaScript

atob() decodes Base64 in the browser. btoa() encodes. These are built into the browser environment and handle standard Base64. For Node.js: Buffer.from(string, 'base64').toString('utf8') for decoding, Buffer.from(string, 'utf8').toString('base64') for encoding. For URL-safe Base64 variants, you need to handle the - and _ character substitutions manually.