Accueil
  • #développement
  • #URL
  • #outils

Décoder une URL : %20, paramètres et encodage expliqués

Par · · 4 min de lecture

Une adresse comme https://exemple.fr/recherche?q=caf%C3%A9%20noir&utm_source=newsletter n’a rien d’illisible une fois qu’on connaît sa grammaire. Les %20 et %C3%A9 sont un codage standard, les paramètres après le ? suivent des règles précises, et quelques caractères ont un rôle réservé.

Voici comment fonctionne l’encodage en pourcentage, comment lire les paramètres (dont les UTM) et quels pièges guettent le décodage.

Pourquoi une URL contient des %#

Une URL ne peut contenir que certains caractères ASCII. Tout le reste (espaces, accents, symboles, emoji) est converti en octets, et chaque octet s’écrit % suivi de deux chiffres hexadécimaux : c’est l’encodage en pourcentage.

Pour un caractère non ASCII, on part de ses octets UTF-8 :

espace  →  %20
é       →  %C3%A9
€       →  %E2%82%AC

Les lettres, les chiffres et les signes -, ., _ et ~ n’ont jamais besoin d’être encodés.

Les caractères réservés#

Certains signes structurent l’URL : / sépare les segments du chemin, ? ouvre la requête, & sépare les paramètres, = relie une clé à sa valeur, # introduit le fragment. S’ils font partie d’une valeur, il faut les encoder, sinon l’URL est lue autrement que prévu.

  • & devient %26
  • = devient %3D
  • ? devient %3F
  • # devient %23
  • + devient %2B
  • / devient %2F

Dans un paramètre q=chat & chien, l’esperluette sépare deux paramètres si elle n’est pas encodée. Il faut écrire q=chat%20%26%20chien.

Lire les paramètres de requête et les UTM#

La partie après le ? est la chaîne de requête : une suite de couples clé=valeur séparés par &. Prenons un lien de campagne :

https://exemple.fr/recherche?q=caf%C3%A9+noir&utm_source=newsletter&utm_medium=email&utm_campaign=soldes%20%C3%A9t%C3%A9#avis

Une fois décodé, on lit :

  • q : « café noir »
  • utm_source : newsletter (d’où vient le visiteur)
  • utm_medium : email (le canal)
  • utm_campaign : « soldes été » (le nom de la campagne)
  • fragment : avis (une ancre dans la page, jamais envoyée au serveur)

Les paramètres utm_source, utm_medium et utm_campaign, complétés par utm_term et utm_content, servent aux outils d’analyse à attribuer une visite à une campagne. Souvent saisis à la main, ils portent des fautes fréquentes : espace non encodé, nom de campagne différent d’un envoi à l’autre, & oublié.

Les pièges du décodage#

  • Le + vaut parfois un espace. Dans une chaîne de requête issue d’un formulaire, + signifie « espace » (caf%C3%A9+noir). Dans un chemin, c’est un vrai plus. Pour envoyer un plus littéral dans une valeur, écrivez %2B.
  • Le double encodage. Si une valeur a été encodée deux fois, l’espace devient %2520 : le % de %20 a lui-même été encodé en %25. Un seul décodage rend %20, il en faut un second.
  • Un % isolé. Une valeur comme 100% n’est pas décodable : le % doit être suivi de deux chiffres hexadécimaux. Écrite correctement, elle donne 100%25.
  • encodeURI ou encodeURIComponent. En JavaScript, encodeURI laisse intacts : / ? & = # pour garder l’URL fonctionnelle, tandis que encodeURIComponent les encode. Pour une valeur de paramètre, utilisez toujours la seconde.
  • Une valeur encodée dans une valeur. Un paramètre peut contenir du Base64 : décodez l’URL d’abord, puis la valeur (voir Base64, pas du chiffrement).

Décoder et analyser avec l’outil#

Le décodeur d’URL propose deux modes :

  1. Analyser une URL : collez l’adresse dans « URL à décoder ». L’outil affiche l’URL décodée, son détail (hôte, protocole, chemin, chaîne de requête, fragment) et un tableau des paramètres, avec un bouton pour copier chaque clé ou valeur. Les paramètres se copient aussi en JSON, en Clé=Valeur, en Markdown ou en ?query.
  2. Encoder / décoder du texte : choisissez Décoder, Encoder (encodeURIComponent) ou Encoder (encodeURI). Cochez « Décoder plusieurs fois » pour un texte encodé deux fois, comme %2520.

Une subtilité : la ligne « URL décodée » conserve les séquences qui ont un rôle dans l’URL (%26, %3D…), alors que le tableau affiche les valeurs entièrement décodées. Une séquence invalide déclenche un message. Le décodage reste local : l’adresse n’est envoyée nulle part, ce qui compte quand elle contient un jeton.

Ce qu’il faut retenir#

Un % suivi de deux chiffres représente un octet, les caractères réservés doivent être encodés quand ils font partie d’une valeur, et + ne signifie « espace » que dans une chaîne de requête. Avec ces repères, un lien truffé de % et d’UTM se lit en quelques secondes.

Outils utilisés dans cet article

À lire aussi