»
Webhooks
Webhooks
What Are Webhooks?
Webhooks are a powerful tool that allows you to receive notifications about specific events or actions without the need for periodic API calls. By subscribing to webhooks, you can automate your app’s operations and trigger custom actions based on these events. For example, you can use webhooks to receive notifications when a customer adds a product to their cart or creates a new order. By subscribing to these webhooks, you can easily stay informed and execute your own code based on these actions.
Registering Webhooks
To register webhooks with WebCommander, you need to provide two pieces of information: the sourceUrl and the eventName. WebCommander will then trigger an action based on the specified event name and call the URL provided in the source URL. This URL can be one of your app’s endpoints where you have implemented the necessary code to handle the webhook and perform the desired operation.
Here is an example of how to register webhooks with WebCommander:
JSON
"webhooks": [
{
"sourceUrl": "https://yourapp.com/api/v1/cart/added-to-cart", // The url WebCommander will call when firing this hook
"eventName": "added-to-cart", // A webhook event name. Check Webhook list to find details
"renderScope": "", // Required for script tags
"accessType": "webhook" // A data access type to define which way your plugin collecting data.
}
],By leveraging webhooks, you can streamline your app’s processes, avoid unnecessary API calls, and enable real-time integration with external systems.
Installation
To register webhooks for a site using the /install endpoint in WebCommander, you’ll need to provide a list of event names and source URLs. Below is an example response format that illustrates how to set up webhooks:
JSON
{
"webhooks": [
{
"sourceUrl": "https://yourapp.com/api/v1/cart/added-to-cart",
"eventName": "added-to-cart",
"renderScope": "",
"accessType": "webhook"
}
],
"scriptTag": [
{
"sourceUrl": "https://yourapp.com/assets/js/script-tag.js",
"eventName": "",
"renderScope": "All",
"accessType": "scriptTag"
}
]
}Example
CSS
PHP
Python
Java
C#
curl --location 'https://yourapp.com/api/v1/cart/added-to-cart?uuid=F8A3-A88E-C6EF-B1CB' \
--header 'Content-Type: application/json' \
--data-raw '{
"hook_name": "added-to-cart",
"hook_Data": {
"cartItems": [
{
"firstName": "second",
"lastName": "Test",
"email": "test1fdsfe4@mailinator.com"
},
{
"eventId": "C60B89F8-3A90-4DED-937D-DD62867859E2",
"value": 27.5,
"items": [
{
"ProductID": "15",
"SKU": "PRODUCT-7E2BEE252B07",
"ProductName": "Vegetarian Pasta",
"Quantity": 1,
"ItemPrice": 27.5,
"RowTotal": 27.5,
"ProductURL": "http://localhost:1301/product/vegetarian-pasta-1",
"ImageURL": "http://localhost:8080resources/00000000/product/product-15//vegetarian-pasta.png"
}
]
}
]
}
}'<?php
$curl = curl_init();
curl_setopt_array($curl, array(
CURLOPT_URL => 'https://yourapp.com/api/v1/cart/added-to-cart?uuid=F8A3-A88E-C6EF-B1CB',
CURLOPT_RETURNTRANSFER => true,
CURLOPT_ENCODING => '',
CURLOPT_MAXREDIRS => 10,
CURLOPT_TIMEOUT => 0,
CURLOPT_FOLLOWLOCATION => true,
CURLOPT_HTTP_VERSION => CURL_HTTP_VERSION_1_1,
CURLOPT_CUSTOMREQUEST => 'POST',
CURLOPT_POSTFIELDS =>'{
"hook_name": "added-to-cart",
"hook_Data": {
"cartItems": [
{
"firstName": "second",
"lastName": "Test",
"email": "test1fdsfe4@mailinator.com"
},
{
"eventId": "C60B89F8-3A90-4DED-937D-DD62867859E2",
"value": 27.5,
"items": [
{
"ProductID": "15",
"SKU": "PRODUCT-7E2BEE252B07",
"ProductName": "Vegetarian Pasta",
"Quantity": 1,
"ItemPrice": 27.5,
"RowTotal": 27.5,
"ProductURL": "http://localhost:1301/product/vegetarian-pasta-1",
"ImageURL": "http://localhost:8080resources/00000000/product/product-15//vegetarian-pasta.png"
}
]
}
]
}
}',
CURLOPT_HTTPHEADER => array(
'Content-Type: application/json'
),
));
$response = curl_exec($curl);
curl_close($curl);
echo $response;import http.client
import json
conn = http.client.HTTPSConnection("yourapp.com")
payload = json.dumps({
"hook_name": "added-to-cart",
"hook_Data": {
"cartItems": [
{
"firstName": "second",
"lastName": "Test",
"email": "test1fdsfe4@mailinator.com"
},
{
"eventId": "C60B89F8-3A90-4DED-937D-DD62867859E2",
"value": 27.5,
"items": [
{
"ProductID": "15",
"SKU": "PRODUCT-7E2BEE252B07",
"ProductName": "Vegetarian Pasta",
"Quantity": 1,
"ItemPrice": 27.5,
"RowTotal": 27.5,
"ProductURL": "http://localhost:1301/product/vegetarian-pasta-1",
"ImageURL": "http://localhost:8080resources/00000000/product/product-15//vegetarian-pasta.png"
}
]
}
]
}
})
headers = {
'Content-Type': 'application/json'
}
conn.request("POST", "/api/v1/cart/added-to-cart?uuid=F8A3-A88E-C6EF-B1CB", payload, headers)
res = conn.getresponse()
data = res.read()
print(data.decode("utf-8"))Unirest.setTimeouts(0, 0);
HttpResponse<String> response = Unirest.post("https://yourapp.com/api/v1/cart/added-to-cart?uuid=F8A3-A88E-C6EF-B1CB")
.header("Content-Type", "application/json")
.body("{\r\n \"hook_name\": \"added-to-cart\",\r\n \"hook_Data\": {\r\n \"cartItems\": [\r\n {\r\n \"firstName\": \"second\",\r\n \"lastName\": \"Test\",\r\n \"email\": \"test1fdsfe4@mailinator.com\"\r\n },\r\n {\r\n \"eventId\": \"C60B89F8-3A90-4DED-937D-DD62867859E2\",\r\n \"value\": 27.5,\r\n \"items\": [\r\n {\r\n \"ProductID\": \"15\",\r\n \"SKU\": \"PRODUCT-7E2BEE252B07\",\r\n \"ProductName\": \"Vegetarian Pasta\",\r\n \"Quantity\": 1,\r\n \"ItemPrice\": 27.5,\r\n \"RowTotal\": 27.5,\r\n \"ProductURL\": \"http://localhost:1301/product/vegetarian-pasta-1\",\r\n \"ImageURL\": \"http://localhost:8080resources/00000000/product/product-15//vegetarian-pasta.png\"\r\n }\r\n ]\r\n }\r\n ]\r\n }\r\n}")
.asString();var options = new RestClientOptions("")
{
MaxTimeout = -1,
};
var client = new RestClient(options);
var request = new RestRequest("https://yourapp.com/api/v1/cart/added-to-cart?uuid=F8A3-A88E-C6EF-B1CB", Method.Post);
request.AddHeader("Content-Type", "application/json");
var body = @"{
" + "\n" +
@" ""hook_name"": ""added-to-cart"",
" + "\n" +
@" ""hook_Data"": {
" + "\n" +
@" ""cartItems"": [
" + "\n" +
@" {
" + "\n" +
@" ""firstName"": ""second"",
" + "\n" +
@" ""lastName"": ""Test"",
" + "\n" +
@" ""email"": ""test1fdsfe4@mailinator.com""
" + "\n" +
@" },
" + "\n" +
@" {
" + "\n" +
@" ""eventId"": ""C60B89F8-3A90-4DED-937D-DD62867859E2"",
" + "\n" +
@" ""value"": 27.5,
" + "\n" +
@" ""items"": [
" + "\n" +
@" {
" + "\n" +
@" ""ProductID"": ""15"",
" + "\n" +
@" ""SKU"": ""PRODUCT-7E2BEE252B07"",
" + "\n" +
@" ""ProductName"": ""Vegetarian Pasta"",
" + "\n" +
@" ""Quantity"": 1,
" + "\n" +
@" ""ItemPrice"": 27.5,
" + "\n" +
@" ""RowTotal"": 27.5,
" + "\n" +
@" ""ProductURL"": ""http://localhost:1301/product/vegetarian-pasta-1"",
" + "\n" +
@" ""ImageURL"": ""http://localhost:8080resources/00000000/product/product-15//vegetarian-pasta.png""
" + "\n" +
@" }
" + "\n" +
@" ]
" + "\n" +
@" }
" + "\n" +
@" ]
" + "\n" +
@" }
" + "\n" +
@"}";
request.AddStringBody(body, DataFormat.Json);
RestResponse response = await client.ExecuteAsync(request);
Console.WriteLine(response.Content);Hook Parameter
Hook parameters are the set of data that WebCommander will send you with the Hook name and the data related to the fired hook. Example:
JSON
{
"hook_name": "added-to-cart",
"hook_Data": {
// Check Webhooks list for sample hook data
}
}