Traditionally (in ABAP-land), in order to notify a user about something in SAP, it meant sending an e-mail to the user mailbox. It works most of the time until the user gets sick and tired of all the emails and sets up a rule to block all incoming e-mails from the SAP system or sets a rule to route it to the spam folder.
Then, came along mobile / Fiori applications where we’re now open to the world of real-time push notifications directly on your mobile device – ding! Obviously, this works great when you’re looking at your phone 24×7 and it’s always within reach.
Anyway, what about the time when you’re casually browsing a website on your desktop for leisure or actual work and you need to be notified of an event in SAP but then your phone is not within reach (panic attack!) and you don’t want to switch over to your mail client?
In this little proof-of-concept implementation, I’ve used OneSignal‘s API to demonstrate sending of real-time web push notification directly from an ABAP server to a user’s active browser session.
For my POC, I’ve only selected Google Chrome and Mozilla Firefox
Then, came along mobile / Fiori applications where we’re now open to the world of real-time push notifications directly on your mobile device – ding! Obviously, this works great when you’re looking at your phone 24×7 and it’s always within reach.
Anyway, what about the time when you’re casually browsing a website on your desktop for leisure or actual work and you need to be notified of an event in SAP but then your phone is not within reach (panic attack!) and you don’t want to switch over to your mail client?
Web push notification to the rescue!
In this little proof-of-concept implementation, I’ve used OneSignal‘s API to demonstrate sending of real-time web push notification directly from an ABAP server to a user’s active browser session.
The example screenshot above shows a notification from my SAP ABAP server while I’m browsing SCN.
If you are interested to get an overview of how this was done, read on!
Sign up on OneSignal
If you’ve never heard of OneSignal, they are a FREE multi-platform push notification service. Check out their Pricing model! It’s like a dream come true!
The first thing I have to do is to create an app on OneSignal and the purpose of this is to get an App ID.
Select the Platform – Website Push
Configure the Platform
Note: I had to enter the port number as well on the Site URL to make it work. As for the Icon URL, I just grabbed a random SAP Icon in PNG format from Google.
And since my ABAP server is not fully HTTPS, I used the HTTP fallback options that OneSignal provided and you need to enter a subdomain – limited to 14 characters and use only characters and numbers (dashes allowed).
Select Website Push for SDK
Done! I now have an App ID that’s generated and I will need this for the next step! I’ll come back to this screen later and click on the ‘Check Subscribed Users’ button to validate that we’ve completed the process.
Sign users up!
Now, let’s go into ABAP-land – in here, I’ll create a simple BSP application and refer to the OneSignal’s SDK to create a page that users will view to in order to get subscribed to the web push notification service.
I am running the SAP NW AS ABAP 751 SP02 Developer Edition instance for this POC. You can get it through this link here and if you search on SCN for the tag ABAP_TRIAL, you’ll find lots of good tutorials on how to install your own local instance.
Anyway, so, head right into SE80 and create a BSP Application.
In the ‘Layout’ Tab of the BSP page, I referred to the OneSignal SDK instructions and created a simple webpage. See sample code below. Saved and Activated the application and then also made sure that the service is activated in transaction SICF.
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="x-ua-compatible" content="ie=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Subscribe to PO approval web-push</title>
<script src="http://cdn.onesignal.com/sdks/OneSignalSDK.js" async='async'></script>
<script>
var OneSignal = window.OneSignal || [];
OneSignal.push(["init", {
appId: "XXXXX-ENTER-APP-ID-XXXXX",
autoRegister: true, /* Set to true to automatically prompt visitors */
httpPermissionRequest: {
enable: true
},
notifyButton: {
enable: true /* Set to false to hide */
},
welcomeNotification: {
"title": "SAP PO Approval notification",
"message": "Thanks for accepting!",
// "url": "" /* Leave commented for the notification to not open a window on Chrome and Firefox (on Safari, it opens to your webpage) */
},
subdomainName: "vhcalnplciabap" /* Value you added from step 1.4 of the HTTP setup guide, do not use the https:// nor the .os.tc */
}]);
</script>
</head>
<body>
Demo: OneSignal web push notification from ABAP
</body>
</html>
From SICF, I can then run a test of the service.
Once the page is loaded, I will now get a popup saying that this page wants to show me notifications. Click ‘Allow’
And then I got a confirmation prompt to say that I’ve successfully subscribed.
And BOOM! In a few seconds, I’ve received my first web push notification!
Now, if I go back to the OneSignal set up screen and click on the ‘Check Subscribed Users’ button, it should now say that I have one user subscribed!
SWEET! We’re done with the second part of the POC.
Sending notifications
The last part of the POC is simply deciding when I want SAP to trigger the web push notification and for the purpose of this POC, I picked the “Approve” action of a Purchase Order on the Fiori App that’s part of the EPM model in my Fiori Launchpad.
Before heading back into ABAP-land, I need the APP ID and also the REST API key from OneSignal for this next step.
So, in order to make this POC work based on the scenario that I made up earlier, I added an implicit enhancement at the end of Method DO_APPROVE of Class CL_SEPMRA_A_PO_APPROVE_REJECT.
ENHANCEMENT 1 ZIMP_ENH_PO_APPRV_NOTIF. "active version
cl_http_client=>create_by_url(
EXPORTING
url = 'https://onesignal.com/api/v1/notifications'
ssl_id = 'ANONYM'
IMPORTING
client = DATA(lo_http_client)
EXCEPTIONS
argument_not_found = 1
plugin_not_active = 2
internal_error = 3
OTHERS = 4 ).
IF sy-subrc EQ 0.
DATA lv_body TYPE string.
DATA(lv_node_key) = lt_node_key_info[ 1 ]-node_key.
SELECT SINGLE PO_ID INTO @DATA(lv_poid) FROM SNWD_PO
WHERE node_key = @lv_node_key.
lv_body = '{'
&& '"app_id": "XXXXX-ENTER-APP-ID-XXXXX",'
&& '"included_segments": ["All"],'
&& '"headings": {"en": "SAP PO ' && lv_poid && ' Approved!" },'
&& '"contents": {"en": "' && iv_reason && '"},'
&& '"url": "http://vhcalnplci.dummy.nodomain:8000/sap/bc/webdynpro/sap/s_epm_fpm_po?FPM_INITIAL_PAGE_PROC_MODE=L&FPM_EDIT_MODE=R&FPM_NAVI_SOURCE_KEY_ATTR_PO_ID=' && lv_poid && '&SAP-CLIENT=001#"'
&& '}'.
lo_http_client->request->set_method( 'POST' ).
lo_http_client->request->set_content_type( 'application/json; charset=utf-8' ).
lo_http_client->request->set_header_field(
EXPORTING
name = 'Authorization'
value = 'Basic XXXXX-ENTER-REST-API-KEY-XXXXX' ).
lo_http_client->request->set_cdata( lv_body ).
lo_http_client->send(
EXCEPTIONS
http_communication_failure = 1
http_invalid_state = 2 ).
lo_http_client->receive(
EXCEPTIONS
http_communication_failure = 1
http_invalid_state = 2
http_processing_failed = 3 ).
ENDIF.
ENDENHANCEMENT.
Save and Activate.
Note: In order to get the solution to work, I had to also download the SSL certificates from https://onesignal.com as CER files and load them into STRUST, otherwise, I get an error when executing the send and receive methods.
Testing time!
Finally, to test this POC, run transaction /UI2/FLP to get to my Fiori Launchpad and clicked on the ‘Approve Purchase Orders’ Tile.
Pick a PO, click ‘Approve’ and enter a reason in the popup box.
And, voila! I got a notification that a PO has been approved and the reason entered in the popup appears in the text as well.
So, now, even if I’m browsing any other websites or basically as long as my Chrome browser is running, I’ll get a real-time web push notification every time a PO gets approved from SAP!
Final thoughts
This POC was pretty fun to build and it also opens up some more possibility of deploying a different type of notification to users in SAP outside of just sending emails and save your users from having to deal with e-mail spam.
This comment has been removed by the author.
ReplyDeleteSabrina, thank you for great overview!
ReplyDeleteI recommend also www.ZetPush.com
ReplyDeleteExcellent Information.To get awesome training in SAP FIORI,the creating experts is the best choice.
The experts provides 100% real-time, practical and placement focused SAP FIORI Training in Chennai.
The team of SAP FIORI Trainers are SAP FIORI Certified professionals with more real-time experience in
live projects.For more information visit : real time sap fiori training in chennai