Overview
When developping SAPUI5 applications, which retrieve data from SuccessFactors instances it comes to the point when you have to read data from your SF instance.
In this blog I want to highlight the easy and comfortable use of SAP Cloud Platform Destination Services to read data for your web application, e.g. when developping extensions for SuccessFactors.
Scenario
Reading data from SuccessFactors can be achieved by two ways: SFAPI (WSDL-based SOAP webservice) or via OData API which is highly preferrable and the only way explained in this blog.
When reading data within the SAPUI5 application you have to decide to AJAX the data, work with an callback, set XHR headers etc. giving all kind of information to the XHR and at the end:
No 'Access-Control-Allow-Origin' header is present...
Goal
This blog should provide an easy way to integrate third party SAP systems (via OData) or APIs from the SAP API Business Hub into your SAPUI5 application.
Realization
SAP Cloud Platform --> Connectivity ->
Destinations ->
New
Name: sap_hcmcloud_core_odata,
Type: HTTP
URL: https://api12preview.sapsf.eu <-- or acc. to your Endpoint: KBA 2215682
Auth: Internet, Basic Authentication
Your User (Username@Company),
Your Password
Properties
WebIDEEnabled = true
WebIDESystem = SFSF
WebIDEUsage = odata_gen
Open
SAP Web IDE Full-Stack -> Create a new SAPUI5 from a blank template
Adapt
neo-app.json and add a route:
{ "path": "/sf-dest",
"target": {
"type": "destination",
"name": "sap_hcmcloud_core_odata"
},
"description": "SFSF Connection"
}
Fill a
JSON Model in your controller...
sap.ui.define([
"sap/ui/core/mvc/Controller"
], function (Controller) {
"use strict";
return Controller.extend("yourNamespace.yourAppName.controller.Main", {
onInit: function () {
var oModel = new sap.ui.model.json.JSONModel();
var sHeaders = {
"Content-Type": "application/json",
"Accept": "application/json",
};
//sending request
oModel.loadData("/sf-dest/odata/v2/User('userID')", null, true, "GET", null, false, sHeaders);
console.log(oModel);
}
});
});
Example for a
POST request:
var oData = {
"name" : "test"
};
oModel.loadData("/sf-dest/odata/v2/YourEntity", oData, true, "POST", null, false, sHeaders);
Also a good feature
instead of oModel.loadData is to use
SAP Web IDE Full Stack Template for Worklists and/or Master/Detail-Lists, just reference on the Destination:
Security
Please create all your destinations with
OAuth SAML Bearer using the NEO Command Line HCM Cloud Tools:
CLI Installation |
CLI Console Statements
The approach above should demonstrate the usage of SAP CP Destination Services.
It could also be applies to SAP ML APIs, with the same security aspects, rather use OAuth than Basic Authentication.
Conclusion
This way you avoid a lot of CORS / Cross-Origin-Problems.
This also applies to SAP API Business Hub ML APIs - an easy way to integrate APIs/OData Webservices.
Cheers
Chris