How to Decode Base64 in JavaScript, Node.js & TypeScript

In web development, you frequently need to encode or decode Base64 strings when handling API tokens, basic auth headers, or embedded image thumbnails. Here is how to handle both browser and server-side environments cleanly.

1. Modern Browser JavaScript (With UTF-8 Support)

The legacy `atob()` and `btoa()` functions only accept Latin1 (0x00 to 0xFF) characters. If you pass emojis or international languages, `btoa()` throws a `DOMException: The string to be encoded contains characters outside of the Latin1 range`.

To safely encode UTF-8 text in the browser: ```javascript function encodeBase64Utf8(str) { const bytes = new TextEncoder().encode(str); const binString = Array.from(bytes, (byte) => String.fromCharCode(byte)).join(""); return btoa(binString); } ```

To safely decode UTF-8 text in the browser: ```javascript function decodeBase64Utf8(base64) { const binString = atob(base64); const bytes = Uint8Array.from(binString, (m) => m.charCodeAt(0)); return new TextDecoder().decode(bytes); } ```

2. Node.js & TypeScript Server-Side

In Node.js, the global `Buffer` class provides high-performance C++ native conversion: ```typescript // Encoding const b64 = Buffer.from("Hello World 🚀", "utf-8").toString("base64"); // Decoding const text = Buffer.from(b64, "base64").toString("utf-8"); ```

Node.js also natively supports Base64URL via `toString("base64url")` and `Buffer.from(str, "base64url")`.