Search code examples
sapui5

How to use sap.ui.unified.FileUploader with custom blob or blobURL?

I'm doing client side image resizing prior to upload. The standard behavior of the FileUploader element will take the specified file and submit it as is. I have a blob with a resized version of the selected image ready to be uploaded. How can I set this blob in the FileUploader and make sure that it's not taking the original file?

Solution

  • With modern browsers I would send Blob with JavaScript native XMLHttpRequest: (for browser compatibility check send(FormData))

    var oReq = new XMLHttpRequest();
oReq.open("POST", sUploadUrl, true);
oReq.onload = function (oEvent) {
  // Uploaded.
};
var oFormData = new FormData();
oFormData.append("myFileUpload", blob);
oReq.send(formData);

    It sends the same request as the FileUploader.

    There's no method to set the file in the FileUploader component.
    The file input wrapped in the component can be accessed for files fileUploader.oFileUpload.files but it makes the inner state of the component inconsistent.