Purpose
You want to combine different UI technologies and display e.g. Fiori Apps on the SAP GUI for Windows.

Solution
With the Controls component of GuiXT you can embed any browser-based application in any SAP screen (even several simultaneously). In addition, communication is possible, e.g. clicking on elements,entering data in input fields, or extracting data for further processing in the relevant transaction.

Example
As an example we would like to build a dashboard in which several Fiori Apps (including the Fiori launchpad itself) are embedded in an SAP screen. In addition, an automatic login is to be performed.

(Click for fullscreen)

Hint: There are already a lot of Fiori Apps available. Nevertheless, the majority of SAP transactions can still only be used with a SAP GUI. As an example, we additionally embed the transaction "Change Sales Document (VA02)", which however runs in the SAP GUI for HTML and is not a real Fiori App.

How to implement
Fiori apps are started via a URL. This URL can be given additional parameters, which might for example open a certain view and can also predefine filters. Due to the technology only one login is necessary or possible, so that several apps can be opened at the same time. The following GuiXT script inserts a push button, so that the user can open the dashboard. A JavaScript routine is then called to perform the login.

Hint: Open the Fiori app as usual in your browser and set the desired view (data selection, filter, sorting, etc.) Afterwards you can simply copy and paste the URL shown in the address line into the GuiXT script to jump directly to this view.

 

 

GuiXT Main Script

///////////////////////////////

// Fiori Dashboard with GuiXT

///////////////////////////////

 

if not V[fiori_dashboard]

  pushbutton (toolbar) "@LZ\QFiori Dashboard@Fiori Dashboard" _

    process="fiori_dashboard.txt"

endif

 

if V[fiori_dashboard]

 

  pos   X[IMAGE_CONTAINER] X[IMAGE_CONTAINER]+(25,199)          _

  width=121 height=22

 

  pushbutton (toolbar) "@BF\QFiori Login@Fiori Login" process="fiori_login.txt"

 

  // Embed Fiori Launchpad

  Set V[fioriurl_launchpad] "https://vhcals4hci.dummy.nodomain:44301/sap/bc/ui5_ui5"

  Set V[fioriurl_launchpad] "&V[fioriurl_launchpad]/ui2/ushell/shells/abap/FioriLaunchpad.html"

  Set V[fioriurl_launchpad] "&V[fioriurl_launchpad]?sap-client=100&sap-language=EN"

 

  Wbview   (-0.2,1.2)     (25,86.9)  "&V[fioriurl_launchpad]" -closeOnHide _

      name="fiori1"

 

  if V[login]

   

    // Embed "Sales Order Demand Fulfillment" (Fiori App)

    Set V[fioriurl_par] "&V[fioriurl_launchpad]#SalesOrder-SSB_Demand_Flmt"

    Set V[fioriurl_par] "&V[fioriurl_par]?EvaluationId=.E.1478698426538"

    Set V[fioriurl_par] "&V[fioriurl_par]&/sap-iapp-state=ASLRHNT43YHYRBTEC9A6U8DITV2I7SDU7KHNHI84"

   

    Webview     (-0.2,88.3)   (24.4,171.2)  "&V[fioriurl_par]" _

      name="fiori2" 

   

    // Embed  "Sales Order Fullfillment" filtered by "Potential Issue" (Fiori app)

    Set V[fioriurl_par] "&V[fioriurl_launchpad]#SalesOrderFulfillmentIssue-SSB_Analyze"

    Set V[fioriurl_par] "&V[fioriurl_par]?EvaluationId=.ECC.SOFM.SALESORDERFULFILLMENTISSUES.EV"

    Set V[fioriurl_par] "&V[fioriurl_par]&/sap-iapp-state=ASP0QAB7HN11TQDDZ94QYRXJ13IDFOPE6SQTTD88"

   

    Control     (25.4,1.2)     (47,85.5)  "&V[fioriurl_par]" _

      name="fiori3" 

   

    // Embed "Sales Order Fulfillment Issues" (Fiori App)

    Set V[fioriurl_par] "&V[fioriurl_launchpad]#SalesOrderFulfillmentIssue-analyzeKPIDetails"

    Set V[fioriurl_par] "&V[fioriurl_par]?EvaluationId=.ECC.SOFM.SALESORDERFULFILLMENTISSUES.EV"

    Set V[fioriurl_par] "&V[fioriurl_par]?&sap-xapp-state=AS9ZENNFWPPK8TXKKA24UU599BDKW2W5YKR6N2PW"

   

    Webview     (-0.2,173.6) (24.4,321.2)  "&V[fioriurl_par]" _

      name="fiori4" 

   

    // Embed SAP GUI for HTML Screen (not Fiori!)

    Set V[fioriurl_par] "&V[fioriurl_launchpad]#SalesDocument-change?sap-ui-tech-hint=GUI"

   

    Webview   (25.5,87.9)   (47.6,195.5) "&V[fioriurl_par]" _

      name="fiori5 

  endif

 

endif

Script "fiori_dashboard.txt"

Set
V[fiori_dashboard] "X" 

Single Sign On (SSO)
The easiest way to avoid an additional login is to call an SAP function that returns a so-called assertion ticket which is valid for 2 minutes.

After such a ticket has been successfully requested via RFC, it can be set as a cookie using a JavaScript function. This function can be passed directly to the WebView control via GuiXT and executed.

The Fiori Launchpad then uses this ticket for the automatic login.

// Load any page from this domain, invisible mode

webView   (13,-1.5)   (47.2,167.3)   "https://www.mycismobile.com:44301" _
  name="fiori"   -invisible  initFlag="fiori_init"
 
// If not yet done, request a new ticket
if V[fiori_init]
  Call "CREATE_RFC_REENTRANCE_TICKET" -currentUser import.ticket="ticket" 
  
  // Create  JavaScript code and run it to save the cookie with the ticket
  set text[myjavascript] "document.cookie ='MYSAPSSO2=&V[ticket]; path=/';"
  connecthtml name="fiori" run="myjavascript"
 
  // Load the fiori lanchpad now and let it log in automatically via SSO
  connecthtml name="fiori" setUrl="https://www.mycismobile.com:44300/sap/bc/ui5_ui5/ui2/ushell/shells/abap/FioriLaunchpad.html#Shell-home"  
  connecthtml name="fiori" visible="on"  
  
endif
Video

Components
InputAssistant + Controls