Comment empêcher les scripts intersites (XSS) en JavaScript

Dans les attaques de type cross-site scripting (XSS), le code malveillant présent sur une page Web peut mettre en danger les informations sensibles des utilisateurs. Découvrez comment éviter cette vulnérabilité dans votre application JavaScript.

Qu’est-ce que le Cross-Site Scripting ?

Le cross-site scripting (XSS) est un type de vulnérabilité de sécurité qui permet à un attaquant d’injecter du code malveillant dans une page Web consultée par d’autres utilisateurs. L’attaquant peut utiliser cette vulnérabilité pour voler des informations sensibles à l’utilisateur, telles que les identifiants de connexion ou les numéros de carte de crédit.

Il existe trois types d’attaques de type cross-site scripting :

XSS réfléchi : Dans ce type d’attaque, l’attaquant injecte un code malveillant dans une page Web qui est immédiatement renvoyée au navigateur de l’utilisateur. Cela peut se produire lorsque l’utilisateur soumet un formulaire vulnérable à XSS. Disons qu’il existe une application Web qui permet aux utilisateurs de rechercher des produits sur un site de commerce électronique. La fonctionnalité de recherche est implémentée à l’aide d’un paramètre URL, comme ceci :

https://www.example.com/search?q=<search_term>

Lorsqu’un utilisateur saisit un terme de recherche et soumet le formulaire, le terme de recherche est inclus dans l’URL en tant que paramètre. Le serveur traite ensuite la demande de recherche et renvoie les résultats de la recherche dans la réponse.

Imaginez maintenant qu’un attaquant crée un lien malveillant qui inclut une balise de script dans le paramètre de terme de recherche :

https://www.example.com/search?q=<script>alert('XSS attack!')</script>

Si un utilisateur clique sur ce lien, son navigateur enverra une requête au serveur avec le terme de recherche malveillant dans le paramètre URL. Le serveur inclura alors le terme de recherche dans la réponse, qui contiendra la balise de script. Le navigateur de l’utilisateur interprétera la balise de script et exécutera le code JavaScript, qui dans ce cas affichera une boîte d’alerte avec le message « XSS Attack !

XSS stocké : Dans ce type d’attaque, l’attaquant injecte du code malveillant dans une page Web stockée sur le serveur et diffusée à tous les utilisateurs qui consultent cette page.

Disons qu’il existe un site Web de réseau social qui permet aux utilisateurs de publier des commentaires sur les profils d’autres utilisateurs. Les commentaires sont stockés dans une base de données et affichés sur la page de profil. Le site Web ne nettoie pas correctement les entrées des utilisateurs et permet aux utilisateurs de publier des commentaires contenant du code HTML et JavaScript.

Un attaquant crée un commentaire malveillant qui inclut une balise de script, comme ceci :

<script>alert('Stored XSS attack!')</script>

Lorsque l’attaquant publie ce commentaire sur le profil d’une victime, il est stocké dans la base de données. La prochaine fois que la victime consulte son profil, le commentaire malveillant s’affiche sur la page et le navigateur de la victime exécute la balise de script, affichant une boîte d’alerte avec le message « Attaque XSS stockée ! »

Contrairement à une attaque XSS réfléchie, le code malveillant n’est pas inclus dans le paramètre URL et ne dépend pas du fait que la victime clique sur un lien malveillant. Au lieu de cela, le code est stocké sur le serveur et est exécuté chaque fois que la victime consulte son profil, permettant potentiellement à l’attaquant de voler des informations sensibles ou d’effectuer des actions non autorisées au nom de la victime à son insu.

XSS basé sur DOM : Dans ce type d’attaque, l’attaquant injecte un code malveillant dans une page Web qui est exécuté par le navigateur de l’utilisateur, généralement via JavaScript. Disons qu’il existe une page Web contenant un champ de recherche et que les résultats de la recherche sont affichés dynamiquement à l’aide de JavaScript. Le code JavaScript qui gère la fonctionnalité de recherche contient une vulnérabilité qui permet à un attaquant d’injecter du code malveillant dans le DOM.

Par exemple, considérons le champ de recherche suivant :

<input type="text" id="searchBox">
<button onclick="search()">Search</button>
<div id="results"></div>

Et le code JavaScript suivant qui gère la fonctionnalité de recherche :

function search() {
  var query = document.getElementById("searchBox").value;
  var resultsDiv=cument.getElementById("results");
  resultsDiv.innerHTML = "Search results for:" + query;
}

La vulnérabilité ici est que le terme de recherche saisi par l’utilisateur est directement ajouté au DOM à l’aide de la propriété innerHTML, sans être correctement nettoyé ou codé.

Un attaquant peut exploiter cette vulnérabilité en saisissant un terme de recherche contenant du code JavaScript malveillant, tel que :

<script>alert('DOM-based XSS attack!')</script>

Si l’utilisateur saisit ce terme de recherche et clique sur le bouton de recherche, le code de l’attaquant sera exécuté par le navigateur de la victime, affichant une boîte d’alerte avec le message « Attaque XSS basée sur DOM !

Prévenir les scripts intersites en JavaScript

Désinfecter les entrées utilisateur

La première étape pour empêcher XSS consiste à nettoyer toutes les entrées utilisateur avant qu’elles ne soient affichées sur la page Web. Cela peut être réalisé à l’aide de diverses techniques, notamment la validation des entrées et le codage des sorties.

La validation des entrées implique de vérifier les entrées de l’utilisateur pour vérifier qu’elles répondent à certains critères. Par exemple, si vous attendez qu’un utilisateur saisisse une adresse e-mail, vous pouvez vérifier que l’entrée contient le symbole « @ » et un nom de domaine. Si la contribution ne répond pas à ces critères, elle doit être rejetée.

Le codage de sortie implique le codage des entrées de l’utilisateur afin qu’elles ne soient pas interprétées comme du code HTML ou JavaScript. Cela peut être fait à l’aide de diverses techniques, notamment l’échappement HTML et le codage JavaScript.

Voici un exemple d’échappement HTML en JavaScript :

function escapeHTML(str) {
  return str.replace(/[&<>"'\/]/g, function (char) (
  switch (char) {
    case '&':
      return '&amp;';
    case '<':
      return '&lt;';
    case '>':
      return '&gt;';
    case '"':
      return '&quot;';
    case '\':
      return '&#39;';
    case "https://www.telerik.com/":
      return '&#x2F;';
    default:
      return char;
    }
  });
}

Cette fonction prend une chaîne en entrée et remplace tous les caractères ayant une signification particulière en HTML (tels que < et >) avec leurs entités HTML correspondantes.

Utiliser une politique de sécurité du contenu

Une politique de sécurité du contenu (CSP) est une fonctionnalité de sécurité qui vous permet de spécifier quelles sources de contenu peuvent être chargées sur votre page Web. Cela peut aider à prévenir les attaques XSS en empêchant le chargement de code malveillant à partir de sources non fiables.

Voici un exemple d’utilisation de CSP en JavaScript :

app.use(function (req, res, next) {
  res.setHeader('Content-Security-Policy, "default-src 'self' ");
  next();
});


<script src="[https://trusted-site.com/script.js](https://trusted-site.com/script.js)"></script>

Ce code définit l’en-tête Content-Security-Policy pour autoriser uniquement le contenu du même domaine que la page Web. Il précise également que les scripts ne peuvent être chargés qu’à partir d’une source fiable.

Un autre exemple est un CSP avec un en-tête HTTP :

 default-src 'self'

Cet en-tête précise que seul le contenu provenant de la même origine que la page peut être chargé.

Utiliser la validation des entrées

Le moyen le plus efficace d’empêcher les scripts intersites consiste à valider toutes les entrées de l’utilisateur avant qu’elles ne soient affichées sur une page. Ceci peut être réalisé à l’aide d’expressions régulières ou d’autres techniques de validation pour vérifier que l’entrée ne contient que des caractères autorisés et n’est pas malveillante. Par exemple, pour valider l’adresse e-mail d’un utilisateur, vous pouvez utiliser l’expression régulière suivante :

function validateEmail (email) {
  const pattern = /^[a-zA-Z0-9._%+-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,}$/;
    return pattern.test(email);
}

Cette fonction utilise une expression régulière pour valider que l’adresse e-mail contient uniquement des caractères valides et suit le format d’adresse e-mail standard.

Encoder l’entrée utilisateur

Une autre façon d’empêcher les scripts intersites consiste à coder toutes les entrées utilisateur avant qu’elles ne soient affichées sur une page. Le codage implique la conversion de caractères spéciaux en entités HTML correspondantes, qui ne sont pas exécutables par un navigateur Web. Par exemple, pour coder la saisie d’un utilisateur, vous pouvez utiliser la fonction suivante :

function encodeInput (input)  {
  const encoded = document.createElement('div');
  encoded.innerText = input;
  return encoded.innerHTML;
}

Cette fonction crée un nouvel élément div et définit son texte interne sur la saisie de l’utilisateur. Le code HTML interne de l’élément div est ensuite renvoyé, qui contient l’entrée codée.

Utilisation de cookies HTTP uniquement

Les cookies HTTP uniquement sont des cookies accessibles uniquement par le serveur Web, et non par le code JavaScript côté client. Cela empêche les attaquants de voler des informations sensibles, telles que les identifiants de connexion, en injectant du code malveillant dans vos pages Web.

Voici un exemple d’utilisation de cookies HTTP uniquement en JavaScript :

document.cookie = "sessionID=12345; HttpOnly";

Ce code définit un cookie nommé « sessionID » avec une valeur de « 12345 » et définit l’indicateur HttpOnly sur true. Cela fait que le cookie n’est accessible que par le serveur Web et non par le code JavaScript côté client.

Conclusion

En conclusion, le cross-site scripting (XSS) constitue une grave vulnérabilité de sécurité qui permet aux attaquants d’injecter du code malveillant dans des pages Web susceptibles de voler des informations sensibles ou d’effectuer des actions non autorisées au nom de la victime. Il existe trois types d’attaques XSS : Reflected XSS, Stored XSS et DOM-based XSS.

Pour prévenir les attaques XSS, il est crucial de nettoyer toutes les entrées utilisateur avant qu’elles ne soient affichées sur une page Web à l’aide de techniques telles que la validation des entrées et l’encodage des sorties. Il est également essentiel d’utiliser une politique de sécurité du contenu (CSP) et une validation des entrées pour aider à établir que seules les sources fiables et les caractères autorisés sont chargés sur une page Web. En mettant en œuvre ces mesures, les développeurs peuvent réduire considérablement le risque d’attaques XSS et protéger les informations sensibles de leurs utilisateurs.