base64app.com

Encode a file to base64 in JavaScript

Read files with FileReader or arrayBuffer in the browser.

Why file to base64 javascript?

Encode a file to base64 in JavaScript is one of the most common tasks developers hit when working with APIs, files, email attachments, and data URIs.

More Base64 guides on base64app — with copy-paste code and a free browser tool you can use without installing anything.

Quick reference

Base64 maps every 3 bytes to 4 ASCII characters. Padding with = may appear at the end. URL-safe variants swap +/ for -_.

When in doubt, paste your string into the tool below — base64app auto-repairs whitespace, data: prefixes, and padding issues.

Copy-paste code

File to base64 (browser)

const input = document.querySelector('input[type=file]');
input.addEventListener('change', async () => {
  const file = input.files[0];
  const buf = await file.arrayBuffer();
  const b64 = btoa(String.fromCharCode(...new Uint8Array(buf)));
  console.log(b64);
});

Related guides