## API prehook setup

Subscribing to prehook events is done in 3 simple steps:

### Step 1: Create a prehook event

Open the **Frontegg portal**, then navigate to [ENVIRONMENT] ➜ Configurations ➜ Prehooks.

- Click the **Create Prehook** button.


br
![test](/assets/prehook-dashboard.5085066ae9f0a1fd1267a3bdc077935bc6d4601791eac53b263a7f2b456e7ec5.97d793c5.png)

### Step 2: Enter prehook details

The next step would be to set your prehook information, and choose your prehook type. The Code type will indicate if the prehook is either an API or a [custom prehook](/ciam/guides/integrations/custom-code).

- Select a triggering event for your prehook.
- Insert your preferred display name and description.
- The URL should be the address where you will receive the prehook data. The URL acts as an address where Frontegg sends a JSON message when the assigned event happens.
- For the secret key, enter a value that is confidential (see note).


br
![test](/assets/create-a-prehook.238fa1c391fe4e09be5ed06bb8319b757fca7bbd0ed1806c29ae2d53bec04640.97d793c5.png)

#### Secret key

Frontegg generates a header called `x-webhook-secret` and signs the prehook request using the secret.
For enhanced security, Frontegg recommends that you use the prehook secret.

To verify the hook's signature using the `x-webhook-secret` header, you should use a method from your backend library. For Node.js, you could use the following function:


```javascript
jwt.verify(<x-webhook-secret-value>, <the secret in the dashboard on hook settings>)
```

### Step 3: Test your prehook

To finalize your hook creation, test your prehook to verify everything was setup correctly.

Click the run test button and then await the response— You should see the prehook data received and the response Frontegg expects from your application. If the response is valid, your prehook is ready to go, and you can enable it.

Error field
Note that the expected data includes error. The `error` field is required in your response to Frontegg only if you set `continue` to false. Also, you must set the error `status` between 400 and 499.

### Working with prehook events

You may want to adjust the configuration of prehooks when subscribing. Read on to learn how to work with prehook events.

### JWT custom claims

If you want to customize the data encoded by the JWT, you need to subscribe to a prehook event for *JWT Generation*. This will allow you to intercept the JWT and customize the JWT claims.

br
Customizing JWT claims
The JWT will contain the default data unless you customize the JWT claims and add your custom claims using the JWT prehook

br
For JWT Generation prehook, Frontegg sends a new prehook event every time the hosting application requests a new JWT.

The prehook event sent to the hosting application contains whatever data Frontegg has stored for each claim in the table below.

| Key | Value |
|  --- | --- |
| sub | string |
| tenantId | string |
| roles | string [] |
| permissions | string [] |
| metadata | Record <string, any> |
| type | userToken |


To add to the default claims, include the data that you want to change in your prehook response.

You can include the following claims in your prehook response, note that `tenantId` and `permissions` cannot be overriden:

| Key | Value |
|  --- | --- |
| tenantId | string |
| permissions | string [] |
| customClaims | Record <string, unknown> |


After customizing your JWT claims, you can test your hook:

![test](/assets/jwt-hook.94cf18a34e6ba392fbbbdb9b975526b09f3146164a8417f62f303bcfd15c3dd1.97d793c5.png)

br
## Single prehook view

After testing and creating your prehook, you can view and adjust its settings. Each prehook has a **Logs** tab where you can see the triggered events associated with that prehook. Note that you can't change the **Trigger event** for [custom prehooks](/ciam/guides/integrations/custom-code) after the connection is initiated.

br
![test](/assets/hook-settings-view-1.b4faaef849d513e4974b23f43911b60f8971bc3363be31857fc8dc4ae2c3b27e.97d793c5.png)

br
![test](/assets/hook-settings-view-2.1c9e8cf27fc3c0c01c44c49536008e1693974ca14c50d3ed5ee271d281a2bef4.97d793c5.png)

br