How to Base64 encode in TypeScript

How to Base64 encode in TypeScript

Base64 encoding is a widely used method for encoding binary data as text, making it a crucial technique for developers to master. In this article, we will explore how to Base64 encode in TypeScript, covering the most common use case, edge cases, common mistakes, and performance tips.

Quick Example

Here's a minimal example of Base64 encoding in TypeScript:

import * as Buffer from 'buffer';

const input = 'Hello, World!';
const encoded = Buffer.from(input).toString('base64');
console.log(encoded); // Outputs: "SGVsbG8sIFdvcmxkIQ=="

This example uses the Buffer class from the buffer module to create a buffer from the input string and then encodes it to Base64 using the toString method.

Step-by-Step Breakdown

Let's break down the code line by line:

1. import * as Buffer from 'buffer';: We import the Buffer class from the buffer module, which is a built-in module in Node.js.
2. const input = 'Hello, World!';: We define the input string to be encoded.
3. const encoded = Buffer.from(input).toString('base64');: We create a buffer from the input string using the Buffer.from method and then encode it to Base64 using the toString method with the 'base64' encoding.
4. console.log(encoded);: We log the encoded string to the console.

Handling Edge Cases

Empty/Null Input

When handling empty or null input, we should return an empty string or throw an error, depending on the requirements. Here's an example:

function base64Encode(input: string): string {
  if (!input) {
    return '';
  }
  return Buffer.from(input).toString('base64');
}

Invalid Input

When handling invalid input, we should throw an error. Here's an example:

function base64Encode(input: string): string {
  try {
    return Buffer.from(input).toString('base64');
  } catch (error) {
    throw new Error(`Invalid input: ${input}`);
  }
}

Large Input

When handling large input, we should consider using a streaming approach to avoid loading the entire input into memory. Here's an example:

import * as fs from 'fs';

function base64Encode(input: string): Promise<string> {
  return new Promise((resolve, reject) => {
    const readStream = fs.createReadStream(input);
    const writeStream = fs.createWriteStream('output.txt');
    const base64Stream = new Buffer.from('', 'base64');
    readStream.pipe(base64Stream).pipe(writeStream);
    writeStream.on('finish', () => {
      resolve('output.txt');
    });
  });
}

Unicode/Special Characters

When handling Unicode or special characters, we should ensure that the input is properly encoded before Base64 encoding. Here's an example:

function base64Encode(input: string): string {
  const encoded = Buffer.from(input, 'utf8').toString('base64');
  return encoded;
}

Common Mistakes

Mistake 1: Using the Wrong Encoding

Using the wrong encoding can result in incorrect Base64 encoding. Here's an example of the wrong code:

const encoded = Buffer.from(input).toString('utf8');

Corrected code:

const encoded = Buffer.from(input).toString('base64');

Mistake 2: Not Handling Edge Cases

Not handling edge cases can result in errors or unexpected behavior. Here's an example of the wrong code:

function base64Encode(input: string): string {
  return Buffer.from(input).toString('base64');
}

Corrected code:

function base64Encode(input: string): string {
  if (!input) {
    return '';
  }
  try {
    return Buffer.from(input).toString('base64');
  } catch (error) {
    throw new Error(`Invalid input: ${input}`);
  }
}

Mistake 3: Not Using the Buffer Class

Not using the Buffer class can result in incorrect Base64 encoding. Here's an example of the wrong code:

const encoded = input.toString('base64');

Corrected code:

const encoded = Buffer.from(input).toString('base64');

Performance Tips

Tip 1: Use the Buffer Class

Using the Buffer class can improve performance by avoiding the overhead of string encoding and decoding. Here's an example:

const encoded = Buffer.from(input).toString('base64');

Tip 2: Use a Streaming Approach

Using a streaming approach can improve performance by avoiding loading large input into memory. Here's an example:

import * as fs from 'fs';

function base64Encode(input: string): Promise<string> {
  return new Promise((resolve, reject) => {
    const readStream = fs.createReadStream(input);
    const writeStream = fs.createWriteStream('output.txt');
    const base64Stream = new Buffer.from('', 'base64');
    readStream.pipe(base64Stream).pipe(writeStream);
    writeStream.on('finish', () => {
      resolve('output.txt');
    });
  });
}

Tip 3: Avoid Using toString Method

Avoid using the toString method to convert the buffer to a string, as it can be slow for large inputs. Instead, use the toString method with the 'base64' encoding. Here's an example:

const encoded = Buffer.from(input).toString('base64');

FAQ

Q: What is Base64 encoding?

A: Base64 encoding is a method for encoding binary data as text.

Q: Why do I need to use the Buffer class?

A: The Buffer class is required to properly encode binary data to Base64.

Q: How do I handle large input?

A: Use a streaming approach to avoid loading large input into memory.

Q: What happens if I use the wrong encoding?

A: Using the wrong encoding can result in incorrect Base64 encoding.

Q: Can I use toString method to convert the buffer to a string?

A: Avoid using the toString method to convert the buffer to a string, as it can be slow for large inputs.