Question 1

Qu'est-ce qu'une attaque XSS (Cross-Site Scripting) ?

Accepted Answer

Une attaque XSS consiste à injecter du code JavaScript malveillant dans une application web pour l'exécuter dans le navigateur d'autres utilisateurs. L'attaquant exploite les failles de validation ou d'échappement des données pour voler des cookies, des tokens de session, ou effectuer des actions non autorisées. React offre une protection native en échappant automatiquement les valeurs JSX, mais des vulnérabilités subsistent avec dangerouslySetInnerHTML ou lors de la manipulation directe du DOM.

Question 2

Comment React protège-t-il contre les attaques XSS par défaut ?

Accepted Answer

React échappe automatiquement toutes les valeurs insérées via JSX en les convertissant en texte brut avant le rendu. Cette protection empêche l'exécution de scripts malveillants même si du code HTML est injecté dans les données. Contrairement à innerHTML qui interprète et exécute le HTML, React traite les balises comme du texte simple, rendant impossible l'injection de JavaScript malveillant via les props ou le state standard.

Question 3

Pourquoi dangerouslySetInnerHTML est-il considéré comme dangereux en React ?

Accepted Answer

Cette propriété contourne la protection XSS native de React en insérant du HTML brut directement dans le DOM sans échappement. Si le contenu provient d'une source non fiable ou d'une API externe, il peut contenir du JavaScript malveillant qui sera exécuté. Le nom explicite dangerouslySetInnerHTML force les développeurs à reconnaître consciemment le risque de sécurité et à mettre en place une sanitization appropriée avec des bibliothèques comme DOMPurify.

Sécurité & Best Practices React

Qu'est-ce qu'une attaque XSS (Cross-Site Scripting) ?

Réponse

Comment React protège-t-il contre les attaques XSS par défaut ?

Réponse

Pourquoi dangerouslySetInnerHTML est-il considéré comme dangereux en React ?

Réponse

Quelle est la différence principale entre une attaque XSS Stored et Reflected ?

Quelle approche privilégier pour afficher du HTML provenant d'une API externe en React ?

Autres sujets d'entretien React / Next.js

Les bases de JavaScript

Fondamentaux React

React Hooks

Cycle de vie des composants

React Router

Gestion d'état avec Context

Formulaires & Composants contrôlés

Fetching de données & API

React Query (TanStack Query)

Styling & CSS-in-JS

Fondamentaux Next.js

TypeScript avec React

Data Fetching Next.js

Server Actions Next.js

Routing & Navigation Next.js

API Routes Next.js

Metadata & SEO Next.js

Middleware & Auth Next.js

Testing React

Zustand State Management

Optimisation Performance React

Error Boundaries & Error Handling

Advanced React Patterns

Fonctionnalités avancées Next.js

Déploiement & Production Next.js

Architecture & Design Patterns

React Server Components

Internationalisation Next.js

Maîtrise React / Next.js pour ton prochain entretien