How to give a Blob uploaded as FormData a file name? How to give a Blob uploaded as FormData a file name? google-chrome google-chrome

How to give a Blob uploaded as FormData a file name?


For Chrome, Safari and Firefox, just use this:

form.append("blob", blob, filename);

(see MDN documentation)


Adding this here as it doesn't seem to be here.

Aside from the excellent solution of form.append("blob",blob, filename); you can also turn the blob into a File instance:

var blob = new Blob([JSON.stringify([0,1,2])], {type : 'application/json'});var fileOfBlob = new File([blob], 'aFileName.json');form.append("upload", fileOfBlob);


Since you're getting the data pasted to clipboard, there is no reliable way of knowing the origin of the file and its properties (including name).

Your best bet is to come up with a file naming scheme of your own and send along with the blob.

form.append("filename",getFileName());form.append("blob",blob);function getFileName() { // logic to generate file names}