How to Convert File to Base64 with JavaScript
// Convert file to Base64
function fileToBase64(file) {
return new Promise((resolve, reject) => {
const reader = new FileReader();
reader.onload = () => {
const base64 = reader.result; // Includes data URL prefix
resolve(base64);
};
reader.onerror = reject;
reader.readAsDataURL(file);
});
}
// Usage with file input
document.querySelector('input[type="file"]').addEventListener('change', async (e) => {
const file = e.target.files[0];
const base64 = await fileToBase64(file);
console.log(base64); // data:application/pdf;base64,JVBERi0x...
// Get only Base64 string (without prefix)
const base64Only = base64.split(',')[1];
// Get file info
console.log('File name:', file.name);
console.log('File size:', file.size, 'bytes');
console.log('File type:', file.type);
});
// Convert multiple files
async function convertMultipleFiles(files) {
const results = [];
for (const file of files) {
const base64 = await fileToBase64(file);
results.push({
name: file.name,
type: file.type,
size: file.size,
base64: base64.split(',')[1]
});
}
return results;
}