Chapitre 22 – Sécurité JavaScript

La sécurité est une composante essentielle du développement web. Mal utilisée, JavaScript peut introduire des failles graves dans une application, notamment des attaques XSS ou des injections de code. Ce chapitre explore les principaux risques et les bonnes pratiques pour s'en prémunir.

1. XSS (Cross-Site Scripting)

Le Cross-Site Scripting (XSS) consiste à injecter du code JavaScript malveillant dans une page web vue par d'autres utilisateurs.

<input value="<script>alert('XSS')</script>" />

Types de XSS

• Reflected XSS : l'injection se fait via une URL ou une requête et est immédiatement reflétée.
• Stored XSS : le code malveillant est stocké sur le serveur (ex : dans une base de données).
• DOM-based XSS : l'injection est exploitée directement via les manipulations DOM côté client.

2. Injections de code

Les injections ne se limitent pas au XSS. Par exemple, exécuter du code dynamique avec eval() est très risqué :

// Mauvaise pratique dangereuse
let userInput = "alert('Hacked!')";
eval(userInput);

Ne jamais exécuter de code reçu d'un utilisateur sans validation stricte.

3. Bonnes pratiques de sécurité

• Ne jamais insérer directement du contenu utilisateur dans le HTML sans l'échapper.
• Utiliser textContent au lieu de innerHTML autant que possible.
• Éviter les fonctions dynamiques comme eval(), Function() ou setTimeout() avec des chaînes de texte.
• Mettre en place des en-têtes HTTP de sécurité (ex: Content-Security-Policy).
• Utiliser des frameworks modernes qui gèrent l'échappement (React, Vue...)

// Sécurisé : insérer du texte sans danger
const div = document.createElement('div');
div.textContent = userInput;

// Alternative moderne avec sanitization
const safeHTML = DOMPurify.sanitize(userInput);
element.innerHTML = safeHTML;