Unable to consume data from a odata service

[YashminBehera]

In my recent project, I embarked on integrating an OData service, specifically API_PRODUCT_SRV, through SAP Build. Utilizing the OData integration in the "Create Data Entity" section, I provided the base API URL and basic authentication credentials. After successful verification, I chose the "List" option under the entity and ran the test using the given username and password. The test API call response came back with a satisfying 200 OK status, returning values for all the specified fields. The schema appeared to be correct as well.

With the initial steps successfully completed, I enabled certain entities and proceeded to the UI page. Here, I dragged and dropped a list item component, created a data variable for the enabled entity, and selected the type as a collection of records. In the list item configuration, I set it to repeat with the entity data variable, adding specific fields as the primary and secondary labels.

Despite following these steps meticulously, I encountered an issue while previewing the UI: no data was displayed. Below is a summary of the steps I took:

1. OData Integration:
- Provided base API URL.
- Used basic authentication credentials.
- Verified the service.
- Chose "List" option under entity.
- Ran the test with provided username and password.
- Received 200 OK response with correct schema.

2. UI Configuration:
- Enabled entities.
- Dragged and dropped list item component.
- Created a data variable for the enabled entity (type: collection of records).
- Configured list item to repeat with entity data variable.
- Added fields as primary and secondary labels.

Issue: Data Not Displaying in Preview

I have checked the configurations multiple times and ensured that all steps were followed correctly. The API response and schema seem to be accurate, yet the data is not being rendered in the list item during the preview.

Request for Help:

If anyone has encountered a similar issue or has insights into what might be going wrong, your assistance would be greatly appreciated. Could there be a configuration step I might have overlooked, or is there a known issue with this specific OData service integration in SAP Build?

Thank you in advance for your help!

Best Regards,

Yashmin Behera

SAP Community 

SAP Build Apps 

@Dan_Wroblewski 

@Ivan_Miguel 

@sakshamjain 

[Dan_Wroblewski]

What error code and message are returned when retrieving data in the UI?

[YashminBehera]

Hi @Dan_Wroblewski 

Let me provide some screenshots to make myself understand.

I am providing the authentication and the base API URL, and then enabling the required entity and expanding entities.

Then opening the saved data resource, going to the list section and choosing the desired fields I run the test and the response comes positive.

Then creating a data variable from the data source as a collection of records.

On the user interface page, dragging and dropping a list item, repeating it with the data variable created earlier and then repeating the primary label with the current product and secondary label with the current netweight.

Then while previewing the app I see blank page, no details are visible as expected, just a blank page.

Can you please help me to understand what I am missing in this.
The odata service is API_PRODUCT_SRV.

Best Regards,
Yashmin Behera

SAP Community 
SAP Build 

[Dan_Wroblewski]

Do you have a real S/4HANA that you are connecting with the plain OData data resource, putting in your credentials in the flow function? Generally, people would create a destination and then use the OData destination data source.

I imagine you are getting a CORS error and no data is returned. But whenever you don't get data, you should retrace your steps and check at each step if data appears. For example, is data returned to the data variable before getting to the UI.

[YashminBehera]

Hi @Dan_Wroblewski 
Yes, I have created a destination for it.

but while using SAP systems integrations through BTP destinations I receive a connection failed message on the screen.

That is the reason I was opting for odata integration under create data entity dropdown.

and can you please explain me how to check if the is  data returned to the data variable before getting to the UI like you mentioned in your reply earlier.

[Dan_Wroblewski]

I just add an alert after the get record collection in the data variable (or wherever you are doing the fetching) to display the output and make sure I am getting data. I imagine now for you you are not getting since it is a CORS issue.

Can you show the details of your destination, including the full URL (except for the credentials 😉)?

[YashminBehera]

Thanks to you I rechecked my destination and opted out the /$metadata from the /ZWEB_ORDERING_SRV/$metadata and now I am able to fetch the data.😅

Thank You @Dan_Wroblewski  for saving the day.😊

[YashminBehera]

Hi @Dan_Wroblewski 
still in need of your help while continuing with the building of the app using this service,
let say the service is: 
https://dummylink.sap.com/sap/opu/odata/sap/ZWEB_ORDERING_SRV

I am enabling an entity say MaterialSet which has fields like Image, materialdescription, price, currency, materialName and more.

Dragging and dropping a Large image list item I am repeating with the data variable that I have already created from the data source

The time label and description text are set to data item in repeat to MaterialDescription field and price field.

coming to the image source the data item in repeat option is incompatible and so I have to opt for the formula, which is where I am facing the problem

I tried to get the path of the image from the URL used and tried it as a formula but I am unable to see the images while previewing.

FYI, the images from the data source used are in base64 format, a glimpse of the browse real data from the source I am using,

while previewing the app, I am unable to get the images.

can you please me with setting the formula right.

Best Regards,
Yashmin Behera

SAP Build 

[Dan_Wroblewski]

See this blog by one of our esteemed community members 😉https://community.sap.com/t5/technology-blogs-by-sap/handling-images-in-sap-build-apps/ba-p/13558666

For base64, at least in he image component, you can set the source to the base64 string, but you must add the prefix: 

"data:image/png;base64," + SUBSTRING(data.Employees1.Photo, 104)​

I am assuming his is the issue, but if it is something else, let me know.

[YashminBehera]

Hi @Dan_Wroblewski 

I changed my formula and added the prefix to it,

But I still get the same issue, unable to get the images while previewing it.

Regards,
Yashmin Behera

[Dan_Wroblewski]

The freaking editor changed what it displayed for my post. This is the prefix, assuming png format (see my original post):

Also, just test with a static base64 value -- you can search Google for "cat" and all the preview pics will be base64. Just so we can narrow down if its something in the data being returned or in the formatting in the UI.

[YashminBehera]

Hi @Dan_Wroblewski 
I tried with correcting the formula and its jpeg for me I guess,

still not getting the images.

[YashminBehera]

And @Dan_Wroblewski about testing with a static base64 value like of a cat, 

Is this what you meant?
If yes I tried this too but still no display of images while previewing.

[Dan_Wroblewski]

If you right-click a preview image, you will get base64 value for the image by clicking Copy Image.

If you open the image in a new tab, you will see the base64.

And if you paste that into an image component in Build Apps, the image is displayed.

So I'm asking, as always, to try to narrow down the issue and figure out where the problem is occurring.