Let the browser set the multipart boundary for an image upload

Leave Content-Type unset in the request options when fetch() sends FormData. The browser adds the multipart boundary needed by that body.

Build the form with const data = new FormData(); data.append("image", file); and pass it as the request body. A manually supplied Content-Type: multipart/form-data omits the boundary that the browser normally adds. Apply this rule to requests whose body is FormData.

Check a shared request helper for an unconditional JSON or multipart header before blaming the image bytes. Keep any authorization headers your application actually requires. Inspect the request and the server's response using a small non-sensitive test image.

The MDN FormData guide explains the boundary requirement. In a bug report, identify the body type and header construction without copying credentials into the report.

I work on Morphio, our image project at https://morphio.online/. These notes describe image preparation and review; they do not require a particular editing tool.