Workflow WebhooksWorkflow Webhooks
CORS, l'URL du proxy de l'application et les appels du navigateur

CORS, l'URL du proxy de l'application et les appels du navigateur

Copier la page

Appelez un webhook Shopify Flow depuis le navigateur : activez CORS, utilisez l'URL du proxy de l'application et mesurez les risques d'un jeton exposé.

Un webhook est généralement appelé de serveur à serveur. Si vous souhaitez en appeler un depuis un navigateur (votre boutique en ligne, une page d'accueil ou un portail client), deux paramètres sont importants : « Activer CORS » et « Utiliser l'URL du proxy de l'application ». Ces deux paramètres se trouvent dans les « Paramètres avancés » du webhook.

Activer CORS

Les navigateurs refusent une requête inter-origines à moins que le serveur destinataire n'autorise celle-ci. Activez l'option « Activer CORS » : le webhook répondra alors à la requête préliminaire du navigateur et acceptera l'appel.

La vérification préalable autorise également l'utilisation de n'importe quel en-tête contenant votre jeton, y compris un nom d'en-tête personnalisé que vous avez défini vous-même, afin qu'un navigateur ne rencontre aucun problème.

Utiliser l'URL du proxy de l'application

Chaque webhook dispose de deux adresses, toutes deux accompagnées d'un bouton « Copier » dans les paramètres d'URL :

URL On dirait que Remarques
URL directe de l'application le domaine de notre application, suivi du code du webhook Cela fonctionne toujours, y compris sur les boutiques en mode développement et celles protégées par mot de passe
URL du proxy de l'application un chemin d'accès sur le domaine propre à la boutique Elle provient de la même origine que votre boutique en ligne, de sorte qu'un navigateur la traite comme une requête de première partie

Cochez la case « Utiliser l'URL du proxy de l'application » pour publier l'adresse du proxy. Cela permet une intégration plus fluide avec la boutique en ligne et, comme il s'agit d'une même origine, vous n'avez souvent pas besoin du CORS du tout.

Ce qu'il faut savoir avant de l'allumer :

  • La boutique en ligne doit être accessible. Sur une boutique protégée par un mot de passe, telle qu'une boutique de développement, l'URL du proxy ne répond qu'une fois le mot de passe de la boutique en ligne saisi ; par conséquent, les utilisateurs extérieurs à votre boutique ne peuvent pas l'utiliser dans ce contexte.
  • La directive Listes d'adresses IP autorisées ne s'applique pas à l'URL du proxy : ces requêtes nous parviennent depuis les serveurs d'Shopify ; leur adresse ne vous donne donc aucune indication sur l'expéditeur d'origine.
  • Shopify signe chaque requête via l'URL proxy. Vous pouvez vous en servir pour autoriser uniquement les clients connectés à appeler le webhook, désactiver l'URL directe et récupérer l'identifiant du client dans Shopify Flow : consultez Les clients connectés à votre boutique en ligne.

L'authentification fonctionne de la même manière sur les deux adresses. Il en va de même pour Protection contre les livraisons en double, l'historique et la limite du forfait.

Autoriser un corps de requête personnalisé

Toujours dans les paramètres avancés : l'option « Autoriser le corps de requête personnalisé » désactive la validation stricte du corps de la requête, de sorte que le webhook accepte n'importe quel format JSON et non plus uniquement les champs que vous avez mappés. Utilisez-la lorsque la charge utile de l'expéditeur est dynamique ou que vous n'en avez pas le contrôle. Les champs mappés parviennent toujours à Shopify Flow de la même manière - voir Mappage de la charge utile et variables de flux.

À ce sujet