In this article, you will be introduced to the
To follow along with this article, you will need:
- An understanding of using functions available to the
Encoding and Decoding Strings with Base64
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:
- Hello World!
Now, you have two tools for encoding and decoding Base64.
Exploring Common Use Cases for 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
Understanding the Limitations of Base64
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.