Protéger votre site des attaques XSS avec l'en-tête X-XSS-Protection

Je vous ai proposé dernièrement plusieurs tutoriels pour activer certains mécanismes de protection à travers les en-têtes de trames HTTP. C'est bien et cela m'a déjà permis d'améliorer la sécurité du site JusteGeek comme vous avez déjà pu le voir à travers mes précédents tutos. Mais c'est pas fini. Il existe encore d'autres mécanismes que l'on peut implémenter. Et dans ce tutoriel, je vais vous parler des attaques de type XSS et de l'en-tête  X-XSS-Protection. Après cela, le C obtenu par le site sur Security Headers ne sera plus qu'un lointain souvenir... 🙂

JusteGeek.fr passé de D à C grâce à la mise en place de l'en-tête X-Content-Type-Options

JusteGeek.fr passé de D à C grâce à la mise en place de l'en-tête X-Content-Type-Options

 

Qu'est ce qu'une attaque XSS ?

Pour comprendre le mécanisme que nous allons mettre en place ici, il est important de savoir de quoi on parle et donc de savoir ce qu'est une attaque XSS, également appelée cross-site scripting. Une attaque XSS consiste en fait à exploiter une faille pour injecter du code HTML ou JavaScript dans des variables mal protégées d'un site web. L'attaque peut être réalisée de manière unitaire, c'est à dire que le pirate l’exécute une seule fois, en envoyant un formulaire par exemple, ou bien elle peut carrément être stockée dans un fichier ou en base de données pour être rejouée à chaque visite d'une page... Et oui vous imaginez bien ici la dangerosité de la chose.

Je ne vais pas ici vous faire un cours complet sur les failles XSS car ce n'est pas le but de ce billet, mais si vous voulez en apprendre davantage sur ce sujet, je vous renvoie au cours d'Openclassroom qui l'expliquera bien mieux que moi.

 

Comment fonctionne l'en-tête X-XSS-Protection ?

L'en-tête X-XSS-Protection permet d'activer la protection contre les attaques XSS incluse dans les navigateurs Internet compatibles (IE, Chrome, Safari...).  Cette en-tête peut prendre 4 valeurs différentes :

  • 0 : le filtrage XSS est désactivé
  • 1 : le filtrage XSS est activé et le navigateur essaie de nettoyer le code, si besoin
  • 1; mode=block : le filtrage est activé et le navigateur bloque le rendu de la page si une tentative d'attaque de type XSS est détectée
  • 1; report=<reporting-URI> : le filtrage XSS est activé et le navigateur nettoie le code, si besoin, et envoie un rapport à l'adresse définie

La troisième possibilité est bien évidemment la plus sécurisée car plus radicale. C'est pour ma part l'option que j'ai choisi d'implémenter. Sauf erreur de ma part, la quatrième possibilité n'est compatible qu'avec Chromium.

Il faut bien comprendre que l'en-tête X-XSS-Protection n'est pas LA solution ultime et que l'implémenter ne vous mettra pas totalement à l'abri des attaques de type Cross-Site Scripting. Mais cela constitue un petit plus dont il serait dommage de se priver !

 

Implémenter l'en-tête X-XSS-Protection sur son site web

La mise en place de l'en-tête X-XSS-Protection peut être réalisée au niveau du site Internet, via le fichier htaccess, ou bien au niveau du serveur web, via les fichiers de configuration de celui-ci. J'ai pour ma part décidé d'implémenter cela directement sur mon serveur web afin que les différents sites portés par celui-ci bénéficient de cette en-tête. Pour cela, il suffit d'éditer le fichier /etc/apache2/conf-available/security.conf et d'y ajouter la ligne suivante :

Header set X-XSS-Protection "1; mode=block"

Ensuite, un petit redémarrage du serveur web est nécessaire pour que cela soit pris en compte :

systemctl restart apache2

 

Si l'on souhaite le faire au niveau du site Internet, il suffit de configurer la section mod_headers de son fichier htaccess comme ceci :

<IfModule mod_headers.c>

Header set X-XSS-Protection "1; mode=block"

</IfModule>

 

Conclusion

Et voilà ! L'en-tête X-XSS-Protection est en place. Un nouveau check du site sur SecurityHeaders et hop, JusteGeek.fr obtient désormais la note B ! Classe non ? On se rapproche petit à petit du A ! 🙂

JusteGeek.fr passé de C à B grâce à la mise en place de l'en-tête X-XSS-Protection

JusteGeek.fr passé de C à B grâce à la mise en place de l'en-tête X-XSS-Protection

 

Et si tu n'as pas vu mes précédents tutoriels sur les différents mécanismes à mettre en place dans les en-têtes de trame, fonce vite les consulter :

 

Steven

Ingénieur Systèmes passionné d'informatique et de High-Tech, Sandstorm a créé JusteGeek.fr en 2013. Il aime les geekeries en tout genre. "Si un produit s'allume c'est un bon point. S'il est connecté, c'est encore mieux !"

Vous aimerez aussi...

10 réponses

  1. laeticia dit :

    Super série de tutos, allez on sera bientot au A !!!

    • Sandstorm dit :

      Merci pour ton commentaire ! Bon pour arriver au A il faudrait que je prenne un peu de temps et que je sorte la fin de cette série de tuto (il doit m'en reste un ou deux en brouillon que j'ai jamais terminés.... Merci pour la relance !! 🙂
      ++

  2. mohammed rahmatellah dit :

    hello les geeks 🙂 pourquoi ne pas atteindre un niveau a+ carrément, rien n'est difficile juste la détermination qui nous manque 🙂

    Bon tuto courage pour la suite !!

    • Sandstorm dit :

      Salut salut !!
      Ca aurait été l'idée 🙂
      Je n'ai pas encore trouvé le temps de finir cette série de tuto, mais il faut que je le fasse. Le A était pour moi le minimum à atteindre 🙂
      ++

  3. Nicolas Richard dit :

    Salut Sandstorm !
    Décidément ton site est vraiment bien référencé. Sans même mettre de filtre je tombe dessus 😀
    À croire que t'es le seul français à sécuriser son site et/ou à comprendre ce que tu fais ^^
    Pensez à vous balader un peu partout sur votre site pour voir si tout fonctionne correctement après activation !
    Tu as géré les headers Expect-CT ?

    N.B : il est possible que tu actives l'édition de commentaires s'il te plaît ? Ça me rend nerveux ^^

    • Sandstorm dit :

      Salut Nicolas,
      Merci ! pour le référencement j'essaie de faire au mieux, avec mes connaissance... mais les règles de SEO évoluent régulièrement alors ce n'est pas toujours évident...
      Non je n'ai pas géré le Expect-CT. Pour être honnête je ne connais pas ^^
      Je vais regarder et si cela me parait intéressant, je vais le mettre en place et en faire un nouveau billet 🙂
      Pour l'édition des commentaires, on me l'a jamais demandé et ce n'est pas natif dans WordPress... Je vais regarder si je trouve un plugin léger permettant de faire ça 😉

      • Nicolas Richard dit :

        Moi j'y connais vraiment rien j'avoue qu'à par configurer le plugin Yoast SEO…
        Ca fait partit oui des choses à mettre en place depuis quelques années, comme le DNS CAA (en plus c'est assez simple à mettre en place).
        Pour l'édition de commentaires, je te dirais d'installer un "vrai" système de commentaires gratuits qui s'installe en 5 minutes.
        Tu vois je n'osais pas te demander, persuadé (rasoir de Hanlon) que tu l'avais désactivé volontairement ^^'

        • Sandstorm dit :

          Et bien non ! je n'ai jamais installé de système de commentaire, car je ne suis pas partisan de surcharger si c'est pas nécessaire... et en l'occurrence depuis janvier 2013 le système de base remplit son office et on ne m'en a jamais demandé plus. J’étudierai les plugins de commentaire à l'occase 🙂

          • Nicolas Richard dit :

            Rha tu vois je relis mon pavé et je vois ces fautes que je pourrais jamais corrigées T_T

Laisser un commentaire

Votre adresse e-mail ne sera pas publiée. Les champs obligatoires sont indiqués avec *

Ce site utilise Akismet pour réduire les indésirables. En savoir plus sur comment les données de vos commentaires sont utilisées.