使用文件上传器模块上传文件

时间:2019-06-05 11:37:46

标签: sapui5

我正在尝试使用SAPUI5中的FileUploader模块上传文件。我要遵循的代码来自博客https://blogs.sap.com/2016/11/08/step-by-step-on-how-to-use-the-sapui5-file-upload-feature/,但是该代码似乎没有执行reader.onload函数?它到达reader.readAsDataURL(file),什么都不做?我不确定问题出在哪里以及如何解决它? Hekp将不胜感激,博客回复中存在类似问题,但未提供任何帮助。

XML

<u:FileUploader 
   id="VRCFileUploader"
   value="{VRCFileUpload}"
   placeholder="Please Attach document"
   fileType="jpg,png,pdf"
   style="Emphasized"
   useMultipart="false" >
</u:FileUploader>

JS

function upload(evnt) {
    var token;
    var oView = this.getView();
    var oFileUploader = this.byId("VRCFileUploader");
    var sFileName = oFileUploader.getValue();
    if (sFileName === "") {
        sap.m.MessageToast.show("Please select a File to Upload");
    return;
    }

    var file = jQuery.sap.domById(oFileUploader.getId() + "-fu").files[0];
    var base64_marker = "data:" + file.type + ";base64,";
    var reader = new FileReader();
    //on load
    reader.onLoad = (function(theFile){
                return function(evt) {
                    //locate base64 content
                    var base64Index = evt.target.result.indexOf(base64_marker) + base64_marker.lenght;
                    // get base64 content
                    var base64 = evt.target.result.substring(base64Index);
                    var sTasksService = "SOME URL";
                    var sService2 = "SOME URL";
                    var oViewModel = oView.getModel();
                    var oContext = oView.getBindingContext();
                    var oTask = oViewModel.getProperty(oContext.getPath());
                    var oDataModel = sap.ui.getCore.getModel();
                    var sWorkitemId = JSON.stringify(oTask.wiId);
                    var service_url = sService2;

                    $.ajaxsetup({
                        cache: false
                    });

                    jQuery.ajax({
                        url: service_url,
                        asyn: false,
                        datatype: "json",
                        cache: false,
                        data: base64,
                        type: "post",
                        beforeSend: function(xhr) {
                            xhr.setRequestHeader("x-csrf-Token", token);
                            xhr.setRequestHeader("content-Type", file.type);
                            xhr.setRequestHeader("slug", sFileName);
                            xhr.setRequestHeader("WorkitemId", oTask.WiId);
                        },
                        success: function(odata) {
                            sap.m.MessageToast.show("file successfully uploaded");
                            oFileUploader.setValue("");
                        },
                        error: function(odata) {
                            sap.m.MessageToast.show("file Upload error");
                        }
                    });
                };
            })(file);
            //Read file
            reader.readAsDataURL(file); 

        }

回复Vortex: enter image description here

1 个答案:

答案 0 :(得分:0)

为什么onLoad属性上使用的方法上有IIFE?

尝试做这样的事情:

reader.onload = event => {
            let fileAsDataUrl = event.target.result;
            ....
        };