Integrating Google Forms with Webhooks

Connecting Google Forms and RingCentral Glip with Webhooks

Google Forms are one of the most highly used general purpose forms, used across by individuals and businesses for collecting valuable data. Glip is one of the most popular unified communications and team messaging application used across by individuals and business. A synergy between Google Forms and Glip becomes a powerful tool for solving many business processes and workflows and that too, with minimum effort. I am going to show you exactly how.

Use Case: I manage a business process where, I collect data from various stakeholders using a Google Form (which is linked to a Google Sheet) and I have a Glip team to discuss about the inputs gathered from the form. One of my essential requirement was to get a Glip notification in the Glip team whenever someone fills up and submits the Google Form. And the Glip notification should contain value of some of the key fields, from the form, it helps me to get high level detail of the data from the notification itself. Time is of essence here because I want to know whenever someone has filled up the form, so that I can take a look at it and prepare the next business action as soon as possible.

Solution: Let me first provide a high-level flow diagram and then, I shall explain the parts

Flow Diagram for the Integration

The above diagram shows how the integration works. Whenever user fills up and submits the google form it triggers “onFormSubmit” event trigger which you handle with a code, from where you push a post to your desired Glip team.

Here are the steps involved:

Step 1

Get the inbound WebHook endpoint for your Glip team. In this step you get the Inbound WebHook details for your Glip team so that you can post to your specific team.

a. Right Click on the Settings icon on your Glip team and click “Add Integration”

b. Search for Glip WebHooks

Glip Webhooks

c. And once you click it you will get the WebHook details

Save the HTTP POST end point provided for later use. This endpoint is the WebHook endpoint for your team.

Step 2

Go to your Google Form and Configure and Code the onFormSubmit trigger to take the necessary action when a user submits a Google form.

a. On the GoogleForm in Edit mode go to the “Script editor” as seen below

b. When the “Script editor” opens, change the function name to onFormSubmit, this is a standard Google Form Submit event trigger. As shown below

onFormSubmit Trigger

c. In the function code you can do whatever is needed to full-fill the business requirement . What I have done is got the responses from the Form (Using the Form ID, that you can get from the top part of a GoogleForm URL in edit mode), using data in that response ,I push a post to my Glip team based on the WebHook endpoint for my team(saved earlier). I also attach a link to a spreadsheet where the FormData is actually pushed so that , receivers of the Glip notification can click on the actual Spreadsheet and view more details if the notification interests them.

Sample Code

function onFormSubmit(e) {
var url = "WebHook URL";
    //var sandbox_url ="WebHook URL";
var responses = ' ';
// Open a form by ID and log the responses to each question.
    var form = FormApp.openById('<FormID>'); // https://docs.google.com/forms/d/FormID/edit
    var formResponses = form.getResponses();
var formResponse = formResponses[formResponses.length - 1];
    var itemResponses = formResponse.getItemResponses();
    var customerNameresponse = itemResponses[0];
    var mrrresponse = itemResponses[2];
    responses = responses + customerNameresponse.getResponse();
var data = {
        "icon": "<Icon.png>",
        "activity": "YYYYYYYY",
        "title": "YYYYYYYY",
        "body": "Subject..... " + responses + " , Link : https://docs.google.com/spreadsheets/d/<Google SpreadsheetID>/edit?usp=sharing"
    }
    var options = {
        "method": "post",
        "headers": {
            "Content-Type": "application/json"
        },
        "payload": JSON.stringify(data)
    };
    var response = UrlFetchApp.fetch(url, options);
}

GitHub: https://github.com/dibyenduroy/GoogleForm-Glip-Integration/blob/master/Code.gs

And thats all you need, you are now well set to make use of the Google Form to Glip integration.

Next Steps

To learn more about Glip visit : https://glip.com/

Please feel free to leave your comments and questions.