In this article, you will be introduced to the
To follow along with this article, you will need:
Note: The naming of these functions reference old Unix commands for converting binary to ASCII (btoa) and ASCII to binary (atob). However, “both the input and output of these functions are Unicode strings”.
btoa() takes a string and encodes it to Base64.
Let’s say you have a string,
"Hello World!", and wish to encode it to Base64. In your browser’s web developer console, define the string, encode it, and display the encoded string:
// Define the string var decodedStringBtoA = 'Hello World!'; // Encode the String var encodedStringBtoA = btoa(decodedStringBtoA); console.log(encodedStringBtoA);
The output of this code is a string of characters with letters and numbers:
atob() takes a string and decodes it from Base64.
Let’s take the encoded string from earlier,
'SGVsbG8gV29ybGQh', and decode it from Base64. In your browser’s web developer console, define the string, decode it, and display the decoded string:
// Define the string var encodedStringAtoB = 'SGVsbG8gV29ybGQh'; // Decode the String var decodedStringAtoB = atob(encodedStringAtoB); console.log(decodedStringAtoB);
The output of this code reveals the string has been converted back to its original message:
- OutputHello World!
Now, you have two tools for encoding and decoding Base64.
It is possible to use Base64 to convert input, like form data or JSON, to a string with a reduced character set that is URL-safe. However, due to how certain servers may interpret plus (
+) and forward-slash (
/) characters, it is recommended to use
Base64 is in no way meant to be a secure encryption method.
Base64 is also not a compression method. Encoding a string to Base64 typically results in 33% longer output.
In this article, you were introduced to
atob to encode and decode Base64 strings.
Want to deploy your application quickly? Try Cloudways, the #1 managed hosting provider for small-to-medium businesses, agencies, and developers - for free. DigitalOcean and Cloudways together will give you a reliable, scalable, and hassle-free managed hosting experience with anytime support that makes all your hosting worries a thing of the past. Start with $100 in free credits!