Introduction
Starting with just 25 applications in 2013, SAP Fiori (Fiori 1.0) has grown to have over 10,000 applications in just 5 years. In particular, the number of applications has increased dramatically since Fiori 2.0, which was adopted for the 2015 S / 4HANA 1511 (Enterprise Management). The application type SAPGUI (in other words, WebGUI transaction with Berize theme) is supporting rapid growth in Fiori application.
In Fiori UX, SAP Fiori Launchpad is an entry point for all business operations, and SAP Fiori Elements created by noncoding with CDS annotation leads to the next transactions by giving notice.
Since Fiori is Web-based, its UX will be further improved by further advancement of Web technology and improvement of network speed and quality through the spread of 5G network. However, in the transition period, there is definitely a customer need to use SAPGUI (for Windows).
For these requirements, I would like to introduce sample ABAP code using Business Server Pages (BSP), one of the classic Web technology in SAP.
Things I want to do
Click the SAPGUI Launcher tile on SAP Fiori Launchpad ...
SAPGUI starts without userid and password. You can configure a tile for Web GUI (SAPGUI for HTML) with standard procedures, but not SAPGUI.
Coding
Let's see concretely how to code it. In this example, I use the old-school Web technology called BSP (Business Server Pages). For those of you who do not know, BSP is ABAP version of JSP (Java Server Pages) and ASP (Active Server Pages), and is a scriptlet coded in ABAP. Please refer to the sample code that appears later.
Architecture and Interaction Sequence
The BSP application ZCCSAPGUI is the hero of this blog. The ZCCSAPGUI application consists of two pages, default.htm and createSapGuiShortcut.htm. Let's see concretely what each page is doing.
* Adoption of BSP is not essential. You can choose other web technologies.
* In this case, I judge the web browser by using client side JavaScript, but it is also possible to judge it on the server side (e.g. GET_USER_AGENT method of IF_HTTP_REQUEST interface).
Code Sample: default.htm
The body of HTML is very simple. It is like the template of SAPUI5. Everything is controlled by JavaScript runtime.
<%@page language="abap" %>
<!DOCTYPE HTML>
<html>
<head>
<title>SAPGUI Launcher</title>
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta charset="utf-8">
<script src="/sap/bc/ui5_ui5/ui2/ushell/resources/sap-ui-core.js"
id="sap-ui-bootstrap"
data-sap-ui-theme="sap_belize"
data-sap-ui-libs="sap.m">
</script>
<!-- 中略 -->
</head>
<body class="sapUiBody" id="content">
</body>
</html>Next, let's see what the main process JavaScript is doing. First of all, sap.ui.getCore().AttachInit() is called to define the SAPUI 5 component to construct the HTML body. Call launchSapgui() at the end of the process.
The main feature of launchSapgui() is the isSupported() for Web browser detection. In the sample code below, only Microsoft Internet Explorer 11 and Edge are allowed. For IE 11 or Edge, display the message "Please open SAPGUI shortcut within 5 seconds" and open createSapGuiShortcut.htm on the next page. Tab closes automatically after 5 seconds.
For other Web browsers, display the message "Please contact the system administrator" and close the tab.
var userAgent = window.navigator.userAgent.toLowerCase();
var appVersion = window.navigator.appVersion.toLowerCase();
var getBrowser = function() {
var browser = 'unknown';
if (userAgent.indexOf("msie") != -1) {
if (appVersion.indexOf("msie 6.") != -1) {
browser = 'ie6';
} else if (appVersion.indexOf("msie 7.") != -1) {
browser = 'ie7';
} else if (appVersion.indexOf("msie 8.") != -1) {
browser = 'ie8';
} else if (appVersion.indexOf("msie 9.") != -1) {
browser = 'ie9';
} else if (appVersion.indexOf("msie 10.") != -1) {
browser = 'ie10';
} else {
browser = 'ie';
}
}
if (userAgent.indexOf('trident/7') != -1) {
browser = 'ie11';
} else if (userAgent.indexOf('trident/8') != -1) {
browser = 'ie11';
} else if (userAgent.indexOf('edge') != -1) {
browser = 'edge';
} else if (userAgent.indexOf('chrome') != -1) {
browser = 'chrome';
} else if (userAgent.indexOf('safari') != -1) {
browser = 'safari';
} else if (userAgent.indexOf('opera') != -1) {
browser = 'opera';
} else if (userAgent.indexOf('firefox') != -1) {
browser = 'firefox';
}
console.log("User Agent: " + userAgent);
console.log("Appicaiton Version: " + appVersion);
console.log("Browser Name: " + browser);
return browser;
};
var isSupported = function(browsers) {
var browser = getBrowser();
for (var i = 0; i < browsers.length; i++) {
if(browsers[i] == browser) {
return true;
}
}
return false;
};
var launchSapgui = function() {
jQuery.sap.require("sap.m.MessageBox");
if (isSupported(['ie11', 'edge'])) {
sap.m.MessageBox.information("Please open the SAPGUI shortcut within 5 seconds.", {
title: "SAPGUI Launcher",
onClose: function(oAction) { window.close(); },
styleClass: "", // default
initialFocus: null, // default
textDirection: sap.ui.core.TextDirection.Inherit // default
});
window.setTimeout('window.close();', 5000);
location.href = "createSapGuiShortcut.htm?sap-client=100&sap-language=EN&transaction=<%= transaction %>";
} else {
sap.m.MessageBox.error("Your browser is not supported. Please contact your system administrator.", {
title: "SAPGUI Launcher",
onClose: function(oAction) { window.close(); },
styleClass: "", // default
initialFocus: null, // default
textDirection: sap.ui.core.TextDirection.Inherit // default
});
}
}
sap.ui.getCore().attachInit(function () {
var app = new sap.m.App("app", {
initialPage: "page"
});
var page = new sap.m.Page("page", {
title : "SAPGUI Launcher",
showNavButton : false
});
app.addPage(page);
app.placeAt("content");
launchSapgui();
});* The above is just sample code. Please apply latest browser detection logic.
Code Sample: createSapGuiShortcut.htm
If the web browser is IE11 or Edge, createSapGuiShortcut.htm will be called from default.html. The event handler is the hero in this page. The following ABAP code is a sample of the OnRequest event handler. The process flow is briefly summarized as follows.
- Generate MYSAPSSO2 (authentication token)
- Generate contents of SAPGUI shortcut file starting from "[SYSTEM]"
- Send the generated SAPGUI shortcut to the HTTP response
In the third, it is important to set "Content-Type: application/x-sapshortcut" in the HTTP response header. This header makes HTTP response behave as a SAPGUI shortcut.
In addition, you can switch SAP transaction immediately after startup as you like (default is SMEN), by the transaction code parameter passed from the previous page.
data:
mysapsso2 type string,
shortcut_file type string,
host type string,
instancenumber type instanz-systemnr.
call function 'CREATE_RFC_REENTRANCE_TICKET'
importing
ticket = mysapsso2
exceptions
ticket_logon_disabled = 1
ticket_creation_failed = 2
kernel_too_old = 3
others = 4.
if transaction = ''.
transaction = 'SMEN'.
endif.
call function 'GET_SYSTEM_NUMBER'
importing
instancenumber = instancenumber.
runtime->server->get_location(
importing
host = host
).
concatenate '[System]' cl_abap_char_utilities=>cr_lf into shortcut_file.
concatenate shortcut_file 'Name=' sy-sysid cl_abap_char_utilities=>cr_lf into shortcut_file.
concatenate shortcut_file 'Client=' sy-mandt cl_abap_char_utilities=>cr_lf into shortcut_file.
concatenate shortcut_file 'GuiParm=' host into shortcut_file.
concatenate shortcut_file instancenumber into shortcut_file separated by ' '.
concatenate shortcut_file cl_abap_char_utilities=>cr_lf into shortcut_file.
concatenate shortcut_file '[User]' cl_abap_char_utilities=>cr_lf into shortcut_file.
concatenate shortcut_file 'Name=' sy-uname cl_abap_char_utilities=>cr_lf into shortcut_file.
concatenate shortcut_file 'at="MYSAPSSO2=' mysapsso2 '"' cl_abap_char_utilities=>cr_lf into shortcut_file.
concatenate shortcut_file '[Function]' cl_abap_char_utilities=>cr_lf into shortcut_file.
concatenate shortcut_file 'Command=' transaction cl_abap_char_utilities=>cr_lf into shortcut_file.
concatenate shortcut_file '[Options]' cl_abap_char_utilities=>cr_lf into shortcut_file.
concatenate shortcut_file 'Reuse=0' cl_abap_char_utilities=>cr_lf into shortcut_file.
runtime->server->response->set_header_field( name = 'content-type' value = 'application/x-sapshortcut').
runtime->server->response->set_cdata( data = shortcut_file ).Testing
Well, let's actually try it. The screen image of the second chapter was Edge, so in this chapter I will use the screen image of IE11. Let's click the SAPGUI Launcher tile.
A separate tab opens and SAPGUI shortcut has been downloaded, so select "Open file" within 5 seconds and execute the shortcut. After 5 seconds from the screen display, the tab is closed.
If Internet Explorer security warning appears when opening a shortcut, click "Allow". Check "Do not show me the warning for this program again" as necessary.
Next, SAPGUI security warning will be displayed, but click "Allow" here as well. Please check "Remember my decision", if necessary.
An SAPGUI (for Windows) has been launched as expected.
Incidentally, if you run it on an unsupported browser, the following error message will be displayed. In this case, IE11 or Edge is supported, and it is an example executed by Chrome as representative unsupported one.
Closing
Thank you for your reading. How was it?
This sample code is a slightly tricky implementation returning an SAPGUI shortcut as an HTTP response, and supported web browsers are limited. However, I think this is relatively easy to adopt for a controlled enterprise.
Personally, I am hoping that the automation and sophistication with SAP Leonardo technology will eliminate the critical tasks that require SAPGUI for Windows. On the other hand, those tasks are not immediately automated. I hope that this sample code is useful as one of the transition measures.
By the way, I'm a non-ABAPer. (my comfort programming language is C.)
- SAP Managed Tags:
16 Comments
