Quoi de plus frustrant que de voir votre boite mail envahie de courrier indésirable après avoir mis en ligne un formulaire de contact sur votre site web ? Ou pire, d’avoir des robots qui brute-forcent votre formulaire de login admin, ou spamment les commentaires de vos articles ?
Sécuriser les formulaires de votre site web pour les rendre moins vulnérables est un enjeu non seulement de confort, mais aussi de sécurité et de crédibilité.
Les solutions
Parmi les méthodes les plus connues pour résoudre ce problème :
- Le honeypot (“pot de miel”), ces petits champs de formulaire cachés à l’utilisateur, mais que les robots vont se précipiter de remplir telles des mouches attirées par le miel. Son efficacité est faible car :
- si le champ a un nommage exotique, les robots ne vont pas le remplir
- si le nommage est bien fait, il risque d’être rempli automatiquement dans le cas (fréquent) où l’utilisateur utilise le remplissage automatique des champs formulaires, l’empêchant de soumettre son formulaire
- le ReCaptcha Google : ultra connu, utilisé à tout va, il est très efficace. Cependant, et c’est son gros point faible, il n’est pas conforme avec la RGPD, et devrait donc être banni de tout site à destination des publics européens (vous avez d’ailleurs peut-être remarqué qu’on le rencontre de moins en moins).
C’est ici qu’entre en scène le Turnstile Cloudflare.
Efficace, compatible RGPD, gratuit, visuellement neutre, et relativement simple à mettre en place, il a tout pour plaire ✨
Un mot rapide sur Cloudflare
CloudFlare est une entreprise américaine spécialisée dans la protection des sites, via des services gratuits et payants de pare-feu, DNS, proxy…
Investis contre le spam, leurs fondateurs créaient déjà des solutions en 2004 avec le « Project Honey Pot ».
Comment fonctionne le Turnstile Cloudflare ?
Selon leur site, “Cloudflare Turnstile confirme que les visiteurs du web sont humains et bloque les bots indésirables sans ralentir l’expérience web des utilisateurs légitimes.”
Concrètement, une petite boîte reliée à votre formulaire analyse à l’aide d’un bout de code l’interaction avec le site. Si nécessaire, elle demande de cocher manuellement une checkbox, mais dans la plupart des cas, elle affiche une coche verte de validation automatiquement au bout de quelques secondes.
Un fois la vérification validée, elle active le bouton de soumission du formulaire.
Comment mettre en place le Turnstile Cloudflare sur WordPress ?
Retroussez vos manches, on y va (mais pormis ça ne sera pas très long ni compliqué).
Créez votre Turnstile chez Cloudflare
Pour commencer, il faut se créer un compte Clouflare.
Pour cela, rendez-vous sur leur site : https://www.cloudflare.com/fr-fr/
et cliquez sur « S’inscrire » en haut à droite.
Sélectionnez l’offre gratuite, et cliquez sur « Ajouter un site ».
Créer votre compte en renseignant vos identifiants email / mot de passe.
Une fois le compte créé, vous arrivez dans l’interface d’admin de Cloudflare.
Dans le menu de droite, allez sur « Turnstile » , puis cliquez sur le bouton « Ajouter un Widget«
Nommez-le (peu importe le nom, il doit simplement vous parler)
Cliquez sur « Ajouter un nom d’hôte » et, dans le volet qui s’ouvre, ajoutez le domaine sur lequel le widget sera utilisé, et optionnellement les domaines de test et de dev.
Sélectionnez-les dans la liste dans laquelle ils apparaissent plus bas, et faites « Ajouter »
Une fois les noms d’hôtes ajoutés, vous devez les sélectionner de nouveau dans l’écran principal de la création du widget.
Sélectionnez ensuite le « Mode du Widget », c’est à dire de quelle manière le Turnstile va gérer l’interaction avec l’utilisateur sur votre site.
Cloudflare recommande le mode « Géré », ce qui signifie que le défi sera la plupart du temps non-interactif, mais nécessitera parfois que l’utilisateur coche la petite case.
À noter qu’un mode totalement invisible est aussi disponible.
Enfin, dernière option : « Souhaitez-vous opter pour une pré-autorisation pour ce site ? »
Choisissez « Non » pour ne pas faire stocker à votre utilisateur de cookies.
Enfin, cliquez sur « Créer » 🎉
CloudFlare vous communique deux clés d’API, qui vous serviront à configurer le Turnstile sur votre site. Vous pourrez les retrouver plus tard, mais gardez-les sous le coude, nous allons bientôt en avoir besoin.
Installez et configurez le plugin WordPress
Le plugin Simple Cloudflare Turnstile d’Elliot Sowersby permet d’utiliser facilement et sans ajout de code le Turnstile Cloudflare sur votre WordPress.
Simple Cloudflare Turnstile permet d’utiliser le Turnstile sur une grande variété de formulaires WordPress natifs et issus de plugins populaires, parmi lesquels :
- les formulaires WordPress de login, enregistrement de compte, récupération de mot de passe et ajout de commentaire
- les formulaires WooCommerce de checkout, enregistrement de compte, récupération de mot de passe et payement via un lien
- les formulaires des plugins WP Forms, Contact Form 7, Gravity Forms, Elementor Pro, Mailchimp, Mailpoet, BuddyPress, et de nombreux autres (vous pouvez consulter la liste à jour sur la page du plugin)
Allez dans votre back-office WordPress, installez et activez ce plugin.
Toujours dans votre backoffice WordPress, lancez la configuration du plugins en allant dans « Réglages » , puis « Cloudflare Turnstile »
Entrez vos clés d’API (la clé du site et la clé secrète, que Cloudflare vous a données tout à l’heure et que vous avez gardé sous le coude).
Il y a ensuite quelques options à choisir, je vous donne ci-dessous mes recommandations personnelles.
Choisissez votre thème : dark (sombre) ou light (clair). Prenez celui qui fera le plus joli sur votre site, aucun enjeu ici.
Cochez la case “Disable Submit Button” afin que le bouton de soumission de formulaire ne soit cliquable que lorsque le défi a été validé.
Vous pouvez configurer de manière plus poussée l’apparence du Turnstil dans la boîte des Advanced Settings, et ne pas soumettre certains utilisateurs au Turnstil en configurant les Whitelist Settings.
Arrive enfin l’activation du Turnstile sur les formulaires que vous désirez : cochez tous les types de formulaires de votre site que vous souhaitez que le Turnstile protège.
Ma recommandation : pas de jaloux, cochez-les tous, on n’est pas là pour faire les choses à moitié.
Enregistrez vos modifications 💪
Avant de courir admirer la petite coche magique sur vos formulaires, vérifiez en haut de la page rechargée que la connexion s’effectue avec l’API Cloudflare – si c’est bien le cas, le widget affiché pour le test devrait s’afficher correctement.
Sinon… vérifiez vos clés d’API et l’exactitude des informations renseignées chez Cloudflare (le nom de domaine est-il exact ?), une petite erreur s’est sûrement glissée.
Félicitations, vous avez terminé 🎉
Profitez maintenant de cette sécurisation fiable, qui préserve vie privée de vos utilisateurs ❤️
Tout ça, c’est du martien, ou bien ça a l’air long et pas passionnant,
MAIS vous souhaitez quand même profiter de ce super service pour sécuriser votre site ?
Je peux ajouter cette fonctionnalité pour vous lors d’un RDV Expertise
(on aura même le temps de faire le point, et peut-être de régler, d’autres problématiques).
Contactez-moi si vous souhaitez plus d’informations.
