Quantcast
Channel: SCN: Message List
Viewing all articles
Browse latest Browse all 3462

Multiple File Uploads using Upload Collection control of sapUi5 on cross domain

$
0
0

I need to use "Upload Collection Control"
On browse button click just need to select the required files and On "Upload button" click need to upload all files on another server(backend).

 

I have tried it two ways

1. Tried it by setting the "uploadUrl" parameter of "UploadCollection", Set the backend url, but getting the error like "Cross-Origin Request Blocked:  (Reason: missing token 'access-control-allow-credentials' in CORS header 'Access-Control-Allow-Headers' from CORS preflight channel)."

2. Try to call it by ajax Call on button click event.

    But in ajax call I am not able to get the attach files content to pass it to API call

    I am able to get the attached files name by using "getFileName" method but not able to get the content of the file.


Below is the code in XML file :


<UploadCollection

    id="UploadCollection"

    maximumFilenameLength="55"

    maximumFileSize="10"

    sameFilenameAllowed="true"

    multiple="true"

    instantUpload="false"

    showSeparators="All"

    change="onChange"

    fileDeleted="onFileDeleted"

    filenameLengthExceed="onFilenameLengthExceed"

    fileSizeExceed="onFileSizeExceed"

    typeMissmatch="onTypeMissmatch"

    beforeUploadStarts="onBeforeUploadStarts"

    uploadComplete="onUploadComplete" >

</UploadCollection>

<Button

    id="Button"

    text="Upload Now"

    press="onStartUpload">

</Button>

 

For first way tried

  uploadUrl="server url"

 

 

Below is the code in controller file:


onStartUpload : function(oEvent) {

        var that = this;

        var oUploadCollection = this.getView().byId("UploadCollection");

        var file_items = oUploadCollection.getItems();

        // For first way

        oUploadCollection.upload();

         

       //OR

        // For Ajax call Second way

 

        var uploadFilesApiUrl = maxillui.model.Config.uploadFilesApiUrl;

        for(var file in file_items) {

                console.log("Files Data file---"+file_items[file]);

                console.log("Files Data file---"+file_items[file].getFileName());

                console.log("Files getMetadata file---"+file_items[file].getMetadata());//display blank

               jQuery.ajax({

                    type: 'POST',

                    url: uploadFilesApiUrl,

                    data: file_items[file],  

                    success : function(data,textStatus, jqXHR) {

                        console.log("Success");                      

                    },

                    error : function(jqXHR, textStatus, errorThrown) { 

                        var errorMsg = formatErrorMessage(jqXHR, textStatus);

                        sap.m.MessageToast.show(errorMsg);

                        //that._oDialog.setModel(oModel);

                        that.oBusyDialog.close();

                    }

                });

        }

    },

 

 

But for Ajax call Post data is not proper, we need to pass the files data.

 

 

Can please anybody help me on this?

How Can I do this using this control?

 

Thanks in advance.


Viewing all articles
Browse latest Browse all 3462

Trending Articles



<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>