How to integrate SAP Fiori apps into your Mobile Portal

Hi,

lately, I have been working on our Mobile Portal demo to enhance it with the latest cool features, namely with the integration of Fiori apps, the configuration of the Personalized Launcher, some native apps and the mobile UWL to launch from the Mobile Portal.

Today I would like to share a step-by-step description how to integrate Fiori wave 1 apps in your Mobile Portal. My first app was the Create Leave Request app, so I will take this as an example in this blog.

1. Portal – Gateway integration
I was lucky to work in the SAP Demo Cloud where the Gateway system was already defined in the portal system landscape and trust was established, so no more work for me to do here. I just made sure that my demo user existed in the Gateway and the backend system.

2. Adding Fiori applications to the Launcher
Since my Mobile Portal was already configured, this was quite straightforward. In Portal Content Administration I opened my mobile role and the selected the Launcher folder to which I planned to add the new Fiori app. Then I opened the folder Portal Applications > com.sap.portal.appintegrator.sap and right-clicked the application called UI5 and selected Add Application to Role to add it to the launcher folder of my mobile role.

Now I just had to edit the following properties of the new application in my mobile role: I gave it a name (Create Leave Request), set the height type to Full Page, entered the system alias of the Gateway system as System, choose an Icon URI from the Web Repository, and entered the Relative Path for UI5 applications.

This was the most tricky part of it, as it can be quite difficult to find the information in the documentation. I found a very useful list of Fiori wave 1 apps at http://help.sap.com/fiori_bs2013/helpdata/en/99/e464520e2a725fe10000000a441470/content.htm?frameset=/en/66/d05c5219ef725fe10000000a441470/frameset.htm, where I got detailed information about each application, but where I finally got the right names and pathes of the UI5 application was transaction SICF in the Gateway system. There I searched for service name ui5* and under path sap/bc/ui5_ui5/sap I found a long list also containing the leave request with service name ui5_hcm_lr_cr.  So I added the complete path at property Relative Path for UI5 applications, which is sap/bc/ui5_ui5/sap/<service name-of-your-ui5-application>/index.html.

Of course, you need to make sure that the corresponding services are activated in your Gateway system and that the user has the necessary roles and permissions in the Gateway and backend systems, but in many cases at least the backend will be already configured.

And that’s it! Easy!

Hope that was helpful. In my next blog, I will describe how I configured the Personalized Launcher, so stay tuned!
Regards,
Sibylle