How to use SAP HCP, mobile service for SAP Fiori - part 3

This blog post is continuation of a 4-part series on How to use SAP HCP, mobile service for SAP Fiori.

Part 3: Configure Fiori Mobile and build Fiori app

In this third part, we'll configure Fiori Mobile and test our app on a live device.  You'll learn how to...

1. Subcribe your Fiori app in HCP
2. Create Android Signing Profile
3. Create your Avanced Configuration File
4. Use Fiori mobile build process (application wizard, application workflow, etc.)
5. Executing the app on the device

Pre-req:

1. Subscribe Fiori app in SAP HANA Cloud Platform - At the moment, packaged SAP Fiori apps can only be created if subscribed as an HTML5 application in HCP.

1. Open SAP HANA Cloud Platform Cockpit
2. Click Subscriptions + add New Subscription
   1. Provider Account - click drop-down and select your account (e.g. P12345trial)
   2. Application - select your application (e.g. productlisting)
   3. Subscription Name - append "sub" at end of pre-populated appname (e.g. productlistingsub); note that this subcription name is your cloudComponentId in Fiori Mobile Advanced Configuration File
3. Click Save

Step-by-step guide:

1. Open Fiori Mobile Admin Console

1. Open HCP Cockpit
2. Browse to Services > select Fiori Mobile
3. Click Go to Admin Console

2. Add Android Signing Profile

NOTE: If you using Apple Signing Profile, you will need to have an iOS Developer Account and must upload your Signing Certificate, private key pass-phrase, and provisioning profile.

1. Open Account tab > Signing Profile
2. Add New Profile (or use existing profile if you have one)
   1. You can create a signing profile if you have JAVA installed on your computer.  You can either use Windows Command or Android Studio (if installed) to generate the keystore file.  In the example below, I'll use Windows Command:
      1. Open Windows Command Prompt and type the next line (feel free to values of alias, keypass, keystore, storepass and personal info)
      2. keytool -genkeypair -alias myappalias123 -keypass myappkey123 -keystore productlisting.keystore -storepass myapppass123 -dname "CN=Bill Joy, OU=IT O=ACME, L=Palo Alto, S=CA, C=US" -sigalg MD5withRSA -keyalg RSA -keysize 2048 -validity 99
3. Select Android
4. Click OK

3. Fiori mobile

1. Select Fiori Cloud Edition and click Ping (typically status will let you know if server is available)

4. On Ping Result window, click OK

5. Add Fiori Mobile Application

1. Click Applications tab
2. Manage Apps
3. New Application
4. Select Application Type - Fiori Mobile

6. Click Get Started to start the App Wizard

7. Select your Fiori app scenario > select (default) - local launchpad (click Next)

• Scenario 1 - "I want to create..." All HTML/JavaScript resources are packaged into binary and are located on device when installed; an app re-build is required when making changes to the app and notification is triggered on Admin Console
• Scenario 2 - "I want to mobilize..." This is an optimized Fiori Client build with all HTML/JavaScript are accessed via cloud; re-build of app is not required for this scenario

8. Select your Fiori Server (click Next)

9. Upload an Advanced Configuration File (ACF) - The advanced configuration file is a .json file that describes an array of components (using properties) that should be packaged with the app. Your ability to create an advanced configuration file is dependent on selecting "I want to create a local launchpad with only the apps I want to mobilize" on the Fiori App Scenario page.

1. Browse to upload ACF (please note that fields in ACF are case sensitive)
   1. Here's what your sample ACF file code should look like
      1. id = your app id (it's located in webide > app_project folder > webapp > manifest.json
      2. cloudComponentId = app subscription in HCP
      3. url = the location under which the application is registered in Fiori Launchpad. By default when deploying the app via SAP WebIDE it is /sap/fiori/[heliumhtml5appname] ... it is NOT the subscription name but the name of the app that you subscribe to.
         

{     "applications":[          {               "id":"com.sap.fiori.products",               "cloudComponentId":"productlistingsub",               "url": "/sap/fiori/productlisting"          }     ]
}

1. Click View and validate your configuration file (if file is malformed, you'll see an error)
2. Click Next

10. Finish your application - Here, you can build your application or further configure application.  In this example, uncheck the option and click Finish.

Application Workflow - After running through the App Creation Wizard, you can modify app information to control your app's usability and appearance on SAP Mobile Place.

11. Details - no change; here you can modify the app selection, add app description, and provide more app context.  In addition, if you need to re-upload your ACF, you can start your workflow again by click "Select Fiori Appliations"

12. Insight - Once application is deployed and consumed, Administrator can monitor application inisight such as usage charts, registration information, and user logs

13. Groups - If using SAP Mobile Place, Administrator can assign application to an individual group or multiple group(s)

14. Multimedia - For a better user experience, upload an app icon, a splash screen, and optionally a banner image (if using SAP Mobile Place)

15. App Settings - no change; Use the SAP Fiori mobile service app settings to define, deploy, and monitor your app

1. Application Security - When setting app security, consider the sensitivity of the data in the app. If the data is highly sensitive, requiring a complex password is recommended.
2. Feature management - Control which device features (for example: Calendar, Camera, Barcode Scanner) can be used by the application running on the device
3. Notifications - Send notifications to iOS and Android devices by using the Notification URL and Application ID under Notification Information
4. Logging - Admin can capture log information for review; collect performance metrics and identify performance issues as they occur

16. Categories - no change; Use the Categories tab to sort apps so they appear in logical groupings within SAP Mobile Place

17. Owners - no change; Use the Owner info tab to view the apps you created and therefore own, and to select co-owners for the app.

18. Platforms - Use the Platforms tab to build your app; if you made changes to any of the above settings, please click Save before continuing

1. Click Action and select Build

19. Build Summary

NOTE: "debug-enabled" mode is only supported in trial and can only be tested a physical device.

1. Turn off iOS
2. For Android - Select your Signing Profile from drop-down
3. Click Build
   

19. Your New Signed app is available for consumption; no actions are required

20. As a developer, we've made it easy to test your app.  Simply login to SAP Mobile Place and go to Menu > My Profile > Fiori Mobile Apps

NOTE: Your SAP Mobile Place URL is available via HCP Cockpit > Services > Fiori Mobile > "Go to Mobile Place" or try https://<trial-p#trial>.sapmobileplace.com/ (only replace p# which is your trial id)

21. Click download button to immediately download app to your device (and start install process); else, you can view details of your app by clicking app icon (and download and install app from that page)

22. Once the app is installed, you can run the app (first time authentication will be required)

This concludes part 3 of this blog... Check back for part 4 soon.