Launch Fiori App on Browser using ABAP Code (2023)

ABAP developers can launch Fiori apps from ABAP code and display Fiori application on web browser.In this tutorial, I want to show how to build the URL for the Fiori application for a desired Fiori app with a few simple cases.

For example, assume that you want to launch "My Inbox" app on default web browser using ABAP program code.

Launch Fiori App on Browser using ABAP Code (1)

(Video) How to Open Fiori Launch Pad through SAP GUI | Fiori Settings | Access Fiori Launch Pad

First of all, you can open the app on LaunchPad and check for URL parameters.
ABAP developers will realize a pattern as follows:
#WorkflowTask-displayInbox
This pattern is formed of "#{Semantic Object}-{Semantic Action}"

If you browse the Fiori Apps Library for "My Inbox" app you can validate the Semantic Object and Semantic Action configuration parameter values.

On Fiori Apps Library page of "My Inbox", switch to tab "Implementation Information"
Scroll down and display hidden details for Configuration
By scrolling down, you will reach a section names "Target Mapping(s)"
In this target mappings table, you will see the Semantic Object andSemantic Action values for the target Fiori app.

Launch Fiori App on Browser using ABAP Code (2)

(Video) Part 19 Automation of SAP FIORI apps | Calling Framework from ABAP | Integrate Auto test using ABAP

As I mentioned before, it is possible to get these parameter values by launching the Fiori app on Launch Pad and checking the URL address easily.

Following ABAP code can be used in an ABAP program which concatenates different parameters to form final Fiori app URL. And then ABAP cl_gui_frontend_services class execute method can launch the target URL on default web browser.

DATA:
lv_url TYPE string,
lv_server TYPE string VALUE 'flp.server.com',
lv_client TYPE string,
lv_fiori_object TYPE string,
lv_fiori_action TYPE string.
lv_client = sy-mandt.

SELECTION-SCREEN BEGIN OF BLOCK frame1 WITH FRAME TITLE TEXT-001.

(Video) Deploy SAP Fiori applications using Visual Studio Code

SELECTION-SCREEN BEGIN OF LINE.
SELECTION-SCREEN COMMENT 1(20) TEXT-002. " Semantic Object
SELECTION-SCREEN POSITION 33.
PARAMETERS: p_semobj TYPE char80 LOWER CASE DEFAULT 'WorkflowTask'.
SELECTION-SCREEN END OF LINE.

SELECTION-SCREEN BEGIN OF LINE
.SELECTION-SCREEN COMMENT 1(20) TEXT-003. " Semantic Action
SELECTION-SCREEN POSITION 33.
PARAMETERS: p_semact TYPE char80 LOWER CASE DEFAULT 'displayInbox'.
SELECTION-SCREEN END OF LINE.

SELECTION-SCREEN END OF BLOCK frame1.

START-OF-SELECTION.

(Video) How to enable Transaction Code(ok code) in SAP Fiori

lv_fiori_object = p_semobj.
lv_fiori_action = p_semact.
lv_url = |https://{ lv_server }/sap/bc/ui5_ui5/ui2/ushell/shells/abap/FioriLaunchpad.html?sap-client={ lv_client }&sap-language=EN#{ lv_fiori_object }-{ lv_fiori_action }|.
WRITE lv_url.

CALL METHOD cl_gui_frontend_services=>execute
EXPORTING
document = lv_url
EXCEPTIONS
OTHERS = 1.
IF sy-subrc <> 0.
WRITE :/ 'FAIL'.
ENDIF.

Please note that the semantic parameters are case sensitive, so it is important to use them correctly right as they are defined. Because of that I used "LOWER CASE" option for parameters in Selection Screen.

ABAP programmers can try "SalesQuotation" and "manage", or "ATPRequirement" and "releaseForDelivery" as sample semantic objects and actions for different Fiori apps.

(Video) SAP Fiori Troubleshooting and Debugging with Chrome browser

If the URL configuration and semantic object and action parameter values are not correctly defined, the ABAP programmer will definitely get an error message similar to following one:

Message: App could not be opened either due to an incorrect SAP Fiori launchpad configuration or a missing role assignment.
Details: {
"info": "Failed to resolve navigation target \"#ATPREQUIREMENT-RELEASEFORDELIVERY\". This is most likely caused by an incorrect SAP Fiori launchpad content configuration or by a missing role assignment.",
"fixedShellHash": "#ATPREQUIREMENT-RELEASEFORDELIVERY",
"technicalMessage": "Could not resolve navigation target"
}

FAQs

Can Fiori be launched through URL? ›

It is possible to launch or activate a Fiori launchpad connection using an SAP BC startup URL, as it is feasible for SAP BC connections.

How do I launch Fiori apps from SAP GUI? ›

In this section you can find the default URLs for launching the SAP Fiori launchpad. After you set up the launchpad, you can launch it by entering any of the following URLs: https:// <server> : <port> /sap/bc/ui2/flp/ https:// <server> : <port> /sap/bc/ui2/flp/index.

How do I deploy Fiori app using Visual Studio code? ›

  1. Create SAP Fiori application. Open Visual Studio Code and select View > Command Palette. ...
  2. Start SAP Fiori application. ...
  3. Deploy SAP Fiori application. ...
  4. Check BSP library and SAP Fiori Launchpad app descriptor item in Eclipse. ...
  5. Create IAM App and business catalog. ...
  6. Run SAP Fiori application. ...
  7. Test yourself.
29 Dec 2020

How do I call Fiori from GUI? ›

If you're in your normal SAP GUI screen, you can navigate directly to your Fiori launchpad (if you have it activated) in SAP S/4HANA by using transaction n/ui2/flp – note that the “/n” at the start of the transaction is essential.

How do I get a Fiori app URL? ›

Fiori Fun at work!
...
Follow the below steps for Tile Creation which would be pointing to URL.
  1. Click on + sign on right screen to add Tile. ...
  2. Select + of “App Launcher – Static” tile type to proceed. ...
  3. Fill the required details and url in given fields as per below screen and choose save.
  4. That's it tile is created.
28 Feb 2019

How do I launch Fiori? ›

Go to the User tab, enter the user details that you want to use, to access the Launchpad and save. To Add the Catalog to a group in Launchpad, login to Launchpad and select the Tile Catalog. Select the catalog you have created and click on '+' sign to add to a group.

How do I activate SAP Fiori app? ›

Press F8. Navigate to default_host -> sap -> bc -> ui5_ui5 -> sap. In this node, navigate to the SAPUI5 application for your app. To activate the service (SAPUI5 application), choose Service/Host -> Activate.

How do I run a SAP GUI script? ›

Enable scripting in SAP GUI

Click Customize Local Layout, and then click Options. Click Accessibility & Scripting, and then click Scripting. Check the Enable scripting box. Click OK.

How do you deploy and run SAPUI5 application on ABAP server? ›

Open Eclipse → Click File and select new option → Select Project. In New Project window choose SAPUI5 Application Development and click on Application Project →and Click on Next. Enter your Project name and Click on Next. Select the Development Paradigm as JavaScript or XML or JSON or HTML click on Finish.

How to run SAPUI5 application in Visual Studio Code? ›

The following steps include everything to quick-start UI5 development:
  1. Step 1 – Prerequisites: Node. js, SAPUI5 CLI, and Git.
  2. Step 2 – Main mission: VS Code, UI5 Extensions, and Code Completion.
  3. Step 3 – Touch-ups: UI5 Generator options and DevTools Browser Extension.
15 Oct 2021

How do I run SAPUI5 application locally? ›

Setup
  1. If your project does not have a package.json file, let npm generate it: npm init --yes.
  2. Generate the ui5.yaml file: ui5 init.
  3. Define the framework you want to use. OpenUI5 SAPUI5. ...
  4. Add required libraries. ...
  5. Start the server and work on your project! ...
  6. If you are using Git or similar version control, commit package.

How do I enable debugging in browser? ›

Chrome Browser debug logs
  1. Quit any running instance of Chrome.
  2. Right-click your Chrome shortcut.
  3. Select Properties.
  4. At the end of the Target: line, add the command line flags: --enable-logging --v=1. ...
  5. Click Apply. ...
  6. Launch Chrome using your shortcut.

What is Query browser in Fiori? ›

The Query Browser is a Fiori application using which you can quickly and easily search, browse, and tag the analytical queries. This application displays all the analytical queries to which the user has access. You need to assign the Query Browser role to a user.

How do I log into Fiori from SAP GUI? ›

Open the app and you will see a start screen with a (longer) explanation text and a Login button. Click on the Login button. Next you will see a screen that let's you enter an url: Here enter the url to your Fiori Launchpad (or paste it) and click OK.

What is Fiori launchpad URL? ›

The standard URL for accessing the launchpad is as follows: https://<server>:<port>/sap/bc/ui2/flp/FioriLaunchpad.html.

What is the Tcode for SAP Fiori? ›

/UI2/FLPCM_CUST and /UI2/FLPCM_CONF

SAP has introduced SAP Fiori Launchpad content manager tcodes starting SAP S/4HANA 1809 SPS03 onwards. These GUI based applications are for mass-administration of catalogs and convenient to use.

Why SAP Fiori is called Fiori? ›

SAP Fiori provides 300+ role-based applications like HR, Manufacturing, finance, etc. When you open the SAP Fiori home page application, you will see a picture of the flowers. It is because Fiori means 'flowers' in Italian. SAP Fiori provides all business roles in real time on compatible hand devices.

How do I create a Fiori app for Tcode? ›

4. Steps
  1. 4.1 Maintain custom transaction code. ...
  2. 4.2 Create Semantic Object. ...
  3. 4.3 Create Catalog. ...
  4. 4.4 Create Target Mappings. ...
  5. 4.5 Add Tile. ...
  6. 4.6 Create Group and assign Tile to Group. ...
  7. 4.7 Create Role and Add Authorizations. ...
  8. 4.8 Access the Custom Program from Fiori.
27 Jan 2021

Does SAP Fiori require coding? ›

Application developers can use SAP Fiori elements to create SAP Fiori apps based on the OData service and annotations that do not need JavaScript UI coding. This means that no application-specific view instances are required.

How can you start the SAP Fiori elements preview? ›

Start a Preview from Context Menu

This section provides instructions on previewing an application from a context menu in VS Code and SAP Business Application Studio. Alternatively to the execution of the start scripts on the command line, right-click the project folder or any subfolder and select Preview Application.

What is Fiori rapid activation? ›

The activation of SAP Fiori is simplified and accelerated by using business roles, that is, by activating the entire SAP Fiori launchpad content related to a business role together. The following task lists are provided to activate the content. These task lists must be executed in the prescribed order.

How do I enable SAP GUI scripting API? ›

Alternatively, you can enable the SAP scripting in the SAP GUI application.
  1. Start the SAP Logon and log in to the SAP server.
  2. Click Customize Local Layout > Options.
  3. In the Options window, select the Scripting tab.
  4. Select the Enable scripting check box.

What is SAP GUI scripting API? ›

SAP GUI Scripting is an automation interface that enhances the capabilities of SAP GUI for Windows and Java. Using this interface, end users may automate repetitive tasks by recording and running macro-like scripts.

How do I make SAP GUI my default browser? ›

Start the SAP GUI for Windows and then click the hamburger menu top left > Options. Then select Interaction Design > Control Settings and choose your default browser as shown below. The next time you start a transaction in SAP, it will automatically use the selected browser.

How do I run a program in SAP ABAP? ›

Procedure
  1. On the initial screen of the ABAP Editor, enter the name of the program that you want to run.
  2. Choose Execute with Variant. A dialog box appears, in which you can enter a variant.
  3. Choose the F4 key. ...
  4. Select a variant.
  5. Confirm your selection by choosing Select or ENTER. ...
  6. Choose Execute to run the program.

Which browser can support SAP UI5? ›

2) SAPUI5 detects Microsoft Edge (Chromium) as Google Chrome and treats it the same.

When a user launches an SAP Fiori app ABAP frontend server authenticates the user by which of the below authentication mechanism? ›

Initial Authentication

When a user launches an SAP Fiori app, the launch request is sent from the client to the ABAP front-end server by the SAP Fiori launchpad. During launch, the ABAP front-end server authenticates the user by using one of the supported authentication and single sign-on (SSO) mechanisms.

How to connect SAP system to Visual Studio Code? ›

Click on 'Edit in settings. json'.
  1. This will create a profile for your system with which you can connect to, in VS Code. ...
  2. Please note that in the above code, you need to add your username, password, client and system label of the SAP system which you are connecting with VS Code.
21 Jul 2022

How do I run an app in Visual Studio? ›

In the simplest case, to build and run an open project in Visual Studio: Press F5, choose Debug > Start with debugging from the Visual Studio menu, or select the green Start arrow and project name on the Visual Studio toolbar.

Is Fiori same as UI5? ›

SAP UI5 is a technology for developing responsive web applications. SAP UI5 is, in other words, the coding language for SAP Fiori. As a result, we can't create an SAP Fiori app without the SAP UI5 framework.

How to create a SAPUI5 application in web ide? ›

Let's go step by step.
  1. Step 1 − To start a new project, go to File → New → Project.
  2. Step 2 − Enter the name of the project. ...
  3. Step 3 − Select template SAPUI5 Mobile Applications → Next.
  4. Step 4 − The next step is to select the data connection. ...
  5. Step 5 − In the next step, you have to perform template customization.

How do I run a local host app? ›

Open a browser and type http://localhost:5000 in the address bar. If your app has REST endpoints you can call them at this URL. Your app is displayed in the browser window, and the application output is sent to the command line or to your terminal.

How do I run an application locally? ›

Running your application locally

Browse to the directory containing your project. Select Tools > Cloud Code > App Engine Run on a local App Engine Standard dev server.

How do I access SAP Fiori? ›

End users can access the SAP Fiori launchpad on Portal through the following: SAP Fiori Client. A mobile application, which provides enhanced capabilities for end users accessing SAP Fiori applications on the home page from mobile devices. SAP NetWeaver Business Client for Desktop (NWBC).

Which are the 3 deployment options of SAP Fiori? ›

TECHNICAL DEPLOYMENT OPTIONS OVERVIEW

The SAP Fiori launchpad, the SAP-delivered or custom-build Fiori UIs and the launchpad content can be deployed on the same server (embedded deployment), or on a separate server (hub deployment).

What are the 2 types of Fiori apps from the following? ›

SAP Fiori App Types and Database Requirements
  • Transactional apps.
  • Fact sheets.
  • Analytical apps.

How is Fiori connected to SAP? ›

The SAP Fiori apps send requests to several systems, depending on the application type and the connected system landscape. SAP Fiori apps are processed as follows: First, the client loads the UIs for the SAP Fiori apps. Second, while running, the app consumes data from the SAP Business Suite back-end systems.

Is SAP Fiori frontend or backend? ›

SAP Fiori front-end server is deployed into the AS ABAP of a back-end system. A dedicated AS ABAP front-end server with SAP Fiori front-end server is deployed in a standalone system in front of the back-end system, either behind or in front of the firewall.

Is Fiori and s4 Hana same? ›

In a nutshell: SAP Fiori is how the new business value of SAP S/4HANA is delivered to business users. You need SAP Fiori to configure, adapt, and extend SAP S/4HANA.

What is the difference between GUI and Fiori? ›

SAP GUI and SAP Fiori each perform similar functions. SAP GUI is accessible through the SAP Menu, allowing you to develop GUI-based reports for various tabular data. SAP Fiori, on the other hand, makes things much more manageable with its more accessible interface.

What is Fiori in ABAP? ›

Fiori is a streamlined application, delivering a role-based user experience that can be personalized across all lines of business, tasks and devices. It uses tiles to encapsulate standard tasks like viewing sales orders or approving timesheets.

What is difference between Fiori and UI5? ›

The Difference between SAPUI5 and SAP Fiori

As a result, SAP Fiori aims to provide a consistent, simple, intuitive, and responsive user experience for all SAP applications. SAP UI5 is a technology for developing responsive web applications. SAP UI5 is, in other words, the coding language for SAP Fiori.

What language does Fiori use? ›

The SAP Fiori design language is used in SAP applications, including the S/4HANA and C/4HANA suites, SAP Analytics Cloud, SAP Data Hub, SAP Ariba and others. Applications that use the Fiori design language are often called Fiori applications or Fiori user interfaces (UIs).

Videos

1. How to Deploy SAPUI5 App to SAP Fiori Launchpad in 20 minutes?
(ZAP Yard)
2. SAP Fiori: How to Debug FIORI App and the Debugger will trigger at SAP Back End?
(arghadip kar)
3. SAP ABAP: SAP Fiori Query Browser the ABAP Query of SAP Fiori Love it.
(arghadip kar)
4. Debugging Fiori Apps using Chrome Tools | Debugging Fiori and UI5 | Java Script code Debug
(Anubhav Trainings (official channel))
5. Quick guide way to emulate SAP GUI transaction Codes in FIORI!
(Marssel Vilaça (Brasil))
6. 🟢 Troubleshoot RAP based Fiori Apps in the ABAP Development Tools
(SAP Developers)
Top Articles
Latest Posts
Article information

Author: Jerrold Considine

Last Updated: 11/30/2022

Views: 6470

Rating: 4.8 / 5 (58 voted)

Reviews: 81% of readers found this page helpful

Author information

Name: Jerrold Considine

Birthday: 1993-11-03

Address: Suite 447 3463 Marybelle Circles, New Marlin, AL 20765

Phone: +5816749283868

Job: Sales Executive

Hobby: Air sports, Sand art, Electronics, LARPing, Baseball, Book restoration, Puzzles

Introduction: My name is Jerrold Considine, I am a combative, cheerful, encouraging, happy, enthusiastic, funny, kind person who loves writing and wants to share my knowledge and understanding with you.