Faille XSS (Cross-Site Scripting)

Imaginons le cas d'une page web qui fait du AJAX ou du Fetch.
Un utilisateur saisit quelque chose dans un formulaire et son texte est stocké sur le serveur.

Plus tard, le serveur envoie ces données au client:

<?php
echo $str;
?>

Le client met alors à jour une partie de la page avec

document.getElementById('main').innerHTML = xhr.responseText;

Le problème est ici: si au lieu de son nom l'utilisateur a saisi

<script>
alert("attaque");
</script>
ou
<img src="http://monsite.fr/attaque.webp"> ← son serveur connait maintenant votre IP

Le HTML sera exécuté parce que .innerHTML parse le string.

C'est du Cross-Site Scripting : un internaute exécute son script à travers ton site.
Je saisis du code, il est envoyé au serveur, et quand il revient au client il est exécuté!

Les données du site proviennent:

• d'une base de données ;
• d'une API interne ;
• de formulaires utilisateurs.

Une donnée malveillante peut arriver par

• un utilisateur qui saisit du texte ;
• une importation CSV ;
• une donnée copiée depuis un autre système ;
• une base de données ancienne ou contaminée (notamment par injection).

Donc il vaut mieux utiliser .TextContent, ou

• Supprimer les tags HTML de ce qui a été saisi avec PHP htmlspecialchars();

  $nom = htmlspecialchars($_POST['nom'], ENT_QUOTES, 'UTF-8');

• Définir une politique de sécurité de contenu (CSP) via les en-têtes HTTP pour restreindre les sources de scripts autorisées.
• Définir des cookies HttpOnly et Secure pour empêcher l'accès JavaScript aux sessions et garantir le transfert via HTTPS
• Utilisation de requêtes préparées (via PDO ou MySQLi) pour éviter les injections SQL qui pourraient indirectement mener à des vulnérabilités XSS.

Exemple au lieu de

table.innerHTML = `
<tr>
    <td>${client.nom}</td>
    <td>${client.email}</td>
</tr>`;

il vaut mieux faire avec .TextContent:

const tr = document.createElement("tr");
const td = document.createElement("td");
td.textContent = client.nom;
tr.appendChild(td);
table.appendChild(tr);

Javascript peut utiliser .innerHTML si le contenu ne provient pas d'

• un utilisateur qui saisit du texte ;
• une importation CSV ;
• une donnée copiée depuis un autre système ;
• une base de données ancienne ou contaminée.