Mobilizing On-Premise Fiori Applications with SAP CP Mobile Service Cloud Build Feature

[former_member188454]

Updated 26/09/2018 - The Cloud Build feature has been added to SAP CP Mobile Service for Development & Operations since Oct 2017 and we have many customers inquiring how they can build a custom hybrid mobile application for their existing Fiori applications deployed on premise and not exposed to the Internet.

In this blog, I am going to share how Cloud Build feature can be used to Build Custom Fiori Clients for your Fiori Launchpad or individual SAP Fiori business apps, and enable them to use the SAP Mobile Platform SDK. Thus, these apps can be programmed and configured to interact with native device features, push notifications and other Mobile Services features.

Prerequisites

1. SAP Cloud Platform Trial Account


2. On-premise landscape hosting Fiori Launchpad


3. SAP Cloud Connector (download here)


4. Fiori Destination under Mobile Service


5. Signing Profiles for Android & iOS

Steps to create Mobile App using Cloud Build Feature:

1. Make sure you have the Fiori Launchpad hosted on an internal system with Front End Server supporting Basic Authentication.


2. Configure SAP Cloud Connector for connecting your on-premise system with SAP CP trial account.


3. Create the Fiori destination URL in Mobile Service Destinations, or identify a custom URL.


4. In Mobile Service for Development and Operations cockpit, select Mobile Applications ->Native/Hybrid.


5. Select an application, then select Cloud Build under Assigned Features.


6. On the Configuration tab, configure packaging details.


7. Select the Build History tab to view the build history for each application binary, initiate a build.


8. Once the Build is completed, install directly on the mobile device by scanning the QR Code or download the package file.

Below is an overview of the scenario which I will explain in detail.

Front End Server(FES) accessibility check.

Open the Fiori Launchpad URL to confirm the SAP Client ID and credentials. In my case the URL looks like this: https://xxxxxx.xxxx.sap.corp:44333/sap/bc/ui5_ui5/ui2/ushell/shells/abap/FioriLaunchpad.html?sap-cli...

 

SAP Cloud Connector Configuration

• Login into the SAP Cloud Connector.


• Click on “+ Add Subaccount” button.

 

• Enter the required information as shown below with your own SAP CP trial account details.

           Region Host: hanatrial.ondemand.com
           Subaccount Name: <pxxxxxxtrial> <your p-number with trailing trial as mentioned in your                 SAP CP trial account>
           Display Name: Any display name you want.
           Subaccount User: <Pxxxxxxx> <your p-number without trial, with CAPITAL P>
           Password: <xxxxx> <your trial account password>
           Location ID: <keep it blank>

• Once you have saved the subaccount details, make sure it shown connected in the Cloud Connector cockpit.


• Now click on newly created subaccount and make sure the status is “connected” under Tunnel Information.

 

• Under your subaccount name, click on ”Cloud to On-Premise” and click on “+” under Access Control tab to add new system mapping.

 

• Enter the required information as shown below with your own internal landscape details as shown below for my internal FES.

 

        Back-end Type: Other SAP System/SAP Gateway
        Protocol: HTTPS/HTTP
        Virtual Host: <host name you want>
        Virtual Port: < port you want>
        Internal Host: <your internal host name of Fiori Front End Server as mentioned in the Fiori                Launchpad URL>
        Internal Port: <your internal port number>
        Principal Type: X.509 Certificate/None

 

• Once you have saved the system mapping, make sure it reachable as shown below. Or you can click on small window icon under Actions to check the availability of internal host.

 

• Now click on “+” below to add Resources Accessible on this system

 

• Enter “/” for URL and Select “Path and all sub-paths” for Access Policy.

 

• To ensures we have successfully configured our cloud connector with SAP CP trial account, login into your SAP CP trial account and select Connectivity -> Cloud Connector

 

Configure Fiori Destination in Mobile Service Destinations

• Goto SAP CP Cockpit -> Services-> Development & Operations (Under Mobile Services)


• On Mobile Service for Development and Operations cockpit, goto Destinations.

 

• Click on “New” button to create a new destination.

 

• Select Type = “Fiori Destination” and Destination Name = “<any name you want>”

 

• Click Next and enter details.         

URL = http://<your virtual host name>:<your virtual port number>
Fiori Destination Type = Front End Server
Location ID = <Blank>
SAP Client ID = <FES sap client id as mentioned in the Fiori Launchpad URL>
SSO Mechanism = Basic Authentication
SCIM Path = /sap/bc/ping

 

• Click on Finish and once the destination is created it will look like this.

Configuring Security Setting Under Mobile Service

Goto Mobile Service Cockpit -> Settings -> Security.

Make sure you have selected Mobile Service SCIM and Save.



 

Generating signing profile for Android.

• On Mobile Service for Development and Operations cockpit, select Settings -> Signing Profiles

 

• Click on “Generate”

 

• Enter the required details and click Ok.

 

• We are going to use this Signing Profile when we are build a new Android application.

 

Mobile Application Creation

• On Mobile Service for Development and Operations cockpit, select Mobile Applications -> Native/Hybrid

 

• Click on New


• Enter required details for creating new application and Save.

 

• Once the application is created, select “Security” under Assigned Features.

 

 

• Select Security Configuration = Basic, Overwrite Global Configuration = ON and Destination Name = “<newly created destination>”

 

• Now select “Cloud Build” under Assigned Features

 

 

• Select the Fiori Destination you have created and select the different icon you want to use with your mobile app and Save.

 

• Click on “Build History” and click on “Build”.

 

• Select the Platforms and required signing profile to build the final app(s) and click “Ok”.

 

• Once the build is completed, you will be able to Install it directly via QR Code scanning or you download it and install it on the device.

 

That’s it for now. We have now successfully created a custom Fiori Mobile app connecting to on-premise Fiori Launchpad.

You can find more information about Configuring Cloud Build Service here.

In the next blog, I will show you how to add Push Notification feature into this application and test it end to end.