Les cinq caracteres qui cassent le HTML
Le HTML donne une signification speciale a une poignee de caracteres, donc les placer tels quels dans une page casse le rendu ou ouvre une faille de securite. L'encodage les remplace par des entites nommees que le navigateur affiche litteralement :
| Caractere | Entite | Role en HTML |
|---|---|---|
& | & | Demarre chaque entite — doit toujours etre encode en premier |
< | < | Ouvre une balise |
> | > | Ferme une balise |
" | " | Delimite les valeurs d'attribut |
' | ' | Delimite les valeurs d'attribut (guillemets simples) |
Exemple : <div class="hello">World & "Friends"</div> s'encode en <div class="hello">World & "Friends"</div> — collez cela dans une page et le navigateur affiche le balisage comme du texte au lieu de rendre une div.
Modes encodage et decodage
Changez de mode avec le commutateur en haut ; la conversion se fait en direct a mesure que vous tapez. Encoder remplace les cinq caracteres speciaux ci-dessus. Decoder est plus general : il resout toute entite que le navigateur connait — nommee ( , ©, é), decimale (é) et hexadecimale (é) — de sorte qu'il nettoie en une passe un texte parseme d'entites recupere de pages web ou d'exports de CMS.
Pourquoi c'est important : afficher du code et prevenir le XSS
- Afficher du code sur une page : pour afficher un extrait HTML dans un article de blog ou une doc, il doit etre encode en entites, sinon le navigateur le rend au lieu de le montrer.
- Prevention du XSS : une entree utilisateur renvoyee dans du HTML sans encodage permet a un attaquant d'injecter des balises
<script>. Encoder a la sortie transforme l'attaque en texte visible inoffensif. C'est la regle d'echappement en sortie la plus importante du developpement web. - Corriger un texte double-encode : si vous voyez
&lt;dans le rendu, le texte a ete encode deux fois. Passez-le au decodage jusqu'a stabilisation.
Encodage HTML vs. encodage d'URL
Ils resolvent des problemes differents et ne sont pas interchangeables : les entites HTML rendent le texte sur a l'interieur du balisage ; l'encodage pourcent rend le texte sur a l'interieur des URL. Une valeur qui entre dans la chaine de requete d'un href a besoin de l'encodeur d'URL ; le texte de lien visible a besoin de cet outil. Tout ici tourne entierement dans votre navigateur — rien de ce que vous collez n'est envoye a un serveur. Egalement utile a cote : le convertisseur Markdown vers HTML pour generer du balisage et l'outil Base64 pour les data URI.