Skip to Content
SAP Business Workflow

Approving a Workflow from GMail

Overview

Recently I have been challenged with a particular scenario an SAP-SRM system workflow.

The workflow system send an email to approvers and within the e-mail there are two links to approve and reject.

These links were composed of a "mailto:" enclosed on an "<a href=" html tag. It is supposed to create an e-mail message automatically fill the message body with the workflow variables for approving or rejecting a particular work item.

Challenge

The generated e-mail contained sensitive information and required the e-user to submit the new e-mail message on the e-mail client.

As you may have already figured out the challenge is the fact that once you click on the mailto link you really lose control over what the end-user will do.

In fact, more often than usual, end-users ended up erasing the contents of the newly created e-mail or even closing the new window.

I was requested to figure out a way to hide the technical information from the e-mail so that end-users would still execute their approvals without having to know the details.

Of course I didn't even mention the possibility of using Fiori Approve App in this case because it was out of scope here. But it would be a much more elegant way to present the task to them and ensure the approval took place. But that is another discussion.

Solution

Since this customer is a corporate user of GMail, all their approvers are in fact using gmail to perform their daily tasks. Therefore their email client is actually the user's browser.

When I started to figure out how to hide that information my main focus was to use the mailto link to and somehow inject an HTML piece of code to hide that. Ideally the end-user would have an e-mail with very simple instructions to simply click on the SEND button. To my surprise, mailto links will perform very basic stuff related to e-mail - and that's what they were meant to, after all HTML email came in after URL's were born. So mailto was not an option.

That's when I realized that the job had to be done by the e-mail client. Eventually I would have to write code to capture the data and send it to the SRM inbox for processing.

By searching google I came across the scripting API for Google Apps. This raised my hopes of creating a really fast solution. The API had a very simplistic way of sending emails in the background. The fact that the script could be published as a Web App was a relief.

Basically I had to create the code to send the specially crafted e-mail (so the company didn't have to change their e-mail processing engine) and capture the variables via URL parameters. Here is how I achieved it...

Step-by-Step

1) Open the following URL to start the script editor

http://scripts.google.com

2) Create a new Project by opening the menu File -> New -> Project

This will create a new file automatically: named Code.gs

3)  Enter the following piece of code:

var cart = '';

var cartVal = '';

var subject = '';

var body = '';

// This code inlines the SRM body in an email via parameters and sends the email

function inlineHTMLMail() {

  //SRM inbox address. The address that will receive all of the approvals to be parsed and processed by the system

   var email = 'srm.inbox@corp.com';

  //This code will send the e-mail

   MailApp.sendEmail({

     to: email,

     subject: subject,

     htmlBody: body,

   });

}

function doGet(e) { // A script that is published as a web app must contain a doGet(e) function.

  //Parameter retrieval for index.html

  cart = e.parameter.cart;

  cartVal = e.parameter.cartVal;

  //Parameter retrival for e-mail submition

  body = e.parameter.body;

  subject = e.parameter.subject;

  //Calls the function to send the acctual e-mail.

  inlineHTMLMail(subject, body);

  //return a simple html response

  return HtmlService

      .createTemplateFromFile('index')

      .evaluate();

}

4) Create a new index.html that will contain the response by going into file menu -> new -> HTML file and naming it "index.html"

This HTML file is a very simple file that will present the end-user a response. We could easily have an HTML form containing hidden fields there so it would submit the approval via e-mail as a second step (just to be safe). I didn't do it here because it would be a more complex solution and I was just trying to make the approval process as simple as possible.

5) Then paste the below code and save all files CTRL+SHIFT+S

<html>

  <body>

  <br>

  <h2><p>Approval for Shopping Cart N# <?= cart ?> - <?= cartVal ?> received by our systems</p></h2>

  <br>Thanks<br>

  </body>

</html>

As you can see, this is much like any server side scripting app, such as PHP or ASP. You could implement this the way you like.

As I said, it would be great to present a new form or even a HTML5 content so the approvers could then click on a SEND button rather than just receiving a message.

6) Now we need to publish the above script as a Web App. You do this by going into menu Publish -> Deploy as Web App.

When you select this option, you will be prompted with a pop-up window. Click on the Save New Version button and the publish button will be enabled.

If you are the administrator of a Google Domain you will have more options here to restrict the script access to your own domain.

Ideally select:

Run this web app as: User accessing this web app or users from your domain.

Who has access to this application: Anyone

7) You will be presented with a link to the recently deployed app. Now all you need to do is add the parameters to the URL like this (remember to replace the <GUID> with the code that represents the deployment instance of your WebApp and that all parameters have to be URL-Encoded:

https://script.google.com/macros/s/<GUID>/exec?subject=%23SRM_APPROVAL%23Approval%20for%20work%20item&cart=192&cartVal=123%20BRL&body=TECH_INFO_A%3D000000000000000000000000000000000000000000F%3Cbr%3E%0Asubmit_a%3DApproval%3Cbr%3E%0ATECH_INFO_R%3D000000000000000000000000000000000000000000F%3Cbr%3E%0ANOTM_OUT%3D%3Cbr%3E%0AEOM%3D1%3Cbr%3E

This URL of course would be created dynamically by the Workflow System for each link (approve / reject).

Once the end-user clicks on it, it will present the HTML file index with some information right after sending an e-mail in the background to the SRM system with the approval for parsing and processing.

Drawbacks

1) This solution is supported by a 3rd party. Therefore, anything integration points between SAP and Google should be taken into consideration while implementing this type of solution. You need to be aware of each integration point and whom to charge for fixing any potential issues - especially when it involves ever evolving technologies.

2) Every user must agree to run this script. So the first time you click on the link, your end-users will have to accept and agree to run this script.

First the end-user needs to continue with the authorization request to run the script:

Once you hit 'continue' then the user will be presented with a permission screen:

NOTE: This will be done just once per user. The subsequent approval actions will proceed without these authorization requests.

The above image is requesting additional authorization that is necessary since I am sending the e-mail back to my self while documenting this on SCN. However, the code above isn't doing that. Therefore you should not see requests for "Send email as you".

WARNING

Anyone that may intercept the approver's e-mail may submit an approval this way. It is not a security breach of this procedures documented here. Emails are by nature not safe unless you encrypt them with the company's certificate. If you protect the contents of the originating email, the response can safely travel unencrypted. First because you will only allow the script to be ran by company employees belonging to the same domain. Secondly, because of the FIFO factor. First response received by the inbox will take precedence and be processed. Once the WI is processed, the next will not go through. The Google Apps Script does not support encryption when this document was written.

Results

Since a picture speaks a thousand words, here goes the whole process.

1) Approver receives an email containing the links for approval. The image below is just an example of the email crafted in ABAP and sent to the approver:

NOTE:: what you need to do is to craft the e-mail in ABAP with the correct URL to approve or reject.You may add additional information such as the shopping cart details, line item values, etc.

2) Approver clicks on the link "Approve" directly on the e-mail. Look at the above image where I try to show the URL being called at the bottom of the page (status bar).

3) Approver receives a pop-up window with the response - stating that the e-mail with the approval has been received by SRM:

NOTE: There is a lot of room for improvement here. For instance: If you wanted to send any comments back to SAP's Workflow, you would need to capture the comments on via an "<input>" html tag on this index.html file that is displayed for the end-user. In such a case, one would need to pass on the variables from this input field to the method that sends the email (script) via the POST of a FORM. All variables from the script would still be there for later use once the user sees the html.

NOTE: On our example here, once the end-user sees this message, the email has already been sent back to SRM for processing. Ideally you may want to prevent wrong clicks on the link. Do it, one would add a submit button on an HTML form (similar to what I have explained above) that calls the script method to send the email.

4) Below you can "see" the actual e-mail containing the ABAP variables that will be processed in SRM by pooling the e-mail from a configured inbox account:

Of course, I am just displaying the e-mail here so you are able to see the output and for my own sanity.

I think it is obvious say that this will not be displayed in GMail at all. Only administrators or developers working on SRM will have access to it.

Enjoy!