Créez votre premier webhook

Ce guide vous accompagne depuis une application vide jusqu'à la mise en place d'un workflow Shopify Flow qui s'exécute lorsque votre propre système le décide. Comptez environ dix minutes.

1. Créer un webhook

Webhooks -> Créer un webhook. La page vous demande tout d'abord ce qui déclenchera ce webhook, puis le configure en conséquence :

Votre réponse	Ce que vous obtenez
Un outil d'automatisation (n8n, Make, Zapier, votre propre code)	Un jeton généré, prêt à être collé dans l'outil
Un service qui signe ses webhooks (Stripe, GitHub, etc.)	Vérification de la signature pour le service que vous choisissez - consultez Vérification des webhooks signés
Un script de navigateur ou de boutique en ligne	CORS activé - voir CORS, l'URL du proxy de l'application et les requêtes du navigateur
Rien - lancez-le selon un calendrier défini	Un webhook qui récupère une URL à intervalles réguliers ; l'onglet « Planification » s'ouvre ensuite - voir Interrogation programmée d'URL
Autre chose, ou je déciderai plus tard	C'est vous qui choisissez le mode d'authentification

Donnez-lui un nom que vous reconnaîtrez plus tard (« Rappel carte de portefeuille », « Formulaire de contact ») et enregistrez. Chaque paramètre peut être modifié ultérieurement.

Vous disposez désormais d'une URL de webhook se terminant par un code court, par exemple https://.../webhook/ab12cd34. Cette URL correspond au point de terminaison vers lequel votre système envoie une requête POST.

La page « Créer un webhook » pose la question suivante : « Qu'est-ce qui déclenchera ce webhook ? », avec l'option « Rien - l'exécuter selon un calendrier » sélectionnée et une remarque indiquant que l'onglet « Calendrier » s'ouvrira ensuite — Pour créer un webhook, il faut d'abord déterminer ce qui va le déclencher. La réponse permet de configurer l'authentification correspondante ; l'option « Rien - l'exécuter selon un calendrier » ouvre ensuite l'onglet « Calendrier ».

L'éditeur de webhooks : le nom et l'authentification à gauche, la fiche « Endpoint » avec l'état, l'URL du webhook et l'identifiant du webhook à droite, au-dessus des boutons « Aperçu en direct », « Tester » et « Utilisation » — L'éditeur de webhooks. Les paramètres se trouvent à gauche ; la fiche « Endpoint » à droite contient l'URL du webhook à communiquer à l'expéditeur ainsi que l'identifiant du webhook que vous utilisez dans Shopify Flow.

2. Choisissez la manière dont les appelants prouvent leur identité

Ouvrez le webhook et choisissez une méthode d'authentification. Consultez Authentification pour consulter la comparaison complète. En résumé :

Jeton statique : une solution adaptée à presque tout le monde. Cliquez sur le bouton « Générer », copiez le jeton, Envoyez-le dans l'en-tête X-Api-Key.
HMAC SHA-256 - pour les expéditeurs qui signent leurs requêtes (Stripe, GitHub et autres services similaires).
Aucun - à des fins de test uniquement. Toute personne disposant de l'URL peut lancer votre workflow.

3. Indiquez-nous les domaines qui vous intéressent

Dans la section « **Paramètres avancés **», vous pouvez mapper jusqu’à quatre champs de votre payload JSON. Si votre système envoie :

L'onglet « Paramètres avancés », dans lequel les champs 1 à 4 sont associés respectivement à « orderId », « status », « total » et « note » — Paramètres avancés : mappez jusqu'à quatre valeurs issues du corps de la requête. Celles-ci sont transmises à l'adresse Shopify Flow sous la forme des champs fieldOne à fieldFour.

json

{ "customer": { "email": "someone@example.com" }, "orderId": "1001" }

Remplacez fieldOne par orderId et fieldTwo par customer.email - les chemins d'accès imbriqués utilisent des points. Vous trouverez tous les détails sur Mappage de la charge utile et variables de flux.

4. Envoyer une requête de test

Une requête s'est ouverte dans l'historique avec ses en-têtes de requête, sa payload, son statut, sa durée et ses identifiants — Après une requête de test, l'appel apparaît dans l'historique avec le payload reçu.

bash

curl -X POST https://your-app-url/webhook/ab12cd34 \
  -H "Content-Type: application/json" \
  -H "X-Api-Key: your-token" \
  -d '{"orderId":"1001","customer":{"email":"someone@example.com"}}'

Ouvrez l'historique. Vous devriez voir l'appel avec son statut, ses en-têtes et sa payload. S'il n'y figure pas, la page Historique et dépannage répertorie tous les motifs de rejet.

5. Créez le workflow Flow

Dans «Shopify Flow », créez un workflow en commençant par le déclencheur « Webhook Trigger ».

Ajoutez le déclencheur, puis cliquez sur « Enregistrer les événements ».
Revenez ici, ouvrez l'invocation dans l'historique, puis cliquez sur « Replay ». Shopify Flow dispose désormais d'un un exemple concret de payload sur lequel travailler - c'est bien plus simple que d'essayer de deviner les noms des champs.
Ajouter une condition : l'adresse Webhook ID doit correspondre à l'identifiant de votre webhook (indiqué sur la page dédiée au webhook). Chaque workflow de type « Déclencheur de webhook » reçoit les événements provenant de tous vos webhooks ; par conséquent, ceci C'est cette condition qui fait que le workflow ne réagit qu'à celle-ci.
Ajoutez vos actions en utilisant l'adresse {{fieldOne}} à l'adresse {{fieldFour}}.
Activez le workflow.

Le signe « + » situé sous l'étape « Déclencheur Webhook » s'est ouvert, proposant les options « Action » et « Condition ». — Le signe « + » situé sous une étape regroupe les deux éléments qui composent un workflow : une condition et une action.

Condition de Shopify Flow : l'identifiant du webhook est identique à celui d'un webhook — La première étape de chaque workflow : une condition liée à l'identifiant du webhook, afin que le workflow ne s'exécute que pour ce webhook.

Panneau « Ajouter une variable » de Shopify Flow pour le déclencheur Webhook, répertoriant les champs webhookId et fieldOne à fieldFour avec des exemples de valeurs issues d'une requête récente — Ce que le déclencheur transmet à votre workflow : l'identifiant du webhook et vos quatre champs mappés, accompagnés des valeurs d'une requête récente.

Action « Envoyer un e-mail interne » de Shopify Flow, avec « fieldOne » et « fieldTwo » dans l'objet, et « fieldThree » et « fieldFour » dans le corps du message — Utilisez les champs mappés partout où une action Shopify Flow nécessite une variable, ici dans l'objet et le corps d'un e-mail interne.

Le workflow final : Déclencheur « Webhook », une condition sur l'identifiant du webhook, puis l'envoi d'un e-mail interne sur la branche « True » — Le workflow final : un déclencheur, une condition basée sur l'identifiant du webhook, puis votre action sur la branche « True ».

6. Mise en ligne

Configurez votre système réel pour qu'il utilise l'URL du webhook. Vérifiez les premiers appels dans l'historique pour vous assurer qu'ils sont bien reçus et qu'ils aboutissent.

Si votre expéditeur effectue une nouvelle tentative en cas de délai d'expiration, activez l'option Protection contre les livraisons en double afin qu'une nouvelle tentative ne puisse pas déclencher deux fois votre workflow.

La page « Webhooks » répertorie six webhooks, chacun accompagné de son nombre d'appels, de ses paramètres d'authentification et d'un indicateur « Activé » ou « Désactivé ». — La page « Webhooks ». Chaque ligne indique la fréquence à laquelle le webhook a été appelé, le mode d'authentification des appelants et s'il est activé ; le menu situé à droite permet de l'activer, de le désactiver ou de le supprimer.