Guides

Ajouter le remplissage automatique par code postal à un formulaire de livraison

Un formulaire de livraison avec des champs séparés pour le code postal, la ville et la région demande au client de saisir des informations qu'un simple code postal suffit souvent à déduire.

Rechercher le code

Dès qu'un client a fini de saisir un code postal et sélectionné un pays, ou si le pays est déjà connu grâce à son compte, envoyez les deux à /v1/postcode.

GET /v1/postcode?code=SW1A 1AA&country=GB
{
  "status": "ok",
  "postcode": "SW1A 1AA",
  "country_code": "GB",
  "results": [
    {"lat": 51.5014, "lon": -0.1419, "components": {"city": "London", "region": "Greater London", "country": "GB"}}
  ]
}

Remplir les champs du formulaire

Remplissez les champs ville et région directement à partir de l'objet components du résultat, et laissez le client les confirmer ou les corriger plutôt que de verrouiller entièrement les champs, car un code postal chevauche parfois une limite administrative ou couvre plusieurs noms de lieux couramment utilisés.

Un second exemple : préremplir une région de facturation à des fins fiscales

La même recherche convient à un formulaire d'inscription ou de facturation qui a besoin de la région du client pour le calcul des taxes, et pas seulement à un formulaire de livraison. Déclencher la même recherche de code postal dès qu'un code postal de facturation est saisi remplit le champ région de manière cohérente dans les deux contextes, avec exactement la même requête et la même structure de réponse, de sorte que le même code de traitement côté client et côté serveur peut servir aux deux formulaires.

Déclencher la recherche au bon moment

Lancez la recherche lorsque le champ du code postal perd le focus, ou lorsqu'il atteint la longueur attendue pour le pays sélectionné, plutôt qu'à chaque frappe, puisqu'un code postal n'a de sens à rechercher qu'une fois complet. La fonctionnalité se limite ainsi à une requête par champ rempli plutôt qu'une par caractère saisi.

Une erreur courante à éviter

Ne codez pas en dur une longueur fixe pour le format de code postal de tous les pays. Une hypothèse de cinq chiffres qui fonctionne pour un pays déclenchera la recherche trop tôt, ou jamais, pour un pays utilisant une autre longueur ou un format alphanumérique comme dans l'exemple ci-dessus. Déclenchez-la à la perte du focus quelle que soit la longueur, ou tenez à jour une petite table des longueurs par pays si vous voulez la déclencher plus tôt pour les pays que vous servez le plus souvent.

Gérer un code non reconnu

Un tableau results vide signifie que le code n'a pas été reconnu pour ce pays, le plus souvent à cause d'une faute de frappe. Laissez les champs ville et région vides et laissez le client les remplir manuellement plutôt que de bloquer l'envoi du formulaire, car rejeter purement et simplement le champ à cause d'un échec du remplissage automatique est une moins bonne expérience que de demander simplement une saisie manuelle dans ce seul cas.

Un cas particulier : un code couvrant plusieurs noms de lieux

Certains codes postaux couvrent légitimement une zone connue localement sous plusieurs noms de lieux, ou se situent juste à la limite entre deux noms de villes couramment utilisés. Dans ce cas, afficher la valeur renvoyée comme une suggestion modifiable plutôt que comme un libellé figé permet au client de la corriger en choisissant le nom qu'il utilise réellement, sans considérer l'un ou l'autre comme plus ou moins officiel.

Obtenir des coordonnées exactes une fois l'adresse complète

Le remplissage automatique à partir d'un code postal donne une localisation au niveau de la zone, ce qui suffit pour les champs ville et région, mais une fois que le client a saisi en plus une adresse complète avec la rue, passer l'adresse entière dans /v1/forward vous donne les coordonnées précises dont une étiquette d'expédition ou un système de routage des livraisons a réellement besoin.

Ce que cela coûte

Chaque champ de code postal rempli déclenche une requête. Un formulaire de livraison qui traite de nombreuses commandes par jour utilise quand même cette fonctionnalité à un rythme modeste, une recherche par commande plutôt que par frappe, ce qui la maintient largement dans les 2 500 requêtes gratuites par jour incluses avec chaque clé pour la plupart des boutiques.

Remplir automatiquement la ville et la région à partir d'un code postal retire deux champs au formulaire de livraison pour la grande majorité des clients qui saisissent un code valide. Les définitions complètes des champs figurent dans la documentation de la recherche de code postal.