Encodeur et décodeur d’URL

Qu’est-ce qu’un encodeur et décodeur d’URL ?

Une URL n’accepte qu’un alphabet restreint de caractères directement dans sa structure : lettres, chiffres, et une poignée de signes de ponctuation qui ont chacun un rôle précis (/ sépare des segments, ? introduit la query string, & sépare ses paramètres, # marque un fragment). Dès qu’une valeur — un mot de recherche, un nom de fichier, une adresse e-mail — contient autre chose, un espace, un accent, un & littéral, elle doit être encodée en pourcentage : chaque octet problématique devient % suivi de son code hexadécimal. é devient %C3%A9, l’espace devient %20.

Cet outil encode et décode ces séquences pourcent, avec trois modes qui correspondent chacun à une fonction JavaScript différente et à un usage différent : une valeur isolée destinée à une query string, une URL entière qu’on ne veut pas casser, ou un champ de formulaire HTML, où la règle de l’espace change. Le choix du bon mode compte plus qu’il n’y paraît.

Comment ça marche

1. Choisissez Encoder ou Décoder. Le mode détermine si le champ de saisie attend du texte brut ou une chaîne déjà encodée en pourcentage.
2. Précisez ce que vous encodez. Une valeur isolée pour un paramètre de query string, Une URL entière pour ne pas casser sa structure, ou Un champ de formulaire si l’espace doit devenir un + comme le fait un formulaire HTML.
3. Lisez le résultat et copiez-le. La sortie se met à jour à chaque frappe, la ligne du dessous compte les caractères en entrée et en sortie, et le bouton Copier passe sur Copié ! pendant deux secondes.

Les trois modes, et pourquoi le mauvais choix casse tout

Le mode Une valeur isolée s’appuie sur encodeURIComponent, qui échappe tout sauf les lettres, les chiffres et - . _ ~ — l’ensemble « non réservé » de la RFC 3986. Il laisse pourtant passer cinq caractères que cet ensemble ne couvre pas : ! ' ( ) et *. Une valeur contenant une apostrophe ou des parenthèses ressort donc encore avec ces caractères tels quels, même après « encodage » — et en français, où l’apostrophe est partout (l’, d’, aujourd’hui), c’est un piège qu’on croise vite dès que le parser en face de vous est strict.

Le mode Une URL entière s’appuie sur encodeURI, qui laisse en plus onze caractères intacts : # $ & + , / : ; = ? @ — exactement ceux qui donnent sa structure à une URL. C’est toute la différence entre les deux fonctions : passez une URL complète dans encodeURIComponent et vous encodez ses / et ses :, la rendant inutilisable comme URL ; passez une simple valeur dans encodeURI et un & ou un = qu’elle contient s’infiltre dans la query string comme s’il séparait des paramètres. La règle est simple — encodeURI pour une URL entière qu’on ne veut pas casser, encodeURIComponent pour une valeur isolée qu’on s’apprête à glisser dans une query string.

Le mode Un champ de formulaire existe pour un bug classique et sournois : l’envoi d’un formulaire HTML et URLSearchParams encodent l’espace en +, pas en %20 — new URLSearchParams({ q: "a b" }) produit q=a+b. Mais decodeURIComponent("a+b") renvoie la chaîne littérale a+b, signe plus compris : la fonction générique ne sait pas que ce + représentait un espace. Décodez naïvement, avec le mode valeur isolée, une query string qui vient d’un formulaire, et chaque espace se change en un + bien visible dans le résultat. C’est exactement pour ça que ce mode existe séparément.

Un détail qu’on lit rarement : comme ce mode délègue à URLSearchParams plutôt que de réimplémenter la règle, il se révèle plus strict que encodeURIComponent. Il échappe quatre des cinq caractères que celle-ci laisse filer — ! ' ( ) deviennent %21 %27 %28 %29 — et ne laisse que l’astérisque intact.

Ce que cet outil ne fait pas

Le mode Une valeur isolée n’échappe pas ! ' ( ) ni * : c’est le comportement de encodeURIComponent lui-même, pas une limite de cet outil, mais ça vaut la peine de le savoir avant d’envoyer une valeur qui les contient vers un système qui les traite comme spéciaux.

Au décodage, une séquence pourcent tronquée est traitée comme l’erreur franche qu’elle est, pas comme un essai approximatif : coller quelque chose comme %E0%A4%A — un % suivi de moins de deux chiffres hexadécimaux valides — produit une erreur plutôt qu’un résultat à moitié décodé. Et le décodage d’une URL entière est volontairement l’inverse exact de encodeURI : un %2F reste %2F, parce que le retransformer en barre oblique changerait la forme de l’URL et pas seulement son texte.

Rien de ce que vous saisissez n’est envoyé à un serveur ; l’encodage et le décodage tournent entièrement dans votre navigateur, en JavaScript. Rechargez la page et tout disparaît, rien n’est conservé.

Pourquoi c’est gratuit ?

Encoder ou décoder une URL est un calcul immédiat, natif du navigateur — pas besoin de compte, de serveur ou d’abonnement pour appeler encodeURIComponent. Comme le reste des outils de FreeToGenerate.com, celui-ci reste gratuit, sans limite d’utilisation et sans inscription.