Skip to content

Encodeur / Décodeur d'URL

Encodez ou décodez des URLs en pourcentage. Plus un analyseur d'URL complet.

encodeURIComponent — encode tout y compris : / ? # @ — pour les paramètres de requête et les segments de chemin.

Quand utiliser l'encodage d'URL

L'encodage d'URL (encodage en pourcentage) convertit les caractères invalides ou ayant une signification spéciale dans les URL en un format sûr %XX. Utilisez-le pour construire des chaînes de requête avec des caractères spéciaux (?q=bonjour monde → ?q=bonjour%20monde), intégrer des URL dans d'autres URL, construire des requêtes API par programmation, encoder des données de formulaire et gérer des caractères internationaux dans les URL (é → %C3%A9).

Voir aussi : Encodeur Base64, Générateur de hash, Générateur de QR Code, Générateur de slug.

Référence d'encodage URL

Caractères fréquemment encodés : Espace → %20. & → %26. = → %3D. # → %23. + → %2B. / → %2F. Caractères qui ne nécessitent PAS d'encodage (RFC 3986) : A–Z, a–z, 0–9, -, _, ., ~.

encodeURI() en JavaScript préserve la structure de l'URL ; encodeURIComponent() encode tout y compris /, ?, & — utilisez ce dernier pour les valeurs de paramètres individuels.

Comment fonctionne l'encodage d'URL

L'encodage en pourcentage (aussi appelé encodage d'URL) remplace les caractères non sûrs par un signe % suivi de deux chiffres hexadécimaux représentant la valeur de l'octet. Par exemple, un espace devient %20 et é (U+00E9) devient %C3%A9 en UTF-8. Cela permet à n'importe quel caractère Unicode d'apparaître en toute sécurité dans une URL.

Les deux fonctions JavaScript se comportent différemment. encodeURIComponent est la plus stricte : elle encode tout sauf les lettres, chiffres et - _ . ! ~ * ' ( ). Utilisez-la pour les valeurs de chaîne de requête et les segments de chemin. encodeURI est permissive : elle laisse les caractères structurels : / ? # [ ] @ ! $ & ' ( ) * + , ; = intacts car elle suppose que vous passez une URL complète.

Le mode analyseur d'URL utilise l'API URL intégrée au navigateur (standard WHATWG URL) pour décomposer toute URL valide en protocole, hôte, chemin, paramètres de requête et fragment — affiché sous forme de tableau pour une inspection facile.

Sources

La syntaxe d'URL et l'encodage en pourcentage sont formellement définis dans la RFC 3986 — Identificateur de ressource uniforme (URI) : Syntaxe générique (T. Berners-Lee, R. Fielding, L. Masinter, janvier 2005, rfc-editor.org/rfc/rfc3986). La section 2.1 définit l'encodage en pourcentage ; la section 3 définit la syntaxe URI générique (schéma, autorité, chemin, requête, fragment). L'analyseur d'URL utilise le standard WHATWG URL implémenté nativement dans tous les navigateurs modernes.

Ce qui est là — et ce qui ne l'est pas

Encodage/décodage bidirectionnel, une explication claire de quand utiliser encodeURIComponent vs encodeURI, correction Unicode, un bouton d'inversion et un analyseur d'URL qui décompose toute URL en un tableau propre de composants incluant tous les paramètres de requête individuellement.

Ce qui n'est pas là : l'encodage par lot de plusieurs valeurs à la fois, un constructeur de chaîne de requête (construire une URL depuis zéro en remplissant des champs) ou la comparaison côte à côte des modes d'encodage. Ces fonctionnalités seraient utiles mais ajoutent assez de complexité UI pour appartenir à un outil plus spécialisé.

Questions fréquentes

Quelle est la différence entre encodeURIComponent et encodeURI ?
encodeURIComponent encode tous les caractères sauf les lettres, chiffres et - _ . ! ~ * ' ( ). Utilisez-la pour les valeurs individuelles de paramètres de requête et les segments de chemin. encodeURI laisse les caractères structurels d'URL (: / ? # @ etc.) non encodés car elle suppose que vous passez une URL complète navigable. Encoder une URL complète avec encodeURIComponent la casserait — les barres obliques et les deux-points deviendraient %2F et %3A.
Que signifie % dans une URL ?
Le caractère % est le préfixe d'échappement dans l'encodage en pourcentage. Il est toujours suivi de deux chiffres hexadécimaux représentant une valeur d'octet. Par exemple, %20 est l'octet 0x20 (décimal 32), qui est le caractère espace ASCII. Pour les caractères Unicode en dehors de l'ASCII, plusieurs octets encodés en pourcentage représentent l'encodage UTF-8 de ce caractère — ex. %C3%A9 pour é.
Quand ne pas encoder une URL ?
N'utilisez pas encodeURI ou encodeURIComponent sur une URL que vous stockez comme lien — les navigateurs modernes gèrent automatiquement l'UTF-8 dans les URLs lors de la navigation. Encodez seulement quand : vous construisez une URL par programmation pour la passer à un appel fetch(), vous construisez des paramètres de requête pour une API, ou vous intégrez une URL dans une autre URL comme valeur de paramètre.
Où l'encodage en pourcentage est-il défini ?
RFC 3986 — « Identificateur de ressource uniforme (URI) : Syntaxe générique » (Berners-Lee, Fielding, Masinter, janvier 2005). La section 2.1 définit l'encodage en pourcentage. La section 3 définit la syntaxe complète des composants URI. Disponible sur rfc-editor.org/rfc/rfc3986.
Cela gère-t-il correctement l'Unicode ?
Oui. La fonction JavaScript encodeURIComponent convertit les caractères Unicode en leur représentation en octets UTF-8 avant d'encoder chaque octet en pourcentage. Par exemple, le caractère japonais 日 (U+65E5) s'encode en %E6%97%A5 — trois octets représentant l'encodage UTF-8 de ce point de code. decodeURIComponent inverse correctement ce processus.
Quelle est la différence entre encodeURI et encodeURIComponent ?
encodeURI() encode une URL complète, préservant les caractères structurels (:, /, ?, &, #, =). encodeURIComponent() encode un composant d'URL (comme la valeur d'un paramètre de requête), encodant aussi ces caractères structurels. Règle : utilisez encodeURI() pour les URL complètes ; encodeURIComponent() pour les valeurs de paramètres individuels.
Pourquoi les espaces sont-ils encodés en %20 dans certains cas et + dans d'autres ?
%20 est l'encodage en pourcentage correct pour un espace selon la RFC 3986 (la norme URL). L'encodage + pour les espaces provient de l'encodage de formulaires HTML (application/x-www-form-urlencoded), antérieur à la RFC 3986. Les deux sont valides dans les chaînes de requête, mais %20 est universellement correct et préféré dans les API modernes.

Par Bam's Thinkery — Mis à jour le