Skip to Content
0
Jan 21, 2019 at 11:30 AM

How do I consume a Face Detection API using the SAPUI5 JSONModel?

482 Views

I'm trying to consume a business hub Face Detection API using mainly SAPUI5, but I'm having problems doing it with the code provided in the examples.

The snippet provided by SAP is the following:

var oModel = new sap.ui.model.json.JSONModel();

var sHeaders = {"content-type":"multipart/form-data; boundary=---011000010111000001101001","APIKey":"<API_KEY>"};

var oData = {<payload>};
oModel.loadData("https://sandbox.api.sap.com/ml/facedetection/face- 
detection", oData, true, "POST", null, false, sHeaders);

oModel.attachRequestCompleted(function(oEvent){
    var oData = oEvent.getSource().oData;
    console.log(oData);
});

As far as I understood, the api requires a files parameter of the type formData. If I use the provided code and pass a formData object, I get a "Uncaught TypeError: Illegal invocation" error.

So my main problem seems to be how to fill the of the variable oData.

I've tried the following:

var reader = new FileReader();
reader.onload = function(e) {

    var file = e.target.result;
    var oData = new FormData()

    oData.set('files', file);

    (continue with the api call)
}
reader.readAsDataURL(<data_url>);

I debugged the framework and found out that the JSONModel that is beeing used in the example tries to convert any objects into a string, it does so in a particularly strange way: If an attribute is defined as a function, it calls it, and that's where the Illegal invocation is comming from

I also tried to pass an object without functions, but I get an error 400, saying that I didn't pass any 'files' parameter:

var reader = new FileReader();
reader.onload = function(e) {

    var oData = { 'files': e.target.result}

    (continue with the api call)
}
reader.readAsBinaryString(<data_url>);

So my question is, how to fill correctly the payload of the oData object in the code snippet provided by SAP?