Internet repose sur la confiance. Lorsqu'un internaute visite un site, il suppose que les boutons sur lesquels il clique effectuent les actions indiquées. Or, les cybercriminels développent sans cesse de nouvelles méthodes pour exploiter cette confiance. L'une de ces méthodes trompeuses est l' attaque par détournement de clic.
Le détournement de clic se produit lorsqu'un attaquant trompe un utilisateur pour qu'il clique sur un élément différent de celui sur lequel il souhaitait cliquer.
En superposant une couche transparente ou une iframe invisible à une page légitime, des pirates peuvent détourner les clics destinés à un faux bouton ou à un lien inoffensif. Cela peut entraîner de graves conséquences, comme le téléchargement de logiciels malveillants, le transfert de fonds ou le fait d'aimer involontairement une page sur les réseaux sociaux.
Si vous êtes propriétaire d'un site web, il est crucial de comprendre cette menace. Ce guide explique le fonctionnement de cette technique de modification d'interface utilisateur, comment détecter les vulnérabilitéset les étapes spécifiques pour sécuriser votre site WordPress à l'aide de l'en-tête X-Frame-Options et de la politique de sécurité du contenu (CSP).
Comprendre les attaques de détournement de clic : les risques liés à la réparation de l’interface utilisateur
Le terme « clickjacking » est un mot-valise formé à partir de « click » et « hijacking ». Dans le domaine de la sécurité, il est formellement connu sous le nom d'attaque par modification d'interface utilisateur.
Ce nom décrit parfaitement le mécanisme : l'attaquant modifie l' interface utilisateur (UI) pour masquer le véritable site web cible.
Dans une attaque de type clickjacking classique, l'attaquant crée une page malveillante. Cette page charge une page ciblée, généralement une page sensible comme une page de connexion bancaire ou un panneau de paramètres, dans une iframe.
L'attaquant configure l'iframe pour qu'elle soit totalement transparente. Il place ensuite son propre contenu visible, comme un lecteur vidéo ou une annonce pour un prix gratuit, directement en dessous ou au-dessus du cadre invisible.
L'utilisateur clique sur ce qu'il croit être un bouton « Jouer » ou un lien « Réclamer le prix ». En réalité, il clique sur une page invisible chargée depuis une autre source.
Comme l'ordinateur et le navigateur de l'utilisateur conservent les cookies du site ciblé, l'action est authentifiée et traitée immédiatement. L'utilisateur ignore qu'il vient de réaliser une action à haut risque.
Cette attaque exploite la capacité du web à intégrer du contenu dans des cadres. Si cette pratique est courante pour afficher des cartes ou des vidéos, elle devient dangereuse lorsqu'une page web n'interdit pas explicitement qui peut l'intégrer dans des cadres.
Sans contrôle adéquat, n'importe quel site web peut devenir victime de manipulation de l'interface utilisateur.
Lire la suite : Le coût réel des erreurs de sécurité WordPress
Sécurisez votre site WordPress avant que des attaques ne se produisent
Protégez votre site web contre le détournement de clics et autres menaces grâce aux services d'assistance technique de Seahawk.
Comment fonctionnent les attaques de type « clickjacking » utilisant des iframes et des superpositions invisibles ?
Pour bien saisir le danger, il faut examiner l'exécution technique. Le cœur d'une attaque par détournement de clic repose sur la propriété CSS opacity.
Un attaquant crée un site leurre. Ce site sert d'appât. Sur cette page, l'attaquant utilise du HTML pour charger la page web de la victime dans une iframe.
Le code peut sembler anodin, mais le CSS révèle une tout autre histoire. L'attaquant définit l'opacité de l'iframe à 0.0, ce qui la rend invisible.
Bien que le contenu encadré soit techniquement présent, l'utilisateur ne peut pas le voir. L'attaquant positionne ensuite cette couche invisible précisément sur un bouton visible de son site leurre.
Par exemple, imaginez qu'un pirate souhaite vous forcer à supprimer votre blog. Il charge la page « Supprimer le compte » de votre blog dans une iframe invisible. Il place le bouton invisible « Supprimer » juste au-dessus d'un bouton visible « Gagner un cadeau » sur son site malveillant.
Lorsque l'utilisateur clique sur le bouton « Gagner un cadeau », l'événement de clic traverse les éléments visibles et atteint la fenêtre supérieure du cadre invisible. Le navigateur interprète cela comme un clic légitime sur le bouton « Supprimer ». Comme l'utilisateur est probablement connecté au même navigateur, la commande s'exécute instantanément à son insu.
Cette méthode permet aux attaquants de contourner les jetons CSRF (Cross-Site Request Forgery) dans certains cas, car le navigateur envoie la requête comme si l'utilisateur avait physiquement cliqué sur le bouton de la page légitime.
Pour en savoir plus : Comment utiliser une protection contre les logiciels malveillants pour sécuriser efficacement votre site web
Principaux types d'attaques par détournement de clic et leurs variantes courantes
Bien que la superposition de base soit la méthode la plus courante, il existe plusieurs variantes de détournement de clic conçues pour exploiter des comportements spécifiques ou des vulnérabilités du navigateur.
Likejacking : Exploiter les interactions sur les réseaux sociaux
Le « likejacking » est une forme spécifique de « clickjacking » ciblant sociaux . L'attaquant cherche à manipuler l'utilisateur pour qu'il « aime » ou « partage » une page sans son consentement.
Dans ce scénario, l'iframe invisible contient un de Facebook ou un de Twitter . L'attaquant superpose cette couche transparente à une vidéo ou une image sur une page malveillante.
Lorsque l'utilisateur clique sur « Lecture » pour visionner la vidéo, il « aime » involontairement la page de l'attaquant. Cela renforce la crédibilité sociale des sites malveillants et facilite la diffusion de spams ou d'escroqueries auprès des amis de l'utilisateur.
Vulnérabilités liées au détournement de clic imbriqué et aux options X-Frame
Le détournement de clic imbriqué cible les pages web qui tentent d'utiliser des scripts de contournement de cadres, mais qui échouent à les implémenter correctement. Certains navigateurs anciens ou certaines configurations spécifiques permettent aux attaquants de contrer ces scripts.
Dans cette variante, l'attaquant imbrique l'iframe cible dans deux frames distinctes. En manipulant la façon dont le navigateur gère l'emplacement et la navigation de la fenêtre, il empêche le site légitime de s'afficher hors de la frame.
Cela souligne pourquoi le fait de s'appuyer uniquement sur des scripts côté client n'est pas une bonne pratique ; des en-têtes robustes côté serveur sont nécessaires.
Lecture complémentaire : Prévenir les attaques par force brute contre les sites web WordPress
Détournement de curseur, détournement de souris et autres techniques trompeuses
Le détournement de curseur est une variante particulièrement trompeuse. L'attaquant remplace le curseur de la souris par un faux curseur personnalisé grâce à CSS et JavaScript. Il décale ainsi le curseur réel par rapport au faux.
L'utilisateur a l'impression que son curseur survole un lien sûr. Or, le curseur réel (qui peut être invisible ou décalé) survole un élément malveillant. Lorsque l'utilisateur clique, l'action se produit à l'emplacement du curseur réel, et non à l'emplacement du faux curseur visible.
De même, d'autres techniques consistent à déplacer rapidement le cadre invisible pour suivre la souris (MouseJack), garantissant ainsi que le bouton malveillant soit toujours sous le curseur, quel que soit l'endroit où l'utilisateur le déplace.
En savoir plus : Patch virtuel dans WordPress : comment ça marche et pourquoi c’est important
Comment détecter les vulnérabilités de détournement de clic sur vos pages Web ?
Avant de pouvoir empêcher le détournement de clic, il est indispensable de vérifier la vulnérabilité de votre site web. Heureusement, cette vérification est simple.
La première vérification consiste à déterminer si votre page web peut être chargée dans une iframe depuis une origine différente. Pour ce faire, vous pouvez créer un simple fichier HTML sur votre ordinateur :
<html> <body> <iframe src="https://yourwebsite.com" width="500" height="500"></iframe> </body> </html>
Ouvrez ce fichier dans un navigateur moderne comme Chrome ou Firefox. Si votre site web se charge correctement dans le cadre, vous êtes vulnérable au détournement de clic.
Un site sécurisé devrait refuser la connexion ou afficher un espace vide, indiquant que le navigateur a bloqué le contenu encadré.
Vous pouvez également utiliser des scanners de sécurité en ligne ou des extensions de navigateur conçues pour les tests d'intrusion. Ces outils analysent l'en-tête de réponse HTTP de votre site.
Ils vérifient notamment l'absence de l'en-tête X-Frame-Options ou de l'en-tête Content Security Policy. Si ces en-têtes sont absents, l'outil signalera votre site comme présentant un risque élevé.
Prévention côté serveur : Utilisation de X-Frame-Options pour restreindre l’encadrement
La défense la plus traditionnelle et la plus répandue contre le détournement de clic est l'en-tête X-Frame-Options (XFO). Il s'agit d'un en-tête de réponse envoyé par le serveur web qui indique au navigateur si une page est autorisée à être affichée dans un cadre virtuel.<frame> ,<iframe> ,<embed> , ou<object> .
Lorsqu'un navigateur charge une page, il vérifie cet en-tête. Si la politique de confidentialité est enfreinte, le navigateur garantit la sécurité de l'utilisateur en n'affichant pas le contenu.
Il existe trois valeurs généralement utilisées avec l'en-tête X-Frame-Options :
- REFUSER : Il s’agit du paramètre le plus strict. Il empêche tout domaine d’intégrer la page demandée dans un cadre. Même si la page tente de s’intégrer elle-même, cela échouera. Ce paramètre est idéal pour une page sensible qui ne doit jamais être intégrée.
- SAMEORIGIN : Cette option permet d’afficher la page uniquement depuis des pages ayant exactement la même origine (même domaine, protocole et port). C’est la méthode la plus courante pour sécuriser les sites WordPress, car elle permet d’intégrer son propre contenu tout en bloquant les attaques externes.
- ALLOW-FROM uri est obsolète. Elle permettait d'intégrer du contenu à partir d'une URI spécifique, mais n'est plus prise en charge par la plupart des navigateurs modernes. Il est donc généralement préférable d'utiliser des normes plus récentes.
Définir l'en-tête X-Frame-Options sur SAMEORIGIN suffit souvent à bloquer la grande majorité des attaques de type « clickjacking ». Cela empêche un attaquant de charger votre page de connexion sur son site leurre.
Cependant, XFO présente des limitations. Il n'autorise qu'un seul domaine (le même) ou aucun. Il manque de précision si vous devez autoriser plusieurs partenaires spécifiques à intégrer votre contenu. Pour cela, une solution plus moderne est nécessaire.
Pour en savoir plus : Comment créer une page protégée par mot de passe sur WordPress
Protection avancée : politique de sécurité du contenu (CSP) et ancêtres de cadres
Bien que l'en-tête X-Frame-Options soit efficace, la politique de sécurité du contenu (CSP) représente l'avenir de la protection contre le détournement de clic. La CSP est une couche de sécurité qui contribue à détecter et à atténuer différents types d'attaques, notamment les attaques XSS (Cross-Site Scripting) et l'injection de données.
Pour empêcher le détournement de clic, nous utilisons la directive frame-ancestors. Cette directive spécifie les pages parents autorisées à intégrer une page.
Mise en œuvre de la directive Frame-Ancestors pour le contrôle granulaire
La directive frame-ancestors offre une bien plus grande flexibilité que X-Frame-Options. Elle vous permet de définir une liste de domaines autorisés à intégrer votre contenu dans un cadre.
Par exemple, un en-tête CSP (Content Security Policy) peut ressembler à ceci :
Content-Security-Policy: frame-ancestors 'self' https://trusted-partner.com;
Dans cet exemple :
- La directive « self » agit comme la directive XFO SAMEORIGIN, permettant au même domaine d'encadrer le contenu.
- https://trusted-partner.com permet à un site externe spécifique d'intégrer le contenu dans un cadre.
Vous pouvez également utiliser des caractères génériques ou autoriser tous HTTPS avec l'option `allow from https`, bien qu'une liste stricte soit plus sûre. Ce contrôle précis est essentiel pour les sites web d'entreprise qui reposent sur des intégrations intersites.
Pourquoi les ancêtres de trames CSP sont-ils supérieurs aux scripts de destruction de trames ?
Auparavant, les développeurs utilisaient JavaScript pour contourner les limites du cadre. Ces scripts s'exécutaient côté client et vérifiaient si la position de la fenêtre au premier plan correspondait à celle de la fenêtre active. Dans le cas contraire, ils tentaient de sortir du cadre.
Les attaquants ont rapidement trouvé des moyens de neutraliser ces scripts. Des navigateurs comme Internet Explorer (dans ses anciennes versions) ou des fonctionnalités comme l'attribut sandbox HTML5 des iframes pouvaient empêcher l'exécution du script de contournement, rendant ainsi la défense inefficace.
Les propriétés `frame-ancestors` et `X-Frame-Options` sont des contrôles côté serveur. L'attaquant ne peut pas les désactiver car le navigateur applique la règle avant l'affichage du contenu. Le navigateur lit l'en-tête de réponse et refuse simplement d'afficher l'élément de page malveillant.
L'utilisation de l'en-tête CSP `frame-ancestors` est actuellement la meilleure pratique, car elle est standardisée sur les navigateurs modernes. Bien que `X-Frame-Options` reste utile pour les navigateurs plus anciens, `frame-ancestors` est prioritaire dans les navigateurs qui prennent en charge les deux.
Procédure étape par étape : Sécuriser votre site WordPress contre le détournement de clics
Pour sécuriser un site WordPress, il est nécessaire d'ajouter les en-têtes appropriés. Nul besoin d'être développeur pour effectuer ces modifications, mais il est fortement recommandé de toujours sauvegarder votre site avant de modifier les fichiers du serveur.
Étape 1 : Configuration des en-têtes dans .htaccess ou functions.php
Si votre site WordPress fonctionne sur un serveur web Apache, vous pouvez modifier le fichier .htaccess qui se trouve dans votre répertoire racine.
Pour implémenter l'en-tête X-Frame-Options, ajoutez cette ligne :
<IfModule mod_headers.c>L'en-tête ajoute toujours X-Frame-Options SAMEORIGIN</IfModule>
Pour mettre en œuvre la politique de sécurité du contenu avec les ancêtres de cadres :
<IfModule mod_headers.c>L'en-tête ajoute toujours Content-Security-Policy "frame-ancestors 'self';"</IfModule>
Cette configuration garantit que seul votre site peut afficher vos pages dans un cadre. Pour autoriser un partenaire, il suffit d'ajouter son URL après « self ».
Vous pouvez également ajouter des en-têtes via le fichier functions.php de votre thème actif WordPress. Cette méthode fonctionne quel que soit le type de serveur (Apache ou Nginx), à condition que PHP gère les en-têtes.
function add_security_headers() { header('X-Frame-Options: SAMEORIGIN'); header("Content-Security-Policy: frame-ancestors 'self';"); } add_action('send_headers', 'add_security_headers');
Ce code s'intègre au de génération d'en-têtes WordPress et injecte les directives de protection pour chaque page web servie.
Étape 2 : Utilisation des plugins de sécurité WordPress pour la défense côté client
Si la modification du code vous semble trop risquée, vous pouvez utiliser des extensions de sécurité WordPress. De nombreuses suites de sécurité complètes ajoutent automatiquement ces en-têtes.
- All-In-One Security (AIOS) : ce plugin propose des paramètres spécifiques pour la protection contre les iframes. Vous pouvez activer l’option « Refuser les requêtes non autorisées » et des règles de pare-feu spécifiques, incluant souvent la gestion des options des iframes.
- Headers Security Advanced & HSTS WP : cette extension dédiée vous permet de configurer des en-têtes HTTP spécifiques sans modifier le code. Vous pouvez sélectionner X-Frame-Options dans un menu déroulant et le définir sur SAMEORIGIN.
Bien que les plugins soient pratiques, assurez-vous qu'ils configurent correctement l'en-tête de réponse.
Certains plugins ajoutent uniquement des balises meta, ce qui est moins efficace pour les cadres ancêtres (la CSP via les balises meta ne prend pas en charge les cadres ancêtres). Vérifiez toujours le résultat à l'aide d'un outil d'analyse d'en-têtes en ligne.
Conclusion
La menace du détournement de clic persiste car elle exploite la perception visuelle de l'utilisateur plutôt qu'une faille logicielle. Tant que les navigateurs prendront en charge les iframes, les attaquants tenteront de modifier l'interface utilisateur.
Pour un propriétaire de site web, ignorer cette vulnérabilité signifie mettre en péril la sécurité de ses utilisateurs et la réputation de son site. Un utilisateur qui télécharge un logiciel malveillant ou subit une perte financière à cause d'un bouton sur votre site perdra confiance en votre marque.
La solution réside dans une défense multicouche.
- Audit : Analysez régulièrement vos pages web pour vérifier si elles peuvent être encadrées.
- Implémentez XFO : utilisez l’en-tête X-Frame-Options défini sur SAMEORIGIN pour protéger les utilisateurs sur les navigateurs anciens et les autres navigateurs qui ne prennent pas entièrement en charge CSP.
- Mise en œuvre de la CSP : Adoptez la directive frame-ancestors de la politique de sécurité du contenu pour un contrôle robuste et précis sur les navigateurs modernes.
- Surveillance : Utilisez des plugins de sécurité pour garantir que les en-têtes restent actifs après les mises à jour du thème ou du serveur.
En maîtrisant la présentation de votre contenu, vous neutralisez efficacement les mécanismes invisibles exploités par les pirates informatiques. Vous vous assurez ainsi que lorsqu'un utilisateur clique, il effectue bien l'action souhaitée, le protégeant ainsi contre l'une des attaques les plus trompeuses du web.
FAQ sur les attaques de détournement de clic
Quelle est la méthode la plus courante utilisée lors d'une attaque par détournement de clic ?
La méthode la plus courante consiste à superposer des couches cachées à une page web légitime. Un attaquant crée des iframes invisibles qui incitent les utilisateurs à cliquer sur des éléments qu'ils ne voient pas. Ces couches cachées permettent aux attaquants de déclencher des actions à l'insu de l'utilisateur, facilitant ainsi potentiellement leur accès à des fonctionnalités sensibles.
Comment les options X Frame de même origine contribuent-elles à prévenir le détournement de clic ?
L'en-tête de réponse Same-Origin X-Frame-Options autorise l'affichage d'une page uniquement par des pages provenant de la même origine. Cela empêche les domaines externes d'intégrer votre site dans des cadres malveillants et contribue à bloquer les interactions non autorisées.
Qu’est-ce que la politique frame-ancestors dans la politique de sécurité du contenu ?
La politique relative aux ancêtres des cadres définit les domaines autorisés à intégrer vos pages web. Elle fait partie de la politique de sécurité du contenu (CSP) et offre un contrôle plus précis que les anciens en-têtes. Cette politique est particulièrement efficace pour prévenir les attaques de type « clickjacking ».
Les attaques de type « clickjacking » peuvent-elles permettre aux attaquants d'accéder aux comptes des utilisateurs ?
Oui, le détournement de clic peut permettre aux attaquants d'accéder indirectement à des comptes. En masquant les boutons et les actions, ils peuvent inciter les utilisateurs à modifier des paramètres, à approuver des autorisations ou à soumettre des formulaires à leur insu.
Quel est le meilleur moyen de prévenir le détournement de clics sur un site WordPress ?
La meilleure façon de se prémunir contre le détournement de clic est de mettre en œuvre plusieurs mesures de protection. Configurez l'en-tête de réponse X-Frame-Options, appliquez une politique de protection des cadres ancêtres et activez les extensions de sécurité WordPress. La combinaison de ces mesures bloque les attaques à la source.
