Comment encoder et décoder des URL

· 3 min de lecture

Si vous avez déjà vu %20 dans une URL où un espace devait être, ou %C3%A9 là où un caractère accentué avait sa place, vous avez rencontré l'encodage d'URL. C'est une brique fondamentale du web, et la comprendre aide à déboguer les liens cassés, les problèmes d'API et les soumissions de formulaires.

Ce que fait l'encodage d'URL

Les URL ne peuvent contenir qu'un ensemble restreint de caractères sûrs : lettres (A-Z, a-z), chiffres (0-9) et quelques caractères spéciaux (-, _, ., ~). Tout le reste — espaces, accents, emoji, symboles comme &, =, #, ? — doit être converti dans un format sûr.

L'encodage d'URL (aussi appelé percent-encoding) remplace les caractères non sûrs par un % suivi de leur valeur hexadécimale en octets :

Caractère Encodé
Espace %20
& %26
= %3D
# %23
? %3F
/ %2F
@ %40

Quand l'encodage d'URL est nécessaire

Comment encoder et décoder

  1. Choisissez encoder ou décoder — sélectionnez la direction. Prenez encodeURIComponent pour les paramètres de requête ou encodeURI pour les URL complètes.
  2. Collez votre entrée — saisissez le texte ou l'URL. Le résultat se met à jour instantanément.
  3. Copiez la sortie — utilisez le résultat dans votre code, votre requête d'API ou votre navigateur.

Astuces

Questions fréquentes

Quelle est la différence entre encodeURI et encodeURIComponent ?

encodeURI préserve les caractères valides dans une structure d'URL (barres, deux-points, points d'interrogation). encodeURIComponent encode tout sauf les lettres, les chiffres et quelques caractères sûrs. Utilisez encodeURIComponent pour les valeurs de paramètres de requête, encodeURI pour les URL complètes.

Pourquoi les espaces deviennent-ils %20 ou + ?

Dans l'encodage d'URL, les espaces deviennent %20. Dans les données de formulaire (application/x-www-form-urlencoded), les espaces deviennent +. Les deux sont valides dans leurs contextes, mais %20 est le standard universel pour les URL.

Dois-je encoder mes URL manuellement ?

Dans la plupart des cas, votre langage ou framework s'occupe de l'encodage automatiquement. L'encodage manuel est utile quand vous construisez des URL à la main, déboguez des requêtes d'API ou travaillez avec des chaînes de requête contenant des caractères spéciaux.

Mes données sont-elles envoyées sur un serveur ?

Non. Tout l'encodage et le décodage se font dans votre navigateur.