Utilize Low-Code/No-Code Applications and Automations for Citizen Developers

Creating Connections to an OData API From SAP AppGyver

Objectives
After completing this lesson, you will be able to:

After completing this lesson, you will be able to:

  • Configure an OData integration in SAP AppGyver
  • Test the integration and explain the JSON data returned by the API

Connection to SAP Sales Cloud via an API URL

Next, we are going to set up the connection to the SAP Sales Cloud OData API. This can be done by configuring an OData type data resource in SAP AppGyver.

As a reminder (since you first learned about this in the earlier units):

  • an API allows us to fetch data from SAP Sales Cloud to use in our extension app.
  • OData is an open API standard used by many SAP APIs.
  • JSON is a popular data format used by APIs.

Using an API URL to connect to SAP Sales Cloud

This is our mock API URL for the OData service:

https://my346234.crm.ondemand.com/sap/c4c/odata/v1/c4codataapi/$metadata

Make sure to use below Basic Authentication credentials as you configure the integration in SAP AppGyver:

Credentials for Basic Authentication

FieldValue
UserDemouser
PasswordWelcome1
  

An API URL is really just like any other web address, except that it is used to communicate data between two systems. As stated before, the API URL we are providing is different from a real SAP Sales Cloud API, in that it has been created specifically for the learners of this unit. However, the data returned looks just like real data from a live SAP Sales Cloud API. Before getting into the configuration in SAP AppGyver, we can verify that the OData API URL works by simply using our browser to visit the URL. What we see is the XML metadata of the OData service. Fortunately, we don’t have to care too much about it, as SAP AppGyver will know what to do with this URL!

In case you happen to have access to a SAP Sales Cloud instance with the OData API, you can create the app using your own instance. In this case you should use the URL to your SAP Sales Cloud instance in the format:

https://my1234567890.crm.ondemand.com/sap/c4c/odata/v1/c4codataapi/$metadata

Do note that when using your own instance, you’ll need to create some appointments in your system to be able to list and filter it in the extensions app! Depending on your setup, you should also have your login credentials for the Sales Cloud instance, as you’ll need to enter them for the Basic Authentication configuration when configuring the integration in SAP AppGyver.

OData configuration

To start configuring the OData integration we have to connect the OData API with SAP AppGyver. We do this by clicking on the Data tab at the top.

Next click on add Data resource and click on OData integration.

Now, copy in this URL: https://my346234.crm.ondemand.com/sap/c4c/odata/v1/c4codataapi/$metadata

For Authentication choose Basic Authentication and use the credentials Demouser / Welcome1 to connect SAP AppGyver with the OData API. Click on Verify URL and switch on the AppointmentCollection resource and save the data resource.

Click on the created data resource, scroll down and switch on all the related resources by clicking on the switches, and then press SAVE DATA RESOURCE.

Let us test the resource so that we can see what it contains. To do that, click on the newly created OData integration.

Next, click on the list subcategory and switch to the Test tab.

To test the results, enter Demouseras Keyword and Welcome1 as Password.

To test the resource, scroll down and click on the Run Test button.

Testing the resource, we can see that some data is returned.

This data is in the JSON data format, which we also already heard about in Unit 4. The data is a list of objects; in JSON notation, the entire list itself is enclosed with square brackets [ ] and within the list there are 3 objects which are our 3 Appointments, and each one is enclosed by curly brackets { }. We don’t need to do anything directly with the JSON data, but understanding the JSON structure, and being able to verify the test results will help us in developing integrations like this one.

You can see the schema, or structure of the information, in the schema tab. This describes the structure of the information. SAP AppGyver will store and use this structure, making it easy to work with the data resource as we develop our app.

Exit the Data tab by clicking it again to get back to the canvas.

Creating a Data Variable

Finally, to use the configured data resource in our app, we need to create a new data variable. Data variables in SAP AppGyver are always created from data resources and they allow the UI components to interact with the data.

To create the data variable, we will switch to the variables’ view. Now, we click on the DATA VARIABLES tab on the left side, and then click on ADD DATA VARIABLE. Select the Data resource we created beforehand.

In the variables tab, let’s create a "collection" type data variable. We are using the collection type, because our data is a list or a collection of appointments.

Also make sure to configure ‘Basic authentication’ with the credentials:

User: Demouser

Password: Welcome1

In the data variable we can also set up filtering by clicking on the X under Filter condition.

In this case we’ll want to filter the appointments by type so let’s go ahead and filter to show only the appointments in category "Marketing".

To do this, we click on Object with properties. This allows us to create a filtering condition.

Next, we will create a condition that will show us only the results from the CategoryText field that have a value equal to Marketing. This works because in SAP Sales Cloud it is possible to define different categories for appointments and in our sample data, we have 3 appointments with the category "Marketing". We click on the "ADD CONDITION button; a box pops up in which we filter by the CategoryText property and leave the Condition type as equal. The condition type shows under which condition the appointments are being filtered. Next, write in the Component valueMarketing, since we want to get every appointment with in the category Marketing displayed. Lastly, click on Save.

We have set up our data variable. Let’s now go back to the canvas view by switching the toggle from "Variables" back to "View".

Save progress to your learning plan by logging in or creating an account