Can I set file name in blob data when I upload data to server using html5?

Question

I use event.clipboardData to get image from clipboard, and then upload it server, code:

var items = e.clipboardData.items; for(var i=0;i<items.length;i++) {     if(items[i].type.indexOf("image")!=-1)     {         var blob=items[i].getAsFile();         var data = new FormData();         data.append("ImageFileField",blob);         _post2("url...",data);     } } 

NOTE: _post2() is a function using XMLHttpRequest to do upload works.

Above code work fine, the image from clipboard can upload to my server directly.

BUT I found a problem, the filename of image upload to server is fixed as "blob", can I modify the filename before upload to server?

This is the upload data detail:

Request Payload

------WebKitFormBoundaryW0NQVOkdrfkYGWV3
Content-Disposition: form-data; name="%%File.48257279001171c9.2c36671da7f1b6c9482575de002e1f14.$Body.0.3D8"; filename="blob"

Content-Type: image/png

------WebKitFormBoundaryW0NQVOkdrfkYGWV3--

Answer 1

According to FormData, you should be able to add a filename parameter to your data.append() call as follows:

data.append("ImageFileField", blob, "imageFilename.png");