Uploading Files with FormData

FormData Uploads

FormData encodes file uploads as multipart/form-data. Do not set Content-Type manually — fetch sets it with the boundary.

Example

const form = document.querySelector("form");
const data = new FormData(form);
// Or manually
const fd = new FormData();
fd.append("file", fileInput.files[0]);
fd.append("title", "My Upload");
const res = await fetch("/api/upload", { method: "POST", body: fd });
// Do NOT set Content-Type header — fetch adds it automatically

JAVASCRIPT

Full Editor

Pro Tip

Setting Content-Type manually on a FormData request removes the boundary and breaks the upload.

Related Resources

JavaScript Reference

Complete tag & property list

JavaScript How-To Guides

Step-by-step practical guides

JavaScript Exercises

Practice what you've learned