All my API uploaded images are called 'blob' 🙁

The image to be uploaded starts off in a canvas, gets converted to a blob, is appended to the FormData with FormData.append(‘file’, blob) and posted with ajax.

But all the images end up with the name ‘blob’.

Should I append another key:value to the FormData to get a better name? If so, what is the correct key? I don’t find that info in the docs…

instead of Blob object, try to use File File() - Web APIs | MDN

it implements Blob and adds a filename to Content-Disposition, so it would be like this:

Content-Disposition: form-data; name="file"; filename="someFileName"
1 Like

Thanks Alex. Just before trying your suggestion, I found a simple solution.

In fact,
FormData.append(‘file’, blob)
can take a third argument, like so:
FormData.append(‘file’, blob, filename)

which was all I needed…

and I found that here: FormData

1 Like