Introduction to jsbase64

jsbase64 is a powerful library that provides Base64 encoding and decoding functionalities for JavaScript applications. Whether you’re dealing with file uploads, data URIs, or APIs, jsbase64 makes it easy to encode and decode data securely and efficiently.

API Examples

Base64 Encoding and Decoding

One of the primary features of jsbase64 is its ability to encode and decode Base64 strings. Here are some examples:

// Base64 Encoding a string
const encoded = btoa('Hello, World!');
console.log(encoded); // Outputs: SGVsbG8sIFdvcmxkIQ==

// Base64 Decoding a string
const decoded = atob(encoded);
console.log(decoded); // Outputs: Hello, World!

Working with UTF-8 Strings

When dealing with UTF-8 strings, you need to encode and decode them using jsbase64 functions:

// Encode UTF-8 string
function encodeUTF8(str) {
    return btoa(unescape(encodeURIComponent(str)));
}

const utf8Encoded = encodeUTF8('こんにちは');
console.log(utf8Encoded); // Outputs: 44GT44KT44Gr44Gh44Gv

// Decode UTF-8 string
function decodeUTF8(str) {
    return decodeURIComponent(escape(atob(str)));
}

const utf8Decoded = decodeUTF8(utf8Encoded);
console.log(utf8Decoded); // Outputs: こんにちは

Binary Data Handling

Handling binary data like image files is easy with jsbase64:

// Convert binary data to Base64
function arrayBufferToBase64(buffer) {
    let binary = '';
    const bytes = new Uint8Array(buffer);
    for (let i = 0; i < bytes.byteLength; i++) {
        binary += String.fromCharCode(bytes[i]);
    }
    return btoa(binary);
}

// Convert Base64 to Binary data
function base64ToArrayBuffer(base64) {
    const binaryString = atob(base64);
    const len = binaryString.length;
    const bytes = new Uint8Array(len);
    for (let i = 0; i < len; i++) {
        bytes[i] = binaryString.charCodeAt(i);
    }
    return bytes.buffer;
}

Application Example: Image Upload with Base64 Encoding

Let's build a simple application that allows users to upload an image and then encode it to a Base64 string:

  
  


  
Upload an Image
  
  

In the example above, when a user selects an image file, it is read as a Data URL and then displayed as a Base64 string.

Conclusion

jsbase64 is a versatile library that simplifies the encoding and decoding of data in JavaScript applications. Whether you're working with text, UTF-8 strings, or binary data, jsbase64 provides the necessary tools to handle Base64 transformations efficiently.