Skip to Content
Technical Articles
Author's profile photo Shunichiro Yamamoto
Shunichiro Yamamoto
January 7, 2019

SAP Fiori LaunchpadからSAPGUI for WindowsをSSO起動してみた

はじめに

2013年にわずか25アプリケーションでスタートしたSAP Fiori（Fiori 1.0）は、たった5年で10,000を超えるアプリケーションを擁するまでに成長しました。特に、2015年のS/4HANA 1511（Enterprise Management）に採用されたFiori 2.0から、急激にアプリケーション数が増えていますが、その急成長を支えているのは、Application TypeがSAP GUIのもの、すなわちBerizeテーマを適用したWebGUI（SAPGUI for HTML）によるトランザクションです。

SAP Fiori Launchpadがすべての業務のエントリーとなり、CDSアノテーションによりノンコーディングで作成されたSAP Fiori Elements（Overview Page, Object Page, Analytical List Page, etc.）が気づきを与えて、詳細なトランザクションへ繋げていく、というのがFiori UXです。

Fiori UXはWebベースであり、今後のWebテクノロジーのさらなる進化や5G普及によるネットワーク速度・品質の向上などにより、さらに快適になっていくことは間違いありませんが、過渡期である現在では、SAPGUI（for Windows）を使いたいというお客様ニーズが確実に存在します。

今回は、BSP（Business Server Pages）という枯れたWebテクノロジーを活用して、そのニーズに応えるサンプル実装をご紹介したいと思います。

 

やりたいこと

SAP Fiori Launchpadのタイルをクリックすると、、、

 

ユーザIDおよびパスワードを入力することなく、SAPGUI（for Windows）が起動します。Web GUI（SAPGUI for HTML）は標準的なLaunchpad設定手順でタイルを設置可能ですが、SAPGUIはそういきません。

 

実現方法

それでは続いて、どのように実装しているのかを具体的に見てみましょう。今回のサンプルでは、BSP（Business Server Pages）という枯れたWebテクノロジーを利用しています。ご存知ない方のために、少しだけ補足しておきますと、BSPというのは、JSP（Java Server Pages）やASP（Active Server Pages）のABAP版であり、スクリプトレットをABAPで記述するイメージです。具体的に後ほど登場するサンプルコードをご参照ください。

 

アーキテクチャおよび処理シーケンス

BSPアプリケーション ZCCSAPGUIが今回の主役です。ZCCSAPGUIアプリケーションは、default.htm および createSapGuiShortcut.htm という2つのページから構成されます。それぞれのページが何をやっているのか、具体的に見てみましょう。

 

※BSPの採用は必須ではありません。他のWebテクノロジーで実装することも可能です。

※一度HTTPレスポンスを返してJavaScriptでWebブラウザ判定していますが、サーバーサイドで判定することも可能です（例：IF_HTTP_REQUESTインタフェースのGET_USER_AGENTメソッドなど）。

 

default.htmの実装

HTMLのボディは極めてシンプルです。SAPUI5のテンプレートそのまま、という感じですね。すべての処理は、実行時のJavaScriptによって制御されます。

<%@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>

 

続いて、処理の本体であるJavaScriptで何をやっているのか見てみましょう。まず最初に呼ばれるのは、sap.ui.getCore().attachInit() です。SAPUI5コンポーネントを定義して、HTMLボディを構成しています。その処理の最後で launchSapgui() を呼び出します。

launchSapgui() の主要な処理は、Webブラウザ判定処理 isSupported() です。以下のサンプルコードでは、Microsoft Internet Explorer 11とEdgeのみ許可しています。IE11かEdgeの場合は、「5秒以内にSAPGUIショートカットを開いてください」というメッセージを表示し、次ページの createSapGuiShortcut.htm を開きます。5秒経過すると自動的にタブが閉じます。

それ以外のWebブラウザの場合は、「サポート対象外です。システム管理者に連絡してください」というメッセージを表示して、タブを閉じます。

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();
});

※上記はあくまでサンプルのため、最新のブラウザ判定ロジックを適用してください。

 

createSapGuiShortcut.htmの実装

WebブラウザがIE11かEdgeの場合、default.htmlからcreateSapGuiShortcut.htmが呼び出されます。こちらのページでは、イベントハンドラが主要な処理を担います。以下のABAPコードは、OnRequestイベントハンドラのサンプルコードです。処理の流れを簡単にまとめると以下のようになります。

  1. MYSAPSSO2（認証トークン）を生成する
  2. “[SYSTEM]” から始まるSAPGUIショートカットファイルの内容を生成する
  3. HTTPレスポンスに生成したSAPGUIショートカットを流し込む

3.で、HTTPレスポンスヘッダに “Content-Type: application/x-sapshortcut をセットしているところがポイントです。このヘッダ指定により、SAPGUIショートカットとして認識されます。

また、前ページから受け渡されたtransactionパラメータをオプション指定しているため、起動直後のSAPトランザクションを切り替えることが可能です（デフォルトはSMEN）。

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 ).

 

動作確認

さて、実際に呼び出してみましょう。「やりたいこと」章の画面イメージはEdgeでしたので、本章ではIE11の画面イメージを利用します。適切に設置した「SAPGUI Launcher」タイルをクリックしてみます。

 

別タブが開き、SAPGUIショートカットがダウンロードされましたので、5秒以内に「ファイルを開く」を選択し、ショートカットを実行します。画面表示から5秒経過すると、タブが閉じられます。

 

ショートカットを開いたときに、Internet Explorerセキュリティの警告が表示された場合は「許可」をクリックします。必要に応じて「今後、このプログラムに関する警告を表示しない」にチェックをつけてください。

 

続いて、SAPGUIセキュリティの警告が表示されますが、こちらも「許可」をクリックします。必要に応じて、「選択内容の保存」チェックをつけてください。

 

想定通り、SAPGUI（for Windows）が起動しました！

 

ちなみに、サポート対象外のブラウザで実行した場合は、以下のようなエラーメッセージを表示します。今回は、IE11もしくはEdgeをサポート対象としてパラメータで与えているので、サポート対象外の代表としてChromeで実行した例です。

 

さいごに

いかがだったでしょうか？

SAPGUIショートカットをブラウザのHTTPレスポンスから流し込むという、少しトリッキーな実装ですし、対応ブラウザが限定されますが、統制されたモード1なエンタープライズ向けであれば、適用しやすいのではないかと思います。

個人的には、SAP Leonardoテクノロジーを活用した自動化・高度化により、SAPGUI for Windowsが必須とされるようなクリティカルな業務がなくなることを願ってやみません。一方、すぐになくなるわけではないので、過渡期の対応方法の一つとして、今回ご紹介した方法がお役に立てば幸いです。

ちなみ私は、non-ABAPerです（ソウルプログラミング言語はC）。

Assigned Tags

      2 Comments
      You must be Logged on to comment or reply to a post.
      Author's profile photo Aleksandar Mijailovic
      Aleksandar Mijailovic

      English Version available?? Arigato! ?

      Author's profile photo Shunichiro Yamamoto
      Shunichiro Yamamoto
      Blog Post Author

      Thank you for your reading. posted the English version today. Please check it out.
      https://blogs.sap.com/2019/05/09/how-to-launch-sapgui-with-sso-from-fiori-launchpad/