If you are trying to encode a string to Base64 in JavaScript using the native browser function, you have likely encountered this exact console error:
Uncaught DOMException: Failed to execute 'btoa' on 'Window': The string to be encoded contains characters outside of the Latin1 range.
This is one of the most frustrating errors in modern web development. It happens the moment a user types an emoji (🚀), an accented letter (é), or any non-English character into your input field.
In this guide, we will explain exactly why this happens and provide the copy-paste solution to fix it permanently.
The Root Cause: Why btoa() Fails on Emojis
The native btoa() (Binary to ASCII) and atob() functions in JavaScript are incredibly fast, but they have a fatal flaw: they only support ASCII (Latin1) characters.
When you pass a standard string like "Hello World", it works perfectly. But modern strings in JavaScript are UTF-16 encoded. When you pass a character that requires more bytes (like an emoji), btoa() panics because it doesn't know how to convert multi-byte characters into a binary string.
The Solution: How to Encode Unicode to Base64
To fix this, we need to manually encode the multi-byte characters into a format that btoa() can safely read. The most robust way to do this without installing heavy external libraries is by combining encodeURIComponent with a simple Regex replacer.
The Safe Encode Function
Copy and paste this function into your codebase. It safely converts any UTF-8 string into Base64:
function unicodeBase64Encode(text) {
return btoa(
encodeURIComponent(text).replace(/%([0-9A-F]{2})/g,
function toSolidBytes(match, p1) {
return String.fromCharCode('0x' + p1);
}
)
);
}
The Safe Decode Function
Using standard atob() on the resulting string will give you gibberish. Use this reverse function instead:
function unicodeBase64Decode(base64) {
return decodeURIComponent(
atob(base64).split('').map(function(c) {
return '%' + ('00' + c.charCodeAt(0).toString(16)).slice(-2);
}).join('')
);
}
SharePoint & Microsoft Edge: Why 'btoa' Fails
If you are building SharePoint Framework (SPFx) extensions or custom web parts in Microsoft Edge, you will likely hit the Failed to execute 'btoa' on 'Window' error when handling user metadata or localized strings. Because SharePoint utilizes diverse character sets (UTF-16), standard btoa cannot handle the character encoding.
The Solution: Use the TextEncoder and Uint8Array method provided below to ensure your SharePoint scripts remain stable across all enterprise browser environments.
The Quickest Fix: Use a Unicode-Safe Base64 Tool
If you are just trying to quickly encode or decode an API key or a JSON web token containing special characters, writing custom scripts is a waste of time. Furthermore, using random online decoders puts your sensitive data at risk if they send it to a server.
We built the FmtDev Base64 Encoder & Decoder specifically to solve this problem.
- 100% Unicode & Emoji Safe: Our engine uses the exact safe-parsing logic shown above.
- Privacy-First: It runs entirely client-side in your browser. Your data is never sent to a server.
👉 Try the Free Unicode-Safe Base64 Tool Here