Create HTML5 based SuccessFactors extension app using SAP Cloud Platform - Part 1

[Murali_Shanmu]

In this blog, I am going to share my experience on extending SuccessFactors using SAP Cloud Platform. Over the last few weeks, I had several queries on this topic – Which services in SAP Cloud Platform are required for SuccessFactors extension, where does the extension app get deployed, how do we setup trust between SAP Cloud Platform and SuccessFactors. I myself had couple of questions on how to go about creating a HTML5 based extension app. These questions seemed to be very basic, but for some reason I couldn't find a comprehensive blog which covers these topics. I will try and explain this in simple terms assuming that people with either SuccessFactors or SAP Cloud Platform knowledge would want to know more about this approach.

Before I get started, here are some useful links to bookmark.

• SAP Cloud Platform, Extension Package for SAP SuccessFactors


• OpenSAP Course - Extending SAP SuccessFactors with SAP Cloud Platform


• SAP SuccessFactors Extensions on SAP Cloud Platform - for Developers

There are also couple of tutorials published in GitHub which show how to build an extension app using Java/SAPUI5.

• Benefits extension App


• Integrated Time off

When you go through the above links, you will notice that they are more relevant when building Java based applications. This would require installing the Command Line Interface which would be used to deploy the app, create destinations in SAP Cloud Platform cockpit and even to create tiles in SuccessFactors homepage.

There are few limitations of using HTML5 apps as compared to Java apps. This is documented in the overall process.

I was dealing with a customer’s requirement that was very simple. Create a HTML5 app which consumes SuccessFactors OData APIs and integrate it within the SuccessFactors homepage. The customer didn’t want to use Java application and hence there was no need to setup Command line interface.

Here are the steps which I have followed. If you plan to do all these steps, you would need access to a SAP Cloud Platform account as well a SuccessFactors tenant for which you have all the relevant admin roles.

Creating and configuring SuccessFactors extension subaccount

 

Navigate to the SAP Cloud Platform global account. In the below screen capture, the name of my Global account is “Trivia”. There is one subaccount with the same name too.



Click on “Integration Tokens” from the menu. By default there would be no entries.



Click on “New Token” to generate an integration token. Make a note of it.



Navigate to the SuccessFactors Provisioning interface and select the Company name.



Navigate to the “Extension Package Configuration” as shown below. You would need to provide the integration token generated earlier. This will trigger the provisioning process.



In few minutes, you will see the status of an extension SAP Cloud Platform subaccount which has been created



If you switch back to the SAP Cloud Platform global account, you will notice that a new subaccount has been created for you. It contains the Company name by default. You can use the pencil icon to change the name of this subaccount.



When you select this particular subaccount and navigate to the cockpit, you will notice that Trust configuration with SuccessFactors tenant has already been defined.



In the Application Identity Provider, SuccessFactors tenant has been registered as the Identity Provider. This means, if I try to launch any application or even SAP Cloud Platform services, it will authenticate me using SuccessFactors credentials.



Next thing which needs to be done is to navigate to SAP WebIDE service and select “Configure Service” link. You need to ensure that you assign the predefined role “Everyone” to WebIDEPermission permission. Only after doing this step, you will be able to launch SAP WebIDE.



Finally, we need to create a destination which will be used by the extension application.



Below are the values I have provided for the above destination.

URL	https://apisalesdemo2.successfactors.eu:443/odata/v2
Token Service URL	https://apisalesdemo2.successfactors.eu:443/oauth/token
Proxy Type	Internet
Audience	www.successfactors.com
Client Key	<oAuth API Key>
assertionIssuer	<oAuth API Key>
companyId	<COMPANY NAME>
nameQualifier	www.successfactors.com
WebIDEEnabled	true
WebIDESystem	SuccessFactors
WebIDEUsage	odata_gen

The oAuth API key can be obtained from SuccessFactors. I will show you how to obtain the API Key from SuccessFactors in the next part of this blog series.

Part 2 - Creating a HTML5 based extension application using SAP WebIDE

Part 3 - Configuring a Portal site based on SuccessFactors extension template

[catlacroix99]

Hi Murali, I'm Catherine from the Community Experience team. I'll be including this blog series in the Community Voice  newsletter coming out on Wed., Dec 13 this week. I'd like to suggest you add the links to your other two blogs in the series to this first blog.  You could add the links at the end so readers can find your other two blogs easily.  Thanks again for writing this great blog series. Regards, Catherine

[former_member54417]

 

Hi Murali,

Thanks for writing this excellent blog. I tried to follow it step by step however when I check Connection after creating the destination, I’ll get an error “Failure reason: “Could not check at the moment. Please try again later”“.



Additionally, when I tried to add properties, I cannot find assertionIssuer, companyId and nameQualifier in the dropdown list.



Could you please let me know if anything I configured is wrong here?

 

Thanks,

Fiona

 

[i834235]

Hello Fiona,

You will not find assertionIssuer, companyId and nameQualifier in the dropdown list. You have to manually enter the above variables as key name and maintain  values for it.

 

Hope it helps.

Regards,

Manju

[Former Member]

Hi Murali and Venkatesh,

I am working on a POC, for a similar requirement for our organization, where I want to read the SF API's into SAP CP and build an UI5 app with SAP Web IDE and then integrate it into SF.

I am working right now with my trial acc of cloud platform, I have been able to consume the API's for our organizations quality instance of Success factors and also I am done with the app development in the cloud platform.

My next step is to integrate this app into the quality instance of SF, this is where I was not sure how to achieve it and luckily I found your blog.

But my doubt is, is it possible to configure the "Extension Package for SAP SF" through trial account. Because I don't see the option of "Integration Tokens" in trail account.

Regards,

Naresh

 

[i834235]

Hello Naresh,

It is not possible to integrate SAP Cloud Platform trial account with SuccessFactors instance using extension package for SAP SuccessFactors. As you rightly said there is no  concept of integration token for trial accounts. Integration token is only available only for SAP Cloud platform enterprise account and hence extension package for SAP SuccessFactors  can only  be used with  SAP Cloud platform enterprise accounts.

Regards,

Manju

[FedericoB]

Hi!

Is it possible to use WEB IDE FULL STACK? If yes, how should I use it? I get a SSO error

[Murali_Shanmu]

Hi Federico, I just got a confirmation that WebIDE Fullstack is supported. Can you please raise a question in the forum? Thanks,

 

[FedericoB]

Thanks!

Is possible get the User logged?

I use the USER SCP API but dosnt work

[Former Member]

Hi Murali and Manju,

I was able to complete all the configurations as mentioned in the post, everything is fine expect for one issue. After I consume the api and build an app in web ide, the app works fine but once after converting the app into portal service component, the app stops working and I have noticed, this conversion creates couple of errors in manifest.json. I am assuming its due these errors that the app stops working after converting into portal component.

I have attached the error screen shots below, can you please let me know how to fix the issue.



 

Thanks,

Naresh

[VikasLamba]

Naresh – I am facing the same issue and observed that when we convert the UI5 application to a portal widget, the system overwrites some of the values inside the manifest.json file. One of these values chnage the underling router class as follows:

Original class used before making a widget: "routerClass": "sap.m.routing.Router"

Class name changed by portal service after making it a widget: "routerClass": "sap.hana.uis.flp.routing.Router"

If you just roll back this to the original value your application will work from Web IDE gaian.

Cheers,

Vikas

[former_member18300]

Does it not possible without integration token?

Second question - Once success-factors consumes integration token or sub account is created, destination and trust setting are done or still need to do?

[raghavendra_nookala]

HI Murali,

I want to use lms odata api in ui5 applicaiton, is this the way same applicable to lms also?

Thank You

[former_member27203]

Hi Murali,

Doing this extension app requires any additional subscription apart EC subscription?

Thanks for the help 🙂

[davidl]

Please update the links in this post.

[becksen]

Hi all,

have you experienced the error message "You have reached your integration token quota limit." during creation of the integration token? Do you know when the limit will be reset or how big the limit is?

 

Couldn't find anything in the SAP documentation.

 

Regards,

Timmy