Create file from blob
I need a javascript guru. I have this code:
handleImage(new File([blob], blob.name, {type: blob.type})).done(/* something */)
and
handleImage = function (image) {
// create some fake form data
var formData = new FormData();
formData.append("attachment", image);
formData.append("auto", true);
formData.append("_csrf", "xxxxxxxxx");
// post to the server.
return $.ajax({
url: "/some/url",
data: formData,
cache: false,
contentType: false,
processData: false,
type: 'POST',
error: function () {
console.log("error");
}
});
This works fine with Chrome and Firefox, but when using Safari (10.1.1), the server (java / spring mvc) gets MultipartHttpServletRequest
an empty file to "attach". So it seems to me that new File([blob], blob.name, {type: blob.type})
it is failing somehow.
Any idea on what is wrong here?
This is probably a bug in the safari implementation.
But why are you even converting it to a File object?
The File object is a Blob, with the only difference that it has properties name
and lastModified
. But since you already seem to be expanding yours blob
, it only leaves this property lastModified
, which you could add anyway too.
The only API I can think of is where it matters if your object is a Blob or File way FormData.append
; where if you pass a File object it will be able to set the filename automatically. But this method has a third parameter allowing you to set this filename.
So, if you change your code to formData.append("attachment", image, image.name);
and call it with handleImage(blob)
directly, it will execute the same request as the one you are making, except that it will work in Safari and any other browser that does not support the file constructor ( looking at you IE).
source to share