This guide will instruct you how to use
SAP Web IDE and deploy your existing on-premise transactional Fiori apps to
SAP HANA Cloud Platform. Note that only client-side artifacts will be deployed and the Fiori apps will still access the on-premise
SAP Gateway system to read and write business data.
Check the
Reference Library for a list of available SAP Fiori apps including their technical prerequisites for the backend release and Fiori backend components.
Disclaimer
Please note that SAP recommends to use SAP Fiori, cloud edition to run selected Fiori apps on SAP HANA Cloud Platform to enjoy seamless apps and libraries (SAPUI5) updates. When deploying on-premise Fiori apps to your cloud account, the apps (UI) will be treated by SAP as custom development.
Prerequisites
Follow the
Get Started documentation section. Entering Git settings is optional. However, make sure you follow the
Connecting Remote Systems steps as it’s required for
SAP HANA Cloud Platform to access your on-premise
SAP Gateway system.
Once completed, a destination configuration should be available on the SAP HANA Cloud Platform Cockpit, pointing to your
SAP Gateway system and is securely connected via
SAP HANA Cloud Connector. The Fiori app you deploy will use this destination to communicate with your on-premise
SAP Gateway system.
When adding your destination in
SAP HANA Cloud Platform Cockpit, it must contain the following values for the
WebIDEUsage properties:
- odata_abap
- ui5_execute_abap
- dev_abap
- bsp_execute_abap
There are additional configuration steps needed on the on-premise
SAP Gateway system to allow communication with Fiori apps on
SAP HANA Cloud Platform. A blog post with more information will be added soon.
Import to SAP Web IDE
In
SAP Web IDE click
File>Import>Application from SAPUI5 ABAP Repository.
Select the
System you would like to import from and enter your credentials if required.
If you followed the steps required to configure a destination on
SAP HANA Cloud Platform Cockpit (refer to the
Prerequisites section above), your on-premise system should be available on this dialog.
Select the
Application and click
OK.
A new project folder is created on your workspace with all required files and folders.
SAP Web IDE automatically adds a new
neo-app.json file. This file is required by
SAP HANA Cloud Platform to connect to your on-premise
SAP Gateway system and to get access to
SAPUI5 library.
More information about this file is available on the
documentation.
Test Preview in SAP Web IDE
In order to make sure the app is running on
SAP HANA Cloud Platform, select the
Component.js file in under the project folder in your workspace and click the
Run button on the toolbar. Enter your credentials if required. If it’s the second time you try to run the same app after doing some changes, clear the cache of the browser first (
Ctrl+F5 or
Shift+F5 keyboard shortcut in Chrome).
More information how to run projects is available on the
documentation.
If the app is running fine, you can now deploy it to
SAP HANA Cloud Platform. Skip the following steps and refer to
Deploy to SAP HANA Cloud Platform section below.
If the app isn’t running correctly, follow the steps in the next section.
Fix Broken Reuse Library References
Some apps use additional resources which are deployed as reuse libraries on
SAPUI5 ABAP Repository. When running the app, open your browser’s
Developer Tools>Network Tab. If you notice failed requests to
library.js or
library-preload.js with HTTP error code 404, this means you need to fix it.
In the example above, the reuse library reference
/resources/sap/hcm/lib/common is broken.
In order to fix it, you need to deploy this reuse library which is hosted on
SAPUI5 ABAP Repository to
SAP HANA Cloud Platform. This can be achieved using the same steps needed to deploy a Fiori app. So follow this document steps, but this time your goal is deploying the reuse library. Note you won’t be able to test or preview the reuse library project as it’s not a standalone app.
Once the reuse library is deployed, the app should now point to the new location of the library on
SAP HANA Cloud Platform. Open the
neo-app.json file and add the required reference under the
routes node. In the example below, the missing reusable library reference
/resources/sap/hcm/lib/common was added.
"routes":
[
{
"path": "/resources/sap/hcm/lib/common",
"target": {
"type": "application",
"name": "hcmlibcommon",
"entryPath": "/sap/hcm/lib/common",
"preferLocal": true
},
"description": "HCM Lib Reuse"
},
(Existing route nodes here)
]
Modify the following property values as required by your reuse library:
- path value should point to the relative URL the app is expecting to find the reuse library in. This is the URL found on your browser’s Developer Tools>Network Tab failed requests (see previous steps).
- name value should contain the name of the reuse library as defined by you when you deployed it to SAP HANA Cloud Platform from SAP Web IDE.
- entryPath value should point to the location of the library.js or library-preload.js file in the reuse library project.
- description value may contain a description of the reuse library.
Make sure you keep the JSON syntax valid (route nodes are separated by commas).
Deploy to SAP HANA Cloud Platform
Select the project folder in your workspace and click
Deploy>
Deploy to SAP HANA Cloud Platform on the menu.
Enter your credentials if required and click
Deploy. If everything goes well, a popup dialog will be displayed with a link to the app on
SAP HANA Cloud Platform.
More information how to deploy projects is available on the
documentation.
Extensions to Fiori Apps
Extensions you made to Fiori apps should be deployed to
SAP HANA Cloud Platform along with the original apps. The steps required for deployment are exactly the same as for the original apps.
When a newer version of the original app is available, you need to deploy it again to SAP HANA Cloud Platform. Your extensions will still work as they are deployed as an additional app on
SAP HANA Cloud Platform.