Comment une vitrine découplée (headless) BigCommerce retrouve-t-elle une page à partir d’un chemin d’URL ?

Définition : La recherche de route dans BigCommerce utilise le nœud route de l’API GraphQL Storefront avec un chemin d’URL. Elle renvoie l’entité correspondante de la vitrine, les détails d’une redirection ou aucun résultat lorsque le chemin ne correspond à aucune entité ni à aucune redirection.

Points clés

• Le paramètre path est la seule entrée obligatoire du nœud route, selon la documentation de BigCommerce sur les routes de la vitrine.
• Une correspondance directe peut renvoyer Product, Category, Brand, NormalPage, ContactPage, RawHtmlPage, Blog ou BlogPost.
• Le nœud route prend en charge les redirections 301 de la boutique. Une redirection renvoyée est soit manuelle, soit dynamique.
• IGNORE est le comportement par défaut pour les redirections. Il donne la priorité à la recherche directe d’entités et peut renvoyer à la fois un champ redirect non nul et un champ node non nul pour le même chemin.
• La présentation de l’API GraphQL Storefront de BigCommerce décrit la recherche par URL d’objets tels que les catégories et les marques, et indique que l’API peut renvoyer les données de plusieurs ressources en un seul appel.

Que renvoie le nœud route pour un chemin donné ?

La vitrine transmet le chemin à site.route. Le champ node est un résultat polymorphe : la requête sélectionne donc les champs des types d’entités que l’application gère. BigCommerce indique que les types de nœuds possibles comprennent les produits, les catégories, les marques, plusieurs types de pages, les blogs et les articles de blog. Un chemin qui ne correspond à aucune entité ni à aucune redirection ne produit aucun résultat lors de la recherche de route.

Voici la structure de base d’une requête de route tirée de l’exemple de BigCommerce, réduite aux champs qui identifient l’objet correspondant :

query LookUpUrl($urlPath: String!) {
  site {
    route(path: $urlPath) {
      node {
        __typename
        id
      }
      redirect {
        toUrl
      }
    }
  }
}

La valeur de __typename permet à une vitrine découplée de sélectionner le fragment correspondant, tandis que id identifie l’objet renvoyé. La présentation de BigCommerce décrit également la recherche de catégories ou de marques par URL et la récupération de leurs détails.

Comment BigCommerce représente-t-il une redirection ?

Le nœud route prend en charge les redirections 301 ajoutées à la boutique. Une redirection manuelle renvoie une URL de destination fixe dans toUrl ; la vitrine effectue ensuite une autre requête de route pour cette destination. Si la destination est elle-même une redirection, la documentation décrit une chaîne qui nécessite plusieurs requêtes.

Une redirection dynamique expose quant à elle un type d’entité et un identifiant d’entité correspondant à une ressource existante de la boutique. BigCommerce nomme cinq types de redirections dynamiques : ProductRedirect, BrandRedirect, BlogPostRedirect, CategoryRedirect et PageRedirect. L’entité cible peut être sélectionnée directement dans la même réponse de route, ce qui permet à l’application de lire la ressource au moyen du fragment approprié.

Que change la valeur FOLLOW de redirectBehavior ?

L’argument redirectBehavior accepte les valeurs IGNORE et FOLLOW. Avec IGNORE, la valeur par défaut, l’API ignore les redirections dans l’ordre de priorité de la recherche. Si une redirection et l’URL directe d’une entité partagent un même chemin, redirect et node peuvent tous deux contenir des valeurs.

Avec FOLLOW, une redirection dynamique place son entité cible dans node. Une redirection manuelle laisse node à null, car elle n’a pas d’entité associée, tandis que redirect contient les détails de la redirection. Cette distinction détermine si la vitrine peut afficher la cible à partir de la réponse actuelle ou si elle doit interroger le chemin de destination.

Le guide de BigCommerce sur le contenu du site applique la même structure de requête de route aux pages web, à la page d’index principale du blog et aux articles de blog. Il précise également que les requêtes de l’API GraphQL Storefront s’exécutent dans le contexte d’un canal de vitrine particulier : la recherche d’une page est donc limitée à ce canal.

Termes associés

• En quoi les cibles des redirections manuelles et dynamiques de BigCommerce diffèrent-elles ?
• Que renvoie FOLLOW pour une redirection de route GraphQL BigCommerce ?
• Comment enregistrer des redirections BigCommerce pour un site vitrine précis ?

Questions fréquentes

Que devez-vous transmettre pour résoudre une URL BigCommerce ?

Transmettez le chemin de la vitrine comme argument path de site.route. L’exemple de BigCommerce utilise une variable GraphQL nommée urlPath pour cette valeur.

Que se passe-t-il si vous utilisez FOLLOW pour une redirection manuelle ?

Le champ redirect contient les détails de la redirection manuelle et node vaut null. Interrogez séparément le chemin de destination pour rechercher l’entité de destination.

Pouvez-vous retrouver une page de blog avec le nœud route ?

Oui. BigCommerce documente des requêtes de route pour les pages web, la page d’index principale du blog et les articles de blog. Le nœud renvoyé peut exposer les champs de page ou de blog sélectionnés par la requête.

Sources

1. BigCommerce Docs, « Storefront Routes with the GraphQL Storefront API », sans date
2. BigCommerce Docs, « GraphQL Storefront API overview », sans date
3. BigCommerce Docs, « Site Content with the GraphQL Storefront API », sans date

---

Vérifiez comment une page se lit pour les moteurs de réponse. Ouvrir l’analyseur de score GEO