Preambel

Simplifier Apps are basically UI5 / Fiori Apps and fully compatible with UI5 Runtime installed on Fiori Gateway Servers.

The following Guideline covers the process for exporting the App from Simplifier and importing the source code to ABAP Repository.

Prerequisites

• HTTPS –  The SAP Fiori Gateway Server should deliver the Fiori Apps via Secure HTTP Connection to the Client. HTTP Only Connection won’t work in modern browsers.
• CORS Configuration: The Simplifier CORS Configuration should be extend with the Hostname of the SAP Fiori Gateways server to allow Ressource Sharing between Simplifier and SAP
• SAP Permissions: For Uploading the Simplifier App you need the following authorization objects assigned to your User:  S_DEVELOP, S_ICF_ADM, S_TCODE, S_TRANSPRT, S_CTS_ADMI and S_CTS_SADM
• ABAP Workbench Transport – Prepare a ABAP Workbench Request in case you would like to transport and notice the ID for later entry

Cross-Origin Resource Sharing (CORS) is an HTTP-header based mechanism that allows a server to indicate any other origins (domain, scheme, or port) than its own from which a browser should permit loading of resources. (More Information)

1 Prepare CORS Configuration

Simplifier itself doesn’t handle any CORS or Proxy Configuration – you have to add the SAP Hostname directly into your Proxy.

In our Example we use Traefik2 as HTTP(S) Proxy

1.1 Find out the SAP Hostname that used by your Clients

• Open your Fiori Launchpad in the Browser
• Display the Webpage URL in your Browser Windows

Notice the Public Hostname and Add this to the CORS Policy

Access-Control-Allow-Origin

The Access-Control-Allow-Origin response header indicates whether the response can be shared with your corresponding sap system.

In our Example we modify the Traefik Configuration add add the SAP Hostname at the beginning (the order doesn’t matter)

accessControlAllowOriginList = ["https://sapid405.simplifier.io", "https://yourSimplifierHost", "ionic://localhost"]

After restarting the Proxy to reload the new configuration, the security setup is finished.

2 – Export Simplifier App

To Export the Simplifier App Source Code you have to open the corresponding App and click on the App Properties:

In the Property Dialog choose the Icon Download App and the Target Platform “Self Hosted Web Application”

Press Download to export the current Source Code as ZIP File.

Extract the ZIP File in a new folder – in this Example it will be C:\TEMP\ui5

3 – Import Application into SAP Repository

To start the import, logon into SAP GUI and start the Report /UI5/UI5_REPOSITORY_LOAD with Transaction SA38

Click the Green Execute Button on the Left Upper Corner

Determine a SAP Application Name  – it normally begins with Z or Y Namespace and contains no spaces or special characters

Choose the subfolder www in which the ZIP File has been extracted before

The Source Files will be uploaded like you see in the protocol below. Click on the Detail Icon in the left upper corner to finish the process.

Fill out the description and assign a Package Name and ABAP Workbench Request ID if you want to transport it later.

4 – Test and run the Application

To start the Application, start SE80 and choose the Name of your uploaded UI5 BSP Application and click Test to open it in Browser

You will see the final App in the browser: