Les clients connectés à votre boutique en ligne

Déclenchez un webhook depuis votre propre boutique en ligne et identifiez le client à l'origine de la requête. Un formulaire de commande en gros, un bouton de renouvellement de commande sur la page d’un compte B2B ou un formulaire de demande destiné aux clients connectés peuvent déclencher un workflow Shopify Flow, et ce workflow reçoit l’identifiant du client connecté. Shopify signe cet identifiant, afin que personne ne puisse se faire passer pour un autre client.

Ceci s'appuie sur l'URL du proxy de l'application ; voir CORS, l'URL du proxy de l'application et les appels du navigateur.

Configurez-le

1. Ouvrez le webhook et accédez aux « Paramètres avancés ».
2. Dans les paramètres d'URL, activez l'option « Utiliser l'URL proxy de l'application ». L'URL du webhook se trouve désormais sur le domaine de votre boutique, par exemple https://your-store.com/apps/webhooks/abc123.
3. Dans la section « Qui peut appeler ce webhook ? », choisissez l'une des trois options suivantes :

Option	URL du proxy de l'application	URL directe de l'application
Toute personne disposant de l'URL	Convient à tout le monde	Œuvres
Uniquement via le nom de domaine de votre boutique	Convient à tout le monde, y compris aux invités	Refusé avec le code 403
Uniquement les clients connectés à votre boutique	Fonctionne pour les clients connectés ; les visiteurs reçoivent une erreur 401	Refusé avec le code 403

4. Enregistrer. Ce paramètre s'appliquera à la prochaine requête.

Ce que l'application vérifie

Chaque requête transmise via l'URL proxy de l'application comporte une signature provenant d'Shopify. L'application vérifie, dans l'ordre suivant :

• La signature. Toute requête ne comportant pas de signature Shopify valide est rejetée avec le code d'erreur 401. Personne ne peut la falsifier, car Shopify la génère à partir de la clé secrète de votre application.
• Votre boutique. Une requête signée pour une autre boutique est refusée avec le code d'erreur 403.
• Le client connecté. Lorsque seuls les clients connectés à votre boutique sont autorisés, toute requête ne comportant pas de client connecté est refusée avec le code d'erreur 401 (customer_login_required). L'identifiant du client provient de la signature, et non du corps de la requête.
• L'URL directe. Quelle que soit la restriction appliquée, l'URL directe de l'application renvoie un code d'erreur 403 (proxy_required), ce qui empêche quiconque de contourner ces contrôles.

Une demande refusée n'est jamais transmise à Shopify Flow et n'est pas prise en compte dans le cadre de votre forfait.

Ce que reçoit Shopify Flow

Le déclencheur Webhook et le déclencheur Webhook de synchronisation comportent un champ « customerId » : il s'agit de l'identifiant numérique du client connecté, par exemple 7350001. Ce champ est vide pour les visiteurs et pour toute requête ne provenant pas de l'URL du proxy de l'application. Vos champs mappés sont transmis comme d'habitude ; consultez Mappage de la charge utile et variables de flux.

Appelez depuis votre boutique en ligne

La requête doit provenir d’une page de votre boutique alors que le client est connecté, afin qu’elle transite par le domaine de votre boutique. Copiez l’URL du webhook depuis l’application : Shopify vous permet de modifier le chemin du proxy ; le vôtre peut donc différer de celui de l’exemple. Cet extrait de code, à insérer dans une section du thème, envoie l’adresse de l’entreprise pour laquelle le client B2B effectue son achat :

<script>
  fetch('/apps/webhooks/abc123', {
    method: 'POST',
    headers: { 'Content-Type': 'application/json' },
    body: JSON.stringify({
      companyLocationId: 'gid://shopify/CompanyLocation/{{ customer.current_location.id }}'
    })
  })
</script>

Associez le champ 1 à companyLocationId afin que le workflow reçoive l'emplacement sous le nom de fieldOne.

Enregistrez le client dans Shopify Flow

Shopify Flow peut accéder à toutes les informations concernant le client ; la vérification doit donc être intégrée au workflow :

1. Déclencheur : Déclencheur Webhook issu de Workflow Webhooks. Si vous disposez de plusieurs webhooks, ajoutez une condition : l'ID du webhook doit correspondre à l'ID affiché dans l'application.
2. Récupérez les données client à l'aide de la requête id:{{customerId}}. Shopify Flow charge les informations relatives au client connecté, y compris ses balises et ses rôles au sein de l'entreprise.
3. Condition : le client possède la balise wholesale, et l'un des profils de contact de son entreprise dispose d'une attribution de rôle dont l'identifiant d'emplacement est égal à fieldOne et dont le rôle est Ordering only ou Location admin.
4. Dans ce cas : effectuez les actions nécessaires, par exemple créez une commande provisoire pour cet emplacement. Sinon : arrêtez-vous, ou renvoyez une réponse à la boutique en ligne avec un Réponse synchrone, afin que la page puisse expliquer la raison au client.

Bon à savoir

• L'URL du proxy de l'application nécessite que votre boutique en ligne soit accessible. Dans le cas d'une boutique protégée par un mot de passe, elle ne répond qu'une fois le mot de passe de la boutique en ligne saisi.
• Les visiteurs reçoivent le message d'erreur 401 ; veillez donc à afficher un lien de connexion sur cette page.
• L'historique affiche l'identifiant client de chaque requête, et une relecture permet de la renvoyer.
• Lorsqu'un client demande la suppression de ses données, les entrées d'historique qu'il a envoyées sont supprimées.