Is there a way to call an external API Endpoint on Google Forms every time the form is filled out?
3 Answers
First: you'll need to set up your App script project and you'll do that by:
Visit script.google.com to open the script editor. (You'll need to be signed in to your Google account.) If this is the first time you've been to script.google.com, you'll be redirected to a page that introduces Apps Script. Click Start Scripting to proceed to the script editor. A welcome screen will ask what kind of script you want to create. Click Blank Project or Close. Delete any code in the script editor and paste in the code below. This video and the doc will help
Second you'll need to create an installable trigger, you can add it to the form directly or to the spreadsheet that has the responses
function setUpTrigger(){
ScriptApp.newTrigger('sendPostRequest') /* this has the name of the function that will have the post request */
.forForm('formkey') // you'll find it in the url
.onFormSubmit()
.create();
}
Check the doc
Third create the sendPostRequest function and add the UrlFetchApp to it
function sendPostRequest(e){
// Make a POST request with form data.
var resumeBlob = Utilities.newBlob('Hire me!', 'text/plain', 'resume.txt');
var formData = {
'name': 'Bob Smith',
'email': 'bob@example.com',
'resume': resumeBlob
};
// Because payload is a JavaScript object, it is interpreted as
// as form data. (No need to specify contentType; it automatically
// defaults to either 'application/x-www-form-urlencoded'
// or 'multipart/form-data')
var options = {
'method' : 'post',
'payload' : formData
};
UrlFetchApp.fetch('https://httpbin.org/post', options);
}
Check the doc
Try something like this in your app script:
var POST_URL = "enter your webhook URL";
function onSubmit(e) {
var form = FormApp.getActiveForm();
var allResponses = form.getResponses();
var latestResponse = allResponses[allResponses.length - 1];
var response = latestResponse.getItemResponses();
var payload = {};
for (var i = 0; i < response.length; i++) {
var question = response[i].getItem().getTitle();
var answer = response[i].getResponse();
payload[question] = answer;
}
var options = {
"method": "post",
"contentType": "application/json",
"payload": JSON.stringify(payload)
};
UrlFetchApp.fetch(POST_URL, options);
};
Be sure to replace the POST_URL variable with your webhook, you can use requestcatcher.com to test this out.
Add a trigger to the script by clicking "Triggers" in the side menu
- Open the menu (top-right dots)
- Click in
Script Editor
- Paste the above code (changing the POST_URL)
- Click in the
clock
icon (left-side menu), which meansTriggers
. - On the right-bottom corner, click in the blue
Add trigger
button (a form will show as the image below). - It should show
onSubmit
underChoose which function to run
. - Make sure
Select event type
is set asOn form submit
. - Click
Save
button.
After that, submit your form and watch for the request to come in.
-
2It was quick and effective. I updated the steps to follow. Not sure if these were outdated (although it was answered few weeks ago), but Google Forms didn't have
Triggers
in the side menu (as previously explained). Thanks for the solution!– lepeMay 14, 2022 at 3:48 -
This is pretty straightforward with Google Scripts.
Just create a new project bound to your spreadsheet and create 2 elements:
- A function that will contain all relevant data to make the call (see docs for making a HTTP request from Google Apps Script)
- A trigger linked to the spreadsheet. You can set it to run each time an edit occurs or form is submitted
Voilà, your sheet will call whatever endpoint you wish on submission. You can even parse the spreadsheet to return that data to your endpoint