Encodage URL : encodez les paramètres de requête et les chemins

L’encodage en pourcentage remplace les caractères non sûrs par %XX afin qu’un texte arbitraire puisse être placé dans une URL. Sachez quels caractères échapper et comment les décoder.

Ce qu’est le percent-encoding

Les caractères qui ne sont pas autorisés dans une URL sont remplacés par un signe pourcentage suivi de deux chiffres hexadécimaux. Un espace devient %20 et un esperluette devient %26.

encodeURIComponent vs encodeURI

Utilisez encodeURIComponent pour une seule valeur de query ou un segment de chemin — il échappe /, ?, & et =. N’utilisez encodeURI que sur une URL entière, où ces caractères sont structurels et doivent rester.

Le piège + vs %20

Dans les query strings, un espace peut apparaître sous forme de + (encodage de formulaire) ou de %20. decodeURIComponent ne transforme pas un + en espace ; remplacez donc les + avant de décoder des données encodées en formulaire.

Double encodage

Encoder une chaîne déjà encodée transforme %20 en %2520. Si vous voyez des séquences %25 en sortie, c’est qu’il y a eu un double encodage — décodez à nouveau jusqu’à ce que la valeur ne change plus.

Caractères réservés et non réservés

La RFC 3986 sépare les caractères d’URL en réservés (gen-delims comme : / ? # et sub-delims comme & =) et non réservés (lettres, chiffres, - . _ ~). Les non réservés n’ont jamais besoin d’être encodés. Les réservés ne le sont que lorsqu’ils apparaissent dans une valeur, pas en tant que structure d’URL.

Encoder une URL entière vs une seule valeur

encodeURI sert aux URL entières : il laisse : / ? # & = tels quels pour préserver la structure. encodeURIComponent sert à une valeur unique destinée à un segment de chemin ou un paramètre de query — il échappe ces caractères structurels pour que la valeur ne déborde pas de son emplacement.

Construire des query strings sûres par code

Préférez URLSearchParams (navigateur) ou url.URLSearchParams (Node) à la concaténation de chaînes. Ces deux APIs encodent correctement clés et valeurs, gèrent les paramètres multi-valeurs et évitent l’erreur la plus courante — oublier d’encoder un paramètre qui contient justement & ou =.