SAPUI5文件上传答案

【问题标题】：SAPUI5 file uploadSAPUI5文件上传
【发布时间】：2015-10-30 14:53:47
【问题描述】：

我正在创建一个需要上传附件的 SAPUI5 应用。我还是很新用的SAPUi5。我想将上传的文件保存到数据库。我可以使用文档服务吗？如果是这样，请向我提供相关文档或教程。

【问题讨论】：

【解决方案1】：

我已经在我的 SAPUI5 应用程序中完成了这一操作，用于上传功能check out my gist.

onUpload: function(e) {
  var fU = this.getView().byId("idfileUploader");
  var domRef = fU.getFocusDomRef();
  var file = domRef.files[0];
  var reader = new FileReader();
  reader.onload = function(oEvent) {
    var strCSV = oEvent.target.result;
    var arrCSV = strCSV.match(/[\w .]+(?=,?)/g);
    var noOfCols = 6;
    var headerRow = arrCSV.splice(0, noOfCols);
    var data = [];
    while (arrCSV.length > 0) {
      var obj = {};
      var row = arrCSV.splice(0, noOfCols);
      for (var i = 0; i < row.length; i++) {
        obj[headerRow[i]] = row[i].trim();
      }
      data.push(obj);
    }
  };
  reader.readAsBinaryString(file);
}

【讨论】：

虽然此链接可能会回答问题，但最好在此处包含答案的基本部分并提供链接以供参考。如果链接页面发生更改，仅链接答案可能会失效。 - From Review
好的，谢谢你的评论，我会编辑我的答案。

【解决方案2】：

不管你使用DB还是Document Service，对于SAPUI5，你可以使用sap.ui.unified.FileUploader。阅读更多here

示例 XML 代码为：

<sap.ui.unified:FileUploader
    id="fileUploader"
    width="100%"
    uploadUrl=""
    placeholder="Add attachment"
    uploadOnChange="false"
    uploadComplete="handleUploadComplete"
    change="handleValueChange"
    typeMissmatch="handleTypeMissmatch"
    style="Emphasized"
    useMultipart="false" >
</sap.ui.unified:FileUploader>

上传时请确保将 slug 和 x-csrf-token 添加到标头参数中。

例子：

 var oFileUploader = _this.byId("fileUploader");
 oFileUploader.addHeaderParameter(new sap.ui.unified.FileUploaderParameter({
                    name: "slug",
                    value: oFileUploader.getValue()
                }));
 oFileUploader.addHeaderParameter(new sap.ui.unified.FileUploaderParameter({
                    name: "x-csrf-token",
                    value: _this.oDataModel.getSecurityToken()
                }));
 oFileUploader.upload();

如果您使用的是 ABAP Netweaver 网关堆栈，则需要在 DPC_EXT 类中实现 CREATE_STREAM 方法。还需要确保网关模型支持具有“媒体”的特定 EventType。

【讨论】：

感谢您的回复，当这个上传发生时，它会保存在哪里？另外，slug 和 x-csrf-token 需要什么？
slug 用于文件名，x-csrf-token 用于 POST 请求

【解决方案3】：

uploadFile:function{
    var that = this;
    var count = 0;
    var o = "<URI>";
    var h = new sap.ui.model.odata.ODataModel(o, true);
    var d = "";
    h.setSizeLimit(5000);
    h.forceNoCache(true);
    var b = ({
        "X-Requested-With": "XMLHttpRequest",
        "Content-Type": "application/json",
        "X-CSRF-Token": "Fetch",
    });
    OData.request({
        requestUri: o,
        method: "GET",
        headers: b
    }, function (e, j) {
        d = j.headers["x-csrf-token"];
        that.csrfToken = d;
        that.getModel("oAppData").setProperty("/busyIndicators/uploadFile", true);
        for (var l = 0; l < that.fileDataAD.length; l++) {
            var i = "<URI>";
            var h = new sap.ui.model.odata.ODataModel(i, true);
            h.setSizeLimit(5000);
            h.forceNoCache(true);
            var b = ({
                "X-CSRF-Token": that.csrfToken,
                "Slug": that.fileDataAD[l].fileName + "|" + that.fileDataAD[l].fileType + "|" + "B" + "|" + reqId + "|" + 1
            });
            OData.request({
                requestUri: i,
                method: "POST",
                headers: b,
                data: that.fileDataAD[l].file
            }, function (oData, oRes) {
                count = count + 1;
                if (count === that.fileDataAD.length) {
                    that._uploadCompleteAddDependent();
                }
            }.bind(this), function (oError) { }                     
        }           
    });
 }

其中fileDataAD 是缓冲区数组

【讨论】：