YamlBox

Web et encodage · 5 minutes de lecture

Encodage URL : quand s'échapper et quand casser des choses

Les URL sont assemblées à partir de caractères qui signifient quelque chose pour l'analyseur et de caractères qui sont simplement des données, et le codage en pourcentage permet de séparer les deux. Un encodeur URL convertit ces dernières en `%XX` échappe ainsi une valeur contenant `&`, `?` ou un espace survit au voyage. La plupart des bogues URL ne sont pas du tout des échecs d'encodage : ils encodent la mauvaise partie, ou encodent deux fois.

Mis à jour

Ce qui doit être codé

Un petit ensemble de caractères est toujours sûr : lettres, chiffres, `-`, `_`, `.` et `~`. Tout le reste est soit réservé, soit doit être échappé. Les caractères réservés sont les plus intéressants, car ils sont légaux dans un URL mais seulement dans des positions spécifiques : `?` démarre une requête, `&` sépare les paramètres, `=` attribue une valeur, `#` démarre un fragment, `/` sépare les segments de chemin. Mettez-en un dans une valeur non codée et vous avez réécrit silencieusement la structure du URL.

Plus ou %20

L'espace est l'exemple classique. Dans un chemin, un espace doit être `%20` ; un `+` il y a un plus littéral. Dans les corps `application/x-www-form-urlencoded` et les chaînes de requête lus par les analyseurs de formulaires, `+` est compris comme un espace. Cette divergence explique pourquoi une valeur peut coder pour quelque chose qui fonctionne dans un contexte et qui échoue dans un autre, et pourquoi les décodeurs proposent les deux interprétations.

Encodez des composants, pas des URL entières. L'exécution d'un URL complet via un encodeur de composants échappe à ses propres `://` et `?`, produisant un lien qui ne résout rien.

La distinction JavaScript qui séduit tout le monde

                encodeURI('https://x.com/a b?q=1')        // keeps :// ? = — for a whole URL
encodeURIComponent('a b?q=1')               // escapes ? and = — for one value
              

`encodeURI` préserve la structure URL et est destiné à une adresse complète ; `encodeURIComponent` échappe à tout ce qui est significatif et est destiné à une seule valeur de paramètre. Utiliser le mauvais produit soit un URL brisé, soit une valeur non échappée, et les symptômes sont opposés : un lien qui renvoie un 404 ou une chaîne de requête qui perd la moitié de ses paramètres.

Double encodage et URL signées

L'encodage d'une valeur déjà encodée transforme `%20` en `%2520`, et le serveur la décode ensuite une fois et remet à votre application un littéral `%20` là où un espace était prévu. Cela apparaît dans les systèmes en couches : un proxy réencodant une cible, un client échappant à un URL qu'il a reçu déjà échappé. Cela est particulièrement important pour les URL signées : les signatures sont calculées sur la chaîne codée exacte, donc la modification de l'échappement d'un caractère invalide le lien même s'il se résout toujours vers la même ressource.

Décoder pour déboguer

Lorsqu'un lien échoue, son décodage est le moyen le plus rapide de voir ce qui est réellement demandé au serveur – et la réponse est souvent une valeur qui s'est infiltrée dans la structure. Travailler dans le navigateur signifie que vous pouvez coller un URL contenant des jetons, des paramètres signés ou des identifiants client sans l'envoyer nulle part, ce qui est précisément le genre de URL que vous ne devez pas coller dans un service qui enregistre les requêtes.

URL Encodeur / Décodeur — questions fréquemment posées

Un espace doit-il être %20 ou un signe plus ?

Utilisez `%20` dans les chemins et dans tout URL que vous construisez vous-même ; les deux sont valides dans les chaînes de requête, où les analyseurs de formulaire lisent conventionnellement `+` comme un espace. Le décodage doit savoir quelle convention a produit la chaîne.

Pourquoi l'encodage de mon URL deux fois le brise-t-il ?

Chaque passe échappe au caractère d'échappement : un espace devient `%20`, puis `%2520`. À l'arrivée, le serveur décode une fois et votre application reçoit un texte littéral `%20`. Encodez une fois, au point où une valeur brute devient partie d'un URL.

Quelle est la différence entre encodeURI et encodeURIComponent ?

`encodeURI` laisse intacts les caractères structurels tels que `://`, `?`, `&` et `=`, il convient donc à une adresse entière. `encodeURIComponent` les échappe également, il convient donc à une seule valeur de paramètre. Leur mélange est la cause de la plupart des liens générés rompus.

Outils mentionnés dans cet article

Parcourez la liste complète des 19 outils

Plus d'articles à lire

Tous les 19 messages →