Webhooks overview

#Overview

This document shares general information about the use of webhooks with Hygraph, such as configuring webhooks, viewing logs, and editing or deleting webhooks.

#Configure webhooks

To configure webhooks, follow these steps:

Gatsby webhook example - Headers

1. In Your Hygraph Project, go to Webhooks and click + Add webhook, located in the top-right corner of the screen. If your project has no webhooks configured yet, you can also click on the +Add Webhook button at the center of the screen.
2. The Add webhook screen will display. Complete the following information:
   • Name: Name for your webhook.
   • Description: Description for your webhook. Optional field.
   • Include payload: Select this checkbox to allow applications to send and receive data packets.
   • Method: Dropdown menu that allows you to select an HTTP method from a list. You can select POST, DELETE, GET or PUT.
   • URL: Webhook URL. This is information that you will get from the connected app. Please check the corresponding guide for specific information about this.
   • Secret key: You can optionally add a secret key to sign the payload of your webhook. The secret key allows the other end to check that the source is genuine. You can use this to verify requests and, for instance, avoid triggering deploys from unknown sources.
   • Triggers: This is where you select which Models, Stages, Actions and Sources should trigger your webhook. Each item has a dropdown menu, where you can select one or more options. Selecting none acts as a wildcard, then all models will trigger the webhook. If you're a developer, this document contains some more information on triggers that might be useful to you.
   • Headers: Here you can configure your headers by adding additional Key and Value data, then clicking + Add. You can add multiple key-value sets, and you can delete the ones you added by selecting the Remove option in the context menu. Some endpoints require authentication using API Keys, which could be set here. Gatsby webhook example - Headers

#View webhook logs

View webhook logs

In your Hygraph project, navigate to Webhooks and click on the View logs link of the webhook you want to examine. The logs screen will display as a result. This screen allows you to monitor the recent activity of your webhook from the last 7 days.

Clicking on a log item displays its details:

Gatsby webhook example - Log details

#Disable or enable a webhook

Webhook status

You can see whether a webhook is set to Active or Inactive next to its name on the webhook card.

Disable a webhook

To disable or enable a webhook, use the context menu and select Pause / Resume.

#Edit or delete a webhook

Gatsby webhook example - Edit and delete icons

Click on the context menu and select Delete to delete the webhook, or on Edit at the top-right corner of the card to edit its details. You can learn more about each of the fields you can edit here.