# Front Webhooks

## When to Use This Skill

* Setting up Front (Frontapp) application webhook handlers
* Debugging Front `X-Front-Signature` verification failures
* Responding to the Front `X-Front-Challenge` subscription validation request
* Understanding Front event types (`inbound_received`, `outbound_sent`, `conversation_moved`, `assignee_changed`, `tag_added`, `new_comment_added`) and payloads

## Verification (core)

Front application webhooks have no official server SDK, so verify manually.
Front signs `X-Front-Request-Timestamp + ":" + rawBody` with HMAC-SHA256 (key = your
app's signing key), base64-encoded, delivered in the `X-Front-Signature` header. Use the
raw request body — never `JSON.parse` before verifying.

```javascript
const crypto = require('crypto');

function verifyFrontSignature(rawBody, timestamp, signature, secret) {
  const hmac = crypto.createHmac('sha256', secret);
  hmac.update(timestamp + ':');
  hmac.update(rawBody);                          // Buffer/string of the raw HTTP body
  const expected = hmac.digest('base64');
  try {
    return crypto.timingSafeEqual(Buffer.from(signature), Buffer.from(expected));
  } catch {
    return false;                                // length mismatch = invalid
  }
}

```

On subscription, Front first sends a validation request carrying an `X-Front-Challenge`
header. Reply within 10s with HTTP 200 echoing the value — `{"challenge": "<value>"}`
(JSON), `challenge=<value>` (form), or the raw value (text/plain).

> For complete handlers with the challenge handshake, event dispatch, and tests, see:
> 
> * [examples/express/](https://github.com/hookdeck/webhook-skills/tree/main/skills/frontapp-webhooks/examples/express/)
> * [examples/nextjs/](https://github.com/hookdeck/webhook-skills/tree/main/skills/frontapp-webhooks/examples/nextjs/)
> * [examples/fastapi/](https://github.com/hookdeck/webhook-skills/tree/main/skills/frontapp-webhooks/examples/fastapi/)

## Common Event Types

Front webhook payloads carry the event name in the top-level `type` field.

| Event `type` | Triggered When |
| --- | --- |
| `inbound_received` | Inbound message received |
| `outbound_sent` | Outbound message sent |
| `conversation_moved` | Conversation moved to another inbox |
| `message_delivery_failed` | Outbound message bounced / delivery failed |
| `conversation_archived` | Conversation archived |
| `conversation_reopened` | Conversation reopened |
| `conversation_deleted` | Conversation deleted |
| `conversation_restored` | Conversation restored |
| `conversation_snoozed` | Conversation snoozed |
| `conversation_snooze_expired` | Snooze expired |
| `new_comment_added` | Comment added to a conversation |
| `assignee_changed` | Assignee changed |
| `tag_added` | Tag added to a conversation |
| `tag_removed` | Tag removed from a conversation |
| `link_added` | Link added to a conversation |
| `link_removed` | Link removed from a conversation |

> For the full event reference, see [Front Events](https://dev.frontapp.com/reference/events).

## Environment Variables

```bash
FRONT_WEBHOOK_SECRET=your_app_signing_key   # App signing key from the Front app settings

```

## Local Development

```bash
# Start tunnel (no account needed)
npx hookdeck-cli listen 3000 frontapp --path /webhooks/frontapp

```

## Reference Materials

* [references/overview.md](https://github.com/hookdeck/webhook-skills/blob/main/skills/frontapp-webhooks/references/overview.md) - Front webhook concepts and common events
* [references/setup.md](https://github.com/hookdeck/webhook-skills/blob/main/skills/frontapp-webhooks/references/setup.md) - Configure webhooks in Front, get the signing key
* [references/verification.md](https://github.com/hookdeck/webhook-skills/blob/main/skills/frontapp-webhooks/references/verification.md) - Signature verification and challenge details