Skip to main content

Hey, is it possible to create some Action Buttons to push webhooks with json data with the scripting block?



Yes. Here’s an example that does this. It targets a web service in Google Cloud Platform, but could easily target any webhook endpoint as long as it is CORS-enabled.



//

// http post test (from GCP)

//

output.markdown('## HTTP POST Test (from GCP)');



let payload = {

"field" : "name",

"value" : "Bill Frenchy"

}



let postOptions = {

method: "post",

headers: {

'Accept' : 'application/json',

},

body: JSON.stringify(payload)

}



const postResults = await fetch(gcpUrl, postOptions);

const jsonPost = await postResults.json();



output.markdown("Display JSON Object");

output.inspect(jsonPost);

output.markdown(jsonPost.field + " = " + jsonPost.value);



Yes. Here’s an example that does this. It targets a web service in Google Cloud Platform, but could easily target any webhook endpoint as long as it is CORS-enabled.



//

// http post test (from GCP)

//

output.markdown('## HTTP POST Test (from GCP)');



let payload = {

"field" : "name",

"value" : "Bill Frenchy"

}



let postOptions = {

method: "post",

headers: {

'Accept' : 'application/json',

},

body: JSON.stringify(payload)

}



const postResults = await fetch(gcpUrl, postOptions);

const jsonPost = await postResults.json();



output.markdown("Display JSON Object");

output.inspect(jsonPost);

output.markdown(jsonPost.field + " = " + jsonPost.value);

Excuse my ignorance, but how is this script triggered?


Is there an “Action Button” functionality in Airtable that I’m not aware of?


Excuse my ignorance, but how is this script triggered?


Is there an “Action Button” functionality in Airtable that I’m not aware of?




Run button in Script Blocks.




Run button in Script Blocks.


:man_facepalming: of course… thanks!


Any idea how to alter this script to work with a Zapier or Integromat webhook? Been having a go but had no luck.



Trying to get all or a select few record fields included in the payload too…


Welcome to the community, @Jonny_Matthews! :grinning_face_with_big_eyes: I’ve got this working with an Integromat webhook, though I’m only passing the record ID and letting an Airtable “Retrieve a record” module in the scenario pull the rest of the data I need, but you could send over as much or as little as you want. Here’s what I’ve got, stripped down to just the basics:



let url = "https://hook.integromat.com/xxxxxxxxxxxxxxxxxxxxx?recordID=";

let table = base.getTable("Invoices");

let view = table.getView("Outstanding: Actions");



let record = await input.recordAsync("Pick a record", view);

await fetch(url + record.id);



When I click the button on an invoice record, it’s fed into the script, and the webhook is called with the ID included. Again, you can add more to the payload as you wish.


@Justin_Barrett


how would I go about attaching field contents to that? I’ve tried a couple of different things to no avail


@Justin_Barrett


how would I go about attaching field contents to that? I’ve tried a couple of different things to no avail




Without seeing precisely what you’re trying to do, I can suggest that …





  1. Field values needed by the webhook must be collected by the Script Block;


  2. Then passed to the webhook in some manner (either as URL parameters or as data).




#1 is achieved by adding to the script the necessary code to get the values of the record by the record ID. #2 is achieved by modifying the fetch() call with additional parameters on the URL variable.


Welcome to the community, @Jonny_Matthews! :grinning_face_with_big_eyes: I’ve got this working with an Integromat webhook, though I’m only passing the record ID and letting an Airtable “Retrieve a record” module in the scenario pull the rest of the data I need, but you could send over as much or as little as you want. Here’s what I’ve got, stripped down to just the basics:



let url = "https://hook.integromat.com/xxxxxxxxxxxxxxxxxxxxx?recordID=";

let table = base.getTable("Invoices");

let view = table.getView("Outstanding: Actions");



let record = await input.recordAsync("Pick a record", view);

await fetch(url + record.id);



When I click the button on an invoice record, it’s fed into the script, and the webhook is called with the ID included. Again, you can add more to the payload as you wish.


Thanks for this Justin!



It works like a charm. When I press the button the blocks dashboard opens, is there any way to have this running in the background with seeing the blocks every time the script runs?


Thanks for this Justin!



It works like a charm. When I press the button the blocks dashboard opens, is there any way to have this running in the background with seeing the blocks every time the script runs?


It’s not currently possible to prevent the Blocks sidebar from opening when using this method. It’s a highly-requested modification, though. Several users (myself included) have asked for this in various threads. I can’t find a single request thread for this change, but it couldn’t hurt to write to Airtable support directly and let them know.


Thanks for this Justin!



It works like a charm. When I press the button the blocks dashboard opens, is there any way to have this running in the background with seeing the blocks every time the script runs?




Well, I believe you could eliminate the button and use a script action (see beta offering) to invoke the script silently. A few caveats…





  1. The script block would need to be converted to a script action. There may be aspects of your script block that would rule this idea out.


  2. The trigger for this would require that the record flow into a view and then be removed from that view upon completion of the script process.





Yes. Here’s an example that does this. It targets a web service in Google Cloud Platform, but could easily target any webhook endpoint as long as it is CORS-enabled.



//

// http post test (from GCP)

//

output.markdown('## HTTP POST Test (from GCP)');



let payload = {

"field" : "name",

"value" : "Bill Frenchy"

}



let postOptions = {

method: "post",

headers: {

'Accept' : 'application/json',

},

body: JSON.stringify(payload)

}



const postResults = await fetch(gcpUrl, postOptions);

const jsonPost = await postResults.json();



output.markdown("Display JSON Object");

output.inspect(jsonPost);

output.markdown(jsonPost.field + " = " + jsonPost.value);

Great! but im having an issue, how do i use a variable inside the payload ?



thanks in advance


Great! but im having an issue, how do i use a variable inside the payload ?



thanks in advance


There have been significant updates to Airtable’s automation system since the earlier part of our conversation. Could you share more details about what you’re trying to achieve? We can give you more accurate guidance that way.


There have been significant updates to Airtable’s automation system since the earlier part of our conversation. Could you share more details about what you’re trying to achieve? We can give you more accurate guidance that way.


I tried this script and work fine with a string value, but i want that everytime I click on the button I could get all the info from a specific row (id)



let url = “URL_ENDPOINT”;


let table = base.getTable(“Sorteo”);


let view = table.getView(“vista”);


let record = await input.recordAsync(“Pick a record”, view);



let payload = {


“set_variables”:“record”,


“set_variables_values”: “i need here the value of a record”,


}



let postOptions = {


method: “post”,


headers: {


‘Accept’ : ‘application/json’,


},


body: JSON.stringify(payload)


}


const postResults = await fetch(url, postOptions);


const jsonPost = postResults.json();


let id = (jsonPost.field + " = " + jsonPost.value);


I tried this script and work fine with a string value, but i want that everytime I click on the button I could get all the info from a specific row (id)



let url = “URL_ENDPOINT”;


let table = base.getTable(“Sorteo”);


let view = table.getView(“vista”);


let record = await input.recordAsync(“Pick a record”, view);



let payload = {


“set_variables”:“record”,


“set_variables_values”: “i need here the value of a record”,


}



let postOptions = {


method: “post”,


headers: {


‘Accept’ : ‘application/json’,


},


body: JSON.stringify(payload)


}


const postResults = await fetch(url, postOptions);


const jsonPost = postResults.json();


let id = (jsonPost.field + " = " + jsonPost.value);




You’ll need to add lines to your script to get those values, then insert them into the payload variable. Each field’s value must be collected separately using either the getCellValue or getCellValueAsString methods. For example, if you have a {First Name} field, the line to collect its value would look like this:



let firstName = record.getCellValue("First Name")



How you add the collected field values to your payload object will depend on the JSON structure required by the API you’re calling.


Welcome to the community, @Jonny_Matthews! :grinning_face_with_big_eyes: I’ve got this working with an Integromat webhook, though I’m only passing the record ID and letting an Airtable “Retrieve a record” module in the scenario pull the rest of the data I need, but you could send over as much or as little as you want. Here’s what I’ve got, stripped down to just the basics:



let url = "https://hook.integromat.com/xxxxxxxxxxxxxxxxxxxxx?recordID=";

let table = base.getTable("Invoices");

let view = table.getView("Outstanding: Actions");



let record = await input.recordAsync("Pick a record", view);

await fetch(url + record.id);



When I click the button on an invoice record, it’s fed into the script, and the webhook is called with the ID included. Again, you can add more to the payload as you wish.


Hi, How are you thinking about security here? Is there a way to store secrets for calling the api without exposing them on the JavaScript/html of the client?



Is there a way to tell air table to invoke (server side) the service on your behalf, injecting secrets server side rather than invoking client side?



Thanks


Hi, How are you thinking about security here? Is there a way to store secrets for calling the api without exposing them on the JavaScript/html of the client?



Is there a way to tell air table to invoke (server side) the service on your behalf, injecting secrets server side rather than invoking client side?



Thanks


The example I gave earlier is part of a system that has only one user: me. It’s admittedly pretty sparse on the security side because only I have access to the data and accounts. For situations where security is a greater concern, it’s probably not the best. My understanding of how to handle security in those situations is slim, but On2Air: Storage—part of the On2Air series of products by @openside—is specifically designed to work with Airtable for the purpose of securing storing data needed by Airtable scripts. It’s definitely worth investigating.


The example I gave earlier is part of a system that has only one user: me. It’s admittedly pretty sparse on the security side because only I have access to the data and accounts. For situations where security is a greater concern, it’s probably not the best. My understanding of how to handle security in those situations is slim, but On2Air: Storage—part of the On2Air series of products by @openside—is specifically designed to work with Airtable for the purpose of securing storing data needed by Airtable scripts. It’s definitely worth investigating.


Thanks. Very interesting, I’ll check them out.


Welcome to the community, @Jonny_Matthews! :grinning_face_with_big_eyes: I’ve got this working with an Integromat webhook, though I’m only passing the record ID and letting an Airtable “Retrieve a record” module in the scenario pull the rest of the data I need, but you could send over as much or as little as you want. Here’s what I’ve got, stripped down to just the basics:



let url = "https://hook.integromat.com/xxxxxxxxxxxxxxxxxxxxx?recordID=";

let table = base.getTable("Invoices");

let view = table.getView("Outstanding: Actions");



let record = await input.recordAsync("Pick a record", view);

await fetch(url + record.id);



When I click the button on an invoice record, it’s fed into the script, and the webhook is called with the ID included. Again, you can add more to the payload as you wish.


Hi Justin,



thanks for your example.


I’m using it in a Test Base. In that base i have a button which starts the script.


I was expecting that the script runs automaticly and the record id pushed to integromat.


But if i click the button i need to select a record first in the script. Only after i’ve done that manually the script sends the data to integromat.



Am i making something wrong here or do i miss something?



Thanks for your help.



Here is the link to the test base: Airtable - Webhook Integromat (Test)



Have a nice weekend.



Kai


Hi Justin,



thanks for your example.


I’m using it in a Test Base. In that base i have a button which starts the script.


I was expecting that the script runs automaticly and the record id pushed to integromat.


But if i click the button i need to select a record first in the script. Only after i’ve done that manually the script sends the data to integromat.



Am i making something wrong here or do i miss something?



Thanks for your help.



Here is the link to the test base: Airtable - Webhook Integromat (Test)



Have a nice weekend.



Kai




Since the button is an object in the record, clicking the button is tantamount to selecting the record. If the script is properly designed, you should not have to first select the record and then click the button.





If this were the case, why is there a button, a control that requires the user to invoke its connected actions?



If you want this to be magically automated, at the very least you should be using a script automation (which is designed to run automatically), not a script block (which requires manual invocation).



And given that this data is to be sent to Integromate anyway, why not eliminate all this script stuff and simply instrument Integromat to pull the data from these Airtable records when conditions warrant? I think @ScottWorld would agree - lacking more details, you appear to be going around the barn twice to get to the door.




Since the button is an object in the record, clicking the button is tantamount to selecting the record. If the script is properly designed, you should not have to first select the record and then click the button.





If this were the case, why is there a button, a control that requires the user to invoke its connected actions?



If you want this to be magically automated, at the very least you should be using a script automation (which is designed to run automatically), not a script block (which requires manual invocation).



And given that this data is to be sent to Integromate anyway, why not eliminate all this script stuff and simply instrument Integromat to pull the data from these Airtable records when conditions warrant? I think @ScottWorld would agree - lacking more details, you appear to be going around the barn twice to get to the door.


@Bill.French is correct, as always!



@Kai_Dickas All you need to do is click once on your button to send your Record ID to Integromat, and then continue your automation from there.



You simply add the record ID as a parameter to the end of your webhook URL.


@Bill.French is correct, as always!



@Kai_Dickas All you need to do is click once on your button to send your Record ID to Integromat, and then continue your automation from there.



You simply add the record ID as a parameter to the end of your webhook URL.




@ScottWorld - Kai’s complaint is the very existence of the button itself; would rather have it all automated as near as I can tell from the message.




@ScottWorld - Kai’s complaint is the very existence of the button itself; would rather have it all automated as near as I can tell from the message.


Oh, I see, then that can be automated through a script in an Airtable automation, that could be triggered by any matching condition.


Oh, I see, then that can be automated through a script in an Airtable automation, that could be triggered by any matching condition.




Once again - no. :winking_face:





… i have a button which starts the script. I was expecting that the script runs automaticly and the record id pushed to integromat.





The button/script – as I understand it - sends data to Integromat when conditions warrant. What’s wrong with that picture?



The button, the script, and the process in Airtable should be entirely eliminated because Integromat is fully capable of (a) detecting the conditions, and (b) acquiring any data it needs to do whatever @Kai_Dickas needs to accomplish in Integromat.




Once again - no. :winking_face:





… i have a button which starts the script. I was expecting that the script runs automaticly and the record id pushed to integromat.





The button/script – as I understand it - sends data to Integromat when conditions warrant. What’s wrong with that picture?



The button, the script, and the process in Airtable should be entirely eliminated because Integromat is fully capable of (a) detecting the conditions, and (b) acquiring any data it needs to do whatever @Kai_Dickas needs to accomplish in Integromat.


@Bill.French, once again, there are many different ways that he can accomplish his goal. Button, no button, script, no script. It’s all good.


Reply