Overview
initiated SSO. The URL starts with sapfioriclient:// schemeand containsj_username=[username]&j_passcode=[passcode]
parameters. Moreover, the IdP should use TOTPLoginModule for authentication. For more information about the login module settings, see Configuring the Login Modules.
Scenario Description
- SAP Authenticator sends a URL for IdP-initiated SSO to SAP Fiori Client.
- An employee chooses the SAP Fiori Client application from the SAP Authenticator’s list of favorite applications.
Note: A user adds the application as favorite by activating mobile SSO and scanning a QR code.
- SAP Authenticator generates a passcode and sets the username and passcode in the URL.
- SAP Authenticator sends the URL to SAP Fiori Client.
- SAP Fiori Client processes the URL by setting its scheme.
- An employee chooses the SAP Fiori Client application from the SAP Authenticator’s list of favorite applications.
- SAP Fiori Client sends an authentication request containing the passcode and the user’s name, password or cookie.
- The IdP processes the request and issues a SAML 2.0 assertion, which is sent back in the response to the SAP Fiori Client.
- SAP Fiori Client redirects the SAML 2.0 assertion to the SAP Fiori or AS ABAP service provider and the user accesses the application.
- If you are using the AS ABAP service provider, see Mobile Single Sign-On for SAP Fiori.
- If you are using the SAP Fiori service provider, seeUsing SAML 2.0 Authentication to Access Fiori Apps from the Public Internet.
Prerequisites
- Mac OS X 10.10 (Yosemite)
- XCode 6.3.1
- iOS device with version 8.3 (or XCode simulator for iPhone 6)
- node.js, v0.10.25
- Apache Cordova 4.3.0
- SAP Mobile Platform (SMP) SDK SP07
- Install Git.For more information, see Installing Git.CAUTIONIf you are using a proxy server, you must configure Git. For example, if your proxy is proxy:8080, enter the following commands on your Mac:sudo git config --global http.proxy http://proxy:8080/sudo git config --global https.proxy http://proxy:8080/For more information about the sudo command, see Requirements for sudo Command.
- Install Node.js v0.10.* and its package manager, npm, because it is necessary for the installation of Apache Cordova. For more information, see Node.js.CAUTIONWe recommend you install v0.10.25 node version because the latest version, v0.12.0, has incompatibility problems and may produce an error like the following:“…Request path contains unescaped characters…”CAUTIONIf you are using a proxy server you must configure npm. For example, if your proxy is proxy:8080, enter the following commands on your Mac:sudo npm config --global http.proxy http://proxy:8080sudo npm config --global https.proxy http://proxy:8080For more information about the sudo command, see Requirements for sudo Command.
- Install Apache Cordova version 4.3.0 with the following command.sudo npm install -g cordova@4.3.0CAUTION
- Do not use version 4.2.0 because it has a bug which affects the cold start after a navigation by custom scheme. For more information, see handleOpenURL not working correctly on cold start (handler ….
- Do not use the latest Apache Cordova version 5.0 because it is not supported by Kapsel plugins earlier than SMP SDK 3.0 SP09.
- Verify the Apache Cordova installation by entering the following command.cordova –v
- Once you have installed Apache Cordova, download SAP Mobile Platform SDK.Latest version of SAP Mobile Platform (SMP) SDK 3.0 is available under index M at SAP Support Portal.Direct link to SMP SDK SP07 for Mac OS used for this configuration: https://websmp130.sap-ag.de/sap/bc/bsp/spn/download_basket/download.htm?objid=012002523100004172802015D&action=DL_DIRECT.
- Install the SMP SDK on your MacExtract the archive and run installSDK.command.
- (Optional) If you want to allow the Apache Cordova command line to start the iOS simulator on Mac, you must install ios-sim.
- Download the ios-sim tool files from https://github.com/phonegap/ios-sim and execute sudo npm install -g ios-sim. For more information about the sudo command, see Requirements for sudo Command.
- Verify the ios-sim installation by entering the following command in the terminal window: ios-sim –version.
- If you want to access the SAP Fiori URL by HTTPS instead of HTTP, you need to import a server certificate on the simulator. For more information, see Installing certificate in iOS Simulator trust store.
Creating SAP Fiori Client with Apache Cordova 4.3.0
- Modify /Users/<your user>/SAP/MobileSDK3/KapselSDK/apps/fiori_client/config.json file with the following code.{"packageName": "com.sap.fiori.client","targetFolder": "FioriClient","appName": "FioriClient","platforms": ["ios"]}
- Modify /Users/<your user>/SAP/MobileSDK3/KapselSDK/apps/fiori_client/create_fiori_client.js file.Add the code marked in green and remove the one marked in red:...console.log('Adding SAP plugins...');var kapsel_plugins = ['com.sap.mp.cordova.plugins.logon','com.sap.mp.cordova.plugins.logger','com.sap.mp.cordova.plugins.apppreferences','com.sap.mp.cordova.plugins.settings','com.sap.mp.cordova.plugins.authproxy','com.sap.mp.cordova.plugins.online','com.sap.mp.cordova.plugins.toolbar','com.sap.mp.cordova.plugins.cachemanager','com.sap.mp.cordova.plugins.encryptedstorage','com.sap.mp.cordova.plugins.push','com.sap.mp.cordova.plugins.e2etrace','com.sap.mp.cordova.plugins.barcodescanner','com.sap.mp.cordova.plugins.fioriclient','com.sap.mp.cordova.plugins.attachmentviewer'];var plugins = [//path.join(sdk_root,'plugins','logon'),//path.join(sdk_root,'plugins','logger'),//path.join(sdk_root,'plugins','apppreferences'),//path.join(sdk_root,'plugins','settings'),//path.join(sdk_root,'plugins','authproxy'),//path.join(sdk_root,'plugins','online'),//path.join(sdk_root,'plugins','toolbar'),//path.join(sdk_root,'plugins','cachemanager'),//path.join(sdk_root,'plugins','encryptedstorage'),//path.join(sdk_root,'plugins','push'),//path.join(sdk_root,'plugins','e2etrace'),//path.join(sdk_root,'plugins','barcodescanner'),//path.join(sdk_root,'plugins','fioriclient'),//path.join(sdk_root,'plugins','attachmentviewer'),'org.apache.cordova.camera','org.apache.cordova.file','org.apache.cordova.geolocation','org.apache.cordova.statusbar','org.apache.cordova.media','org.apache.cordova.splashscreen@0.3.0'];if (!useCrosswalkForAndroid) {shelljs.exec('cordova plugin add ' + kapsel_plugins.join(' ') + " --searchpath " + path.join(sdk_root, 'plugins'));//rebuild Kapsel plugins against local search path and not remote Cordova repositoryshelljs.exec('cordova plugin add ' + plugins.join(' '));shelljs.exec('cordova plugin add https://github.com/EddyVerbruggen/LaunchMyApp-PhoneGap-Plugin.git --variable URL_SCHEME=sapfioriclient'); // add custom scheme plugin for the hybrid app}else {plugins.forEach(function (plugin, index) {shelljs.exec('plugman install --platform android --project . --plugin ' + plugin + " --searchpath " + path.join(sdk_root, 'plugins'));});}...This is necessary to allow Apache Cordova to run with the original script and a new custom scheme Apache Cordova plugin to listen to the sapfioriclient scheme.
- Remove plugman cache under /Users/<your user>/.plugman/cache to avoid any problems with cached plugins if you had used other Apache Cordova version before you switched to 4.3.0.
- Once the script is changed, run it with the following commands.sudo npm installsudo node create_fiori_client.jsFor more information about the sudo command, see Requirements for sudo Command.
Running SAP Fiori Client with iOS SAP Authenticator
- Generate a new FioriClient folder with the corresponding XCode project.
To be able to open and modify it with XCode, you might need to give write permission with the following command:
sudo chmod -R 777 FioriClient
For more information about the sudo command, see Requirements for sudo Command. - Modify the following two JavaScript files within the project in order to allow SAP Fiori Client SSO from SAP Authenticator.
- Do the following changes inside fioriclient.js.The code to be added is marked in green....var goToFioriURL = function(errorCallback) {sap.FioriClient.getFioriURL(function (retrievedFioriURL) {if (!context.smpRegContext){// If sap.FioriClient.context.smpRegContext is null,// don't allow the user to skip// the logon plugin by changing the URL.// sap.FioriClient.context.smpRegContext will be set//once logon is successful.// Once logon completes and the app navigates to the URL,//sap.FioriClient.context.smpRegContext will// be undefined, so it will pass this test.return;}if (!isUrl(retrievedFioriURL)) {errorCallback();return;}if (!sap.FioriClient.MobileSSO) {setFioriURL(retrievedFioriURL);}// Add extra query string to force page reload.var buster = "smphomebuster=" + Math.random()*10000000000000000;...var getFioriURL = function(callback) {function getFioriURLFromAppPreferencesFailed(error) {sap.Logger.info(error, 'FIORI_CLIENT');// The Fiori URL wasn't found, so use the hardcoded value.doHttpsConversionIfNeeded(context.appConfig.fioriURL, callback);}function getFioriURLFromAppPreferencesSuccess(url) {if (sap.FioriClient.MobileSSO) {url = sap.FioriClient.MobileSSO;}if (url != null) {doHttpsConversionIfNeeded(url, callback);} else {doHttpsConversionIfNeeded(context.appConfig.fioriURL, callback);}}sap.AppPreferences.getPreferenceValue('fioriURL', getFioriURLFromAppPreferencesSuccess, getFioriURLFromAppPreferencesFailed);};...
- Add the following new method inside LaunchMyApp.js.The code to be added is marked in green.cordova.define("nl.x-services.plugins.launchmyapp.LaunchMyApp", function(require, exports, module) { "use strict";/*Q: Why an empty file?A: iOS doesn't need plumbing to get the plugin to work.- Including no file would mean the import in index.html would differ per platform.- Also, using one version and adding a userAgent check for Android feels wrong.- And if you're not using PhoneGap Build, you could paste your handleOpenUrl JS function here.*/});function handleOpenURL(url) {setTimeout(function() {if (url.indexOf("sapfioriclient://") === 0) {sap.FioriClient.MobileSSO = url.replace("sapfioriclient://", "https://");}}, 300);};
- Do the following changes inside fioriclient.js.
- Build and run the project on any iOS device (simulator).SAP Fiori Client should be ready to handle any mobile SSO requests from SAP Authenticator.