# 14.3 Create and configure a custom webhook

## 14.3.1 Create your custom webhook

Go to <https://webhook.site/>. You'll see something like this:

![demo](/files/b7ZrltCcZSATEtx7GbwV)

You'll see your unique URL, which looks like this: `https://webhook.site/585126a1-41fc-4721-864b-d4aa8c268a1d`.

This website has now created this webhook for you, and you'll be able to configure this webhook in your **\[Event Forwarding property]** to start testing the forwarding of events.

## 14.3.2 Update your Event Forwarding property: Create a Data Element

Go to <https://experience.adobe.com/#/data-collection/> and go to **Event Forwarding**. Search your Event Forwarding property and click it to open it.

![Adobe Experience Platform Data Collection SSF](/files/gb7k9gmyCzYFojKwXoHl)

In the left menu, go to **Data Elements**. Click **Create New Data Element**.

![Adobe Experience Platform Data Collection SSF](/files/H3aGUgU9XTEzpIovtwyS)

You'll then see a new data element to configure.

![Adobe Experience Platform Data Collection SSF](/files/1TQxAWFGkOpEVgMYIWJQ)

Make the following selection:

* As the **Name**, enter **XDM Event**.
* As the **Extension**, select **Core**.
* As the **Data Element Type**, select **Path**.
* As the **Path**, enter **arc.event.xdm**. By entering this path, you'll be filtering out the **XDM** section from the event payload that is sent by the website or mobile app into the Adobe Edge.

You'll now have this. Click **Save**.

![Adobe Experience Platform Data Collection SSF](/files/jguNrvWAxrnvOpnFpbr9)

{% hint style="info" %}
In the above path, a reference is made to **arc**. **arc** stands for Adobe Resource Context and **arc** always stands for the highest available object that is available in the Server Side context. Enrichments and transformations may be added to that **arc** object using Adobe Experience Platform Data Collection Server functions.

In the above path, a reference is made to **event**. **event** stands for a unique event and Adobe Experience Platform Data Collection Server will always evaluate every event individually. Sometimes, you may see a reference to **events** in the payload sent by Web SDK Client Side, but in Adobe Experience Platform Data Collection Server, every event is evaluated individually.
{% endhint %}

## 14.3.3 Update your Adobe Experience Platform Data Collection Server property: Create a Rule

In the left menu, go to **Rules**. Click **Create New Rule**.

![Adobe Experience Platform Data Collection SSF](/files/xTsaM1nKWwQGPS4T598k)

You'll then see a new rule to configure. Enter the **Name**: **All Pages**. For this exercise, you won't need to configure a condition. Instead, you'll setup an action. Click the **+ Add** button under **Actions**.

![Adobe Experience Platform Data Collection SSF](/files/M0zMrCg3InC4sE8Kp5WU)

You'll then see this. Make the following selection:

* Select the **Extension**: **Adobe Cloud Connector**.
* Select the **Action Type**: **Make Fetch Call**.

That should give you this **Name**: **Adobe Cloud Connector - Make Fetch Call**. You should now see this:

![Adobe Experience Platform Data Collection SSF](/files/wdxkNHqJHvo4wYOlZUep)

Next, configure the following:

* Change the request method from GET to **POST**
* Enter the URL of the custom webhook you created in one of the previous steps on the <https://webhook.site/> website, which looks like this: `https://webhook.site/585126a1-41fc-4721-864b-d4aa8c268a1d`

You should now have this. Next, go to **Body**.

![Adobe Experience Platform Data Collection SSF](/files/sqrLmj1rNbwmTKshroXl)

You'll then see this. Click the data element icon as indicated below.

![Adobe Experience Platform Data Collection SSF](/files/OK5OV3YebCqDOl9ZZCPQ)

In the popup, select the data element **XDM Event** which you created in the previous step. Click **Select**.

![Adobe Experience Platform Data Collection SSF](/files/gVq4oFFFkKJZGy71FJ7B)

You'll then see this. Click **Keep Changes**.

![Adobe Experience Platform Data Collection SSF](/files/MFLAWCAT4en8t5IQhNuP)

You'll then see this. Click **Save**.

![Adobe Experience Platform Data Collection SSF](/files/MJi5Rc26R9yzry7nSmsh)

You've now configured your first rule in an Event Forwarding property. Go to **Publishing Flow** to publish your changes. Open your Development library **Main** by clicking **Edit** as indicated.

![Adobe Experience Platform Data Collection SSF](/files/nNNe5TaT8xhCS1qMNYd6)

Click the **Add All Changed Resources** button, after which you'll see your Rule and Data Element appear in this library. Next, click **Save & Build for Development**. Your changes are now being deployed.

![Adobe Experience Platform Data Collection SSF](/files/zyL5BSYUEoqJAuYFVSwz)

After a couple of minutes, you'll see that the deployment is done and ready to be tested.

![Adobe Experience Platform Data Collection SSF](/files/7odahg3le4dEZFSymtsr)

## 14.3.4 Test your configuration

Go to <https://builder.adobedemo.com/projects>. After logging in with your Adobe ID, you'll see this. Click your website project to open it.

![DSN](/files/2TzcSZHZ9qjjaR5vTN1T)

You can now follow the below flow to access the website. Click **Integrations**.

![DSN](/files/teXfdE2QZAn32fKLccCX)

On the **Integrations** page, you need to select the Data Collection property that was created in exercise 0.1.

![DSN](/files/mkSIShNMSfogSSMiwcBk)

You'll then see your demo website open up. Select the URL and copy it to your clipboard.

![DSN](/files/W2n2RRLhlFySgNdfxucc)

Open a new incognito browser window.

![DSN](/files/zZEhiofOQTVr8McFoUHf)

Paste the URL of your demo website, which you copied in the previous step. You'll then be asked to login using your Adobe ID.

![DSN](/files/cA7f3IDNG2RAUwUQgCT4)

Select your account type and complete the login process.

![DSN](/files/7uNFgLBN1WDiFJBdl5mo)

You'll then see your website loaded in an incognito browser window. For every demonstration, you'll need to use a fresh, incognito browser window to load your demo website URL.

![DSN](/files/A2EDjBzPVin0IdMO2kKf)

When you open up your browser Developer View, you can inspect Network requests as indicated below. When you use the filter **interact**, you'll see the network requests that are sent by Adobe Experience Platform Data Collection Client to the Adobe Edge.

![Adobe Experience Platform Data Collection Setup](/files/6i9pouHYKPxqeiKSXRxH)

If you select the raw payload, go to <https://jsonformatter.org/json-pretty-print> and paste the payload. Click **Make Pretty**. You'll then see the JSON payload, the **events** object and the **xdm** object. In one of the previous steps, when you defined the Data Element, you used the reference **arc.event.xdm**, which will result in you parsing out the **xdm** object of this payload.

![Adobe Experience Platform Data Collection Setup](/files/P27sRLHJeXkLn5MJNRL9)

Switch your view to the website <https://webhook.site/> which you used in one of the previous steps. You should now have a view similar to this one, with network requests being shown in the left menu. You're seeing the **xdm** payload that was filter out of the network request that was shown above.

![Adobe Experience Platform Data Collection Setup](/files/beJ3HDrYGQqBIpujhRCC)

Scroll down a bit in the payload to find the page name, which in this case is **vangeluw-OCUC** (which is the project name of your demo website).

![Adobe Experience Platform Data Collection Setup](/files/z0KxYHiPr2u02c28eWcS)

If you now navigate across the website, you'll see additional network requests becoming available on this custom webhook in real-time.

![Adobe Experience Platform Data Collection Setup](/files/1BB1Z2L3f9tjR4uKCU1m)

You've now configured the Server Side Forwarding of Web SDK/XDM payloads to an external custom webhook. In the next exercises, you'll configure a similar approach, and you'll be sending that same data towards Google and AWS environments.


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.adobesandbox.com/comprehensive-technical-tutorial-archive/module14/ex3.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
