Intégrer un captcha au formulaire de commentaire WordPress

Les plats clés

• L'intégration d'un captcha au formulaire de commentaire WordPress peut dissuader les robots de soumettre des commentaires de spam, d'économiser du temps et des ressources consacrées à la modération et à la suppression de ces commentaires.
• Le tutoriel montre comment utiliser l'API WordPress HTTP dans un plugin, ajouter des champs de formulaire supplémentaires au formulaire de commentaire WordPress et valider et utiliser les valeurs ajoutées aux champs personnalisés.
• Le plugin CAPTCHA développé dans le tutoriel comprend un message d'erreur si le formulaire CAPTCHA est laissé vide ou si l'utilisateur échoue au défi. Il supprime également tous les commentaires soumis qui échouent au défi CAPTCHA.
• Le tutoriel met l'accent sur la polyvalence du système de commentaires WordPress, permettant aux utilisateurs d'ajouter des champs de formulaire supplémentaires au formulaire de commentaire et de mettre en œuvre toutes les fonctionnalités souhaitées grâce aux filtres et actions mentionnés.

Au fil des ans, WordPress est devenu une cible pour les spammeurs en raison de sa popularité croissante.

Malheureusement, un logiciel automatisé existe dont le but est de ramper le Web à la recherche de sites Web construits avec n'importe quelle plate-forme populaire, comme WordPress, et de soumettre des centaines, voire des milliers de commentaires de spam. Les commentaires de spam sont très ennuyeux, ils consomment notre temps précieux quand il s'agit de les modérer et de les supprimer.

Je sais que vous détestez les commentaires du spam autant que moi et que vous aimeriez savoir comment les combattre. Une façon de dissuader les robots de soumettre des commentaires de spam est d'intégrer un captcha au formulaire de commentaire.

Dans les tutoriels précédents, nous avons appris à intégrer CAPTCHAS au formulaire de connexion et d'enregistrement WordPress.

De la même manière, nous allons maintenant exécuter comment intégrer un captcha avec le système de commentaires WordPress.

Il existe de nombreux plugins CAPTCHA disponibles dans le répertoire des plugins WordPress tels que WP-RecaptCha et SecUrimage-WP-fixé.

Le but de ce tutoriel est de ne pas créer un autre plugin CAPTCHA mais à:

1. Démontrer comment l'API HTTP WordPress peut être utilisée dans un plugin.
2. Comment inclure des champs de formulaire supplémentaires au formulaire de commentaire WordPress.
3. Comment valider et utiliser les valeurs ajoutées aux champs personnalisés.

sans plus tarder, commençons avec le développement du plugin.

Développement du plugin

Tout d'abord, dirigez-vous vers Recaptcha, enregistrez votre nom de domaine et prenez vos clés API publiques et privées.

Inclure l'en-tête du plugin.

<span><span><?php
</span></span><span>
</span><span><span>/*
</span></span><span><span>Plugin Name: Add reCAPTCHA to comment form
</span></span><span><span>Plugin URI: https://www.sitepoint.com
</span></span><span><span>Description: Add Google's reCAPTCHA to WordPress comment form
</span></span><span><span>Version: 1.0
</span></span><span><span>Author: Agbonghama Collins
</span></span><span><span>Author URI: http://w3guy.com
</span></span><span><span>License: GPL2
</span></span><span><span>*/</span></span>

Créez une classe avec trois propriétés qui stockeront la clé privée et publique du Recaptcha ainsi que le message d'erreur CAPTCHA (des erreurs sont générées lorsque le formulaire CAPTCHA est laissé vide et qu'un utilisateur échoue au défi).

<span>class Captcha_Comment_Form {
</span>
	<span>/** <span>@type string private key|public key */</span>
</span>	<span>private $public_key, $private_key;
</span>
	<span>/** <span>@type string captcha errors */</span>
</span>	<span>private static $captcha_error;</span>

La méthode du constructeur magique de classe contiendra deux paires d'action et des crochets filtrants.

<span>/** class constructor */
</span>	<span>public function __construct() {
</span>
		<span>$this->public_key  = '6Le6d-USAAAAAFuYXiezgJh6rDaQFPKFEi84yfMc';
</span>		<span>$this->private_key = '6Le6d-USAAAAAKvV-30YdZbdl4DVmg_geKyUxF6b';
</span>
		<span>// adds the captcha to the WordPress form
</span>		<span>add_action( 'comment_form', array( $this, 'captcha_display' ) );
</span>                
                <span>// delete comment that fail the captcha challenge
</span>		<span>add_action( 'wp_head', array( $this, 'delete_failed_captcha_comment' ) );
</span>
		<span>// authenticate the captcha answer
</span>		<span>add_filter( 'preprocess_comment', array( $this, 'validate_captcha_field' ) );
</span>
		<span>// redirect location for comment
</span>		<span>add_filter( 'comment_post_redirect', array( $this, 'redirect_fail_captcha_comment' ), 10, 2 );
</span>	<span>}</span>

Code Explication: Premièrement, mes clés publiques et privées Recaptcha sont enregistrées dans leurs propriétés de classe.

La méthode captcha_display () qui sortira le défi Recaptcha est ajoutée au formulaire de commentaire par l'action comment_form.

L'action WP_head comprend la fonction de rappel delete_failed_captcha_comment () qui supprimera tout commentaire soumis qui échoue au défi CAPTCHA.

Le filtre Preprocess_Comment appelle la méthode valide_captcha_field () pour s'assurer que le champ CAPTCHA n'est pas laissé vide et aussi que la réponse est correcte.

Le filtre comment_post_redirect call redirect_fail_captcha_comment () pour ajouter des paramètres de requête à l'URL de redirection du commentaire

voici le code de captcha_display () qui sortira le défi CAPTCHA.

De plus, il vérifie s'il y a une chaîne de requête jointe à l'URL de la page actuelle et affiche le message d'erreur approprié en fonction de la valeur de $ _get ['CaptCha'] défini par redirect_fail_captcha_comment ()

<span><span><?php
</span></span><span>
</span><span><span>/*
</span></span><span><span>Plugin Name: Add reCAPTCHA to comment form
</span></span><span><span>Plugin URI: https://www.sitepoint.com
</span></span><span><span>Description: Add Google's reCAPTCHA to WordPress comment form
</span></span><span><span>Version: 1.0
</span></span><span><span>Author: Agbonghama Collins
</span></span><span><span>Author URI: http://w3guy.com
</span></span><span><span>License: GPL2
</span></span><span><span>*/</span></span>

<span>class Captcha_Comment_Form {
</span>
	<span>/** <span>@type string private key|public key */</span>
</span>	<span>private $public_key, $private_key;
</span>
	<span>/** <span>@type string captcha errors */</span>
</span>	<span>private static $captcha_error;</span>

La méthode valide_captcha_field () car son nom implique de valider la réponse CAPTCHA en s'assurant que le champ CAPTCHA n'est pas vide et que la réponse fournie est correcte.

<span>/** class constructor */
</span>	<span>public function __construct() {
</span>
		<span>$this->public_key  = '6Le6d-USAAAAAFuYXiezgJh6rDaQFPKFEi84yfMc';
</span>		<span>$this->private_key = '6Le6d-USAAAAAKvV-30YdZbdl4DVmg_geKyUxF6b';
</span>
		<span>// adds the captcha to the WordPress form
</span>		<span>add_action( 'comment_form', array( $this, 'captcha_display' ) );
</span>                
                <span>// delete comment that fail the captcha challenge
</span>		<span>add_action( 'wp_head', array( $this, 'delete_failed_captcha_comment' ) );
</span>
		<span>// authenticate the captcha answer
</span>		<span>add_filter( 'preprocess_comment', array( $this, 'validate_captcha_field' ) );
</span>
		<span>// redirect location for comment
</span>		<span>add_filter( 'comment_post_redirect', array( $this, 'redirect_fail_captcha_comment' ), 10, 2 );
</span>	<span>}</span>

Examinons de plus près valider_captcha_field (), en particulier l'instruction conditionnelle ElseIF, un appel est fait pour repaptcha_response () pour vérifier si la réponse CAPTCHA est correcte.

Vous trouverez ci-dessous le code pour le recaptcha_response ().

/** Output the reCAPTCHA form field. */
	public function captcha_display() {
		if ( isset( $_GET['captcha'] ) && $_GET['captcha'] == 'empty' ) {
			echo '<span><span><span><strong</span>></span>ERROR<span><span></strong</span>></span>: CAPTCHA should not be empty';
</span>		} elseif ( isset( $_GET['captcha'] ) && $_GET['captcha'] == 'failed' ) {
			echo '<span><span><span><strong</span>></span>ERROR<span><span></strong</span>></span>: CAPTCHA response was incorrect';
</span>		}

		echo <<<span><span><span><CAPTCHA_FORM</span>
</span></span><span>		<span><style type<span>='text/css'</span>></span><span><span><span>#submit</span> {
</span></span></span><span><span>				<span>display: none;
</span></span></span><span><span>			<span>}</span></span><span><span></style</span>></span>
</span>		<span><span><span><script</span> type<span>="text/javascript"</span>
</span></span><span>		        <span>src<span>="http://www.google.com/recaptcha/api/challenge?k=<span><?= $this->public_key; ?></span>"</span>></span><span>
</span></span><span><span>		</span><span><span></script</span>></span>
</span>		<span><span><span><noscript</span>></span>
</span>			<span><span><span><iframe</span> src<span>="http://www.google.com/recaptcha/api/noscript?k=<span><?= $this->public_key; ?></span>"</span>
</span></span><span>			        <span>height<span>="300"</span> width<span>="300"</span> frameborder<span>="0"</span>></span><span><span></iframe</span>></span>
</span>			<span><span><span><br</span>></span>
</span>			<span><span><span><textarea</span> name<span>="recaptcha_challenge_field"</span> rows<span>="3"</span> cols<span>="40"</span>></span>
</span>			<span><span><span></textarea</span>></span>
</span>			<span><span><span><input</span> type<span>="hidden"</span> name<span>="recaptcha_response_field"</span>
</span></span><span>			       <span>value<span>="manual_challenge"</span>></span>
</span>		<span><span><span></noscript</span>></span>
</span>

		<span><span><span><input</span> name<span>="submit"</span> type<span>="submit"</span> id<span>="submit-alt"</span> tabindex<span>="6"</span> value<span>="Post Comment"</span>/></span>
</span>CAPTCHA_FORM;

	}

Permettez-moi d'expliquer comment fonctionne le recaptcha_response ().

Une demande de publication est envoyée au point de terminaison http://www.google.com/recaptcha/api/verify avec les paramètres suivants.

• PrivateKey: votre clé privée
• distant l'adresse IP de l'utilisateur qui a résolu le captcha.
• défier la valeur de recaptcha_challenge_field envoyé via le formulaire.
• Réponse La valeur de recaptcha_response_field envoyée via le formulaire.

Le défi et la réponse après les données envoyés par le formulaire sont capturés et enregistrés pour $ Challenge et $ Response respectivement. $ _Server ["Remote_Addr"] Capturez l'adresse IP de l'utilisateur et it à $ Remote_ip.

API WORDPRESS HTTP Le paramètre de poste à être sous forme de tableau d'où le code ci-dessous.

<span>/**
</span><span>	 * Add query string to the comment redirect location
</span><span>	 *
</span><span>	 * <span>@param $location string location to redirect to after comment
</span></span><span>	 * <span>@param $comment object comment object
</span></span><span>	 *
</span><span>	 * <span>@return <span>string</span>
</span></span><span>	 */
</span>	<span>function redirect_fail_captcha_comment( $location, $comment ) {
</span>
		<span>if ( ! empty( <span>self::</span>$captcha_error ) ) {
</span>
			<span>$args = array( 'comment-id' => $comment->comment_ID );
</span>
			<span>if ( <span>self::</span>$captcha_error == 'captcha_empty' ) {
</span>				<span>$args['captcha'] = 'empty';
</span>			<span>} elseif ( <span>self::</span>$captcha_error == 'challenge_failed' ) {
</span>				<span>$args['captcha'] = 'failed';
</span>			<span>}
</span>
			<span>$location = add_query_arg( $args, $location );
</span>		<span>}
</span>
		<span>return $location;
</span>	<span>}</span>

Le recaptcha_post_request () est une fonction de wrapper pour l'API HTTP qui acceptera le paramètre / corps du post, rendez une demande à l'API RecaptCha et reviendra vrai si le test CAPTCHA a été passé et faux sinon.

<span>/**
</span><span>	 * Verify the captcha answer
</span><span>	 *
</span><span>	 * <span>@param $commentdata object comment object
</span></span><span>	 *
</span><span>	 * <span>@return <span>object</span>
</span></span><span>	 */
</span>	<span>public function validate_captcha_field( $commentdata ) {
</span>
		<span>// if captcha is left empty, set the self::$captcha_error property to indicate so.
</span>		<span>if ( empty( $_POST['recaptcha_response_field'] ) ) {
</span>			<span><span>self::</span>$captcha_error = 'captcha_empty';
</span>		<span>}
</span>
		<span>// if captcha verification fail, set self::$captcha_error to indicate so
</span>		<span>elseif ( $this->recaptcha_response() == 'false' ) {
</span>			<span><span>self::</span>$captcha_error = 'challenge_failed';
</span>		<span>}
</span>
		<span>return $commentdata;
</span>	<span>}</span>

Tout commentaire fait par un utilisateur qui a échoué au défi CAPTCHA ou a laissé le champ vide est supprimé par Delete_Failed_CaptCha_Comment ()

<span>/**
</span><span>	 * Get the reCAPTCHA API response.
</span><span>	 *
</span><span>	 * <span>@return <span>string</span>
</span></span><span>	 */
</span>	<span>public function recaptcha_response() {
</span>
		<span>// reCAPTCHA challenge post data
</span>		<span>$challenge = isset( $_POST['recaptcha_challenge_field'] ) ? esc_attr( $_POST['recaptcha_challenge_field'] ) : '';
</span>
		<span>// reCAPTCHA response post data
</span>		<span>$response = isset( $_POST['recaptcha_response_field'] ) ? esc_attr( $_POST['recaptcha_response_field'] ) : '';
</span>
		<span>$remote_ip = $_SERVER["REMOTE_ADDR"];
</span>
		<span>$post_body = array(
</span>			<span>'privatekey' => $this->private_key,
</span>			<span>'remoteip'   => $remote_ip,
</span>			<span>'challenge'  => $challenge,
</span>			<span>'response'   => $response
</span>		<span>);
</span>
		<span>return $this->recaptcha_post_request( $post_body );
</span>
	<span>}</span>

Enfin, nous fermons la classe du plugin.

<span>$post_body = array(
</span>			<span>'privatekey' => $this->private_key,
</span>			<span>'remoteip'   => $remote_ip,
</span>			<span>'challenge'  => $challenge,
</span>			<span>'response'   => $response
</span>		<span>);
</span>
		<span>return $this->recaptcha_post_request( $post_body );</span>

Nous avons terminé en codant la classe de plugin. Pour mettre la classe au travail, nous devons l'instancier comme:

<span>/**
</span><span>	 * Send HTTP POST request and return the response.
</span><span>	 *
</span><span>	 * <span>@param $post_body array HTTP POST body
</span></span><span>	 *
</span><span>	 * <span>@return <span>bool</span>
</span></span><span>	 */
</span>	<span>public function recaptcha_post_request( $post_body ) {
</span>
		<span>$args = array( 'body' => $post_body );
</span>
		<span>// make a POST request to the Google reCaptcha Server
</span>		<span>$request = wp_remote_post( 'https://www.google.com/recaptcha/api/verify', $args );
</span>
		<span>// get the request response body
</span>		<span>$response_body = wp_remote_retrieve_body( $request );
</span>
		<span>/**
</span><span>		 * explode the response body and use the request_status
</span><span>		 * <span>@see https://developers.google.com/recaptcha/docs/verify
</span></span><span>		 */
</span>		<span>$answers = explode( "\n", $response_body );
</span>
		<span>$request_status = trim( $answers[0] );
</span>
		<span>return $request_status;
</span>	<span>}</span>

Sur l'activation du plugin, un captcha sera ajouté au formulaire de commentaire WordPress comme affiché ci-dessous.

enveloppent

À la fin de ce tutoriel, vous devriez être en mesure d'ajouter des champs de formulaire supplémentaires au formulaire de commentaire et d'implémenter à peu près toutes les fonctionnalités que vous souhaitez avoir dans le système de commentaires grâce aux filtres et actions mentionnés.

Si vous souhaitez utiliser le plugin sur votre site WordPress ou pour étudier le code en profondeur, téléchargez le plugin depuis GitHub.

jusqu'à ce que je revienne à votre rencontre, codage heureux!

Questions fréquemment posées (FAQ) sur l'intégration d'un captcha au formulaire de commentaire WordPress

Quelle est l'importance d'intégrer un captcha au formulaire de commentaire WordPress?

L'intégration d'un captcha au formulaire de commentaire WordPress est cruciale pour plusieurs raisons. Premièrement, il aide à prévenir les commentaires du spam, qui peuvent encombrer votre site Web et dissuader les utilisateurs authentiques. Deuxièmement, il ajoute une couche de sécurité supplémentaire, protégeant votre site des bots et des scripts automatisés. Enfin, cela vous fait gagner du temps et des ressources qui seraient autrement dépensées à modérer et à supprimer les commentaires du spam.

Comment puis-je personnaliser le formulaire CAPTCHA sur mon commentaire WordPress?

Personnaliser le captcha sur votre commentaire WordPress Le formulaire peut être effectué via les paramètres du plugin captcha que vous utilisez. La plupart des plugins proposent des options pour modifier la complexité, la conception et la disposition du captcha. Certains vous permettent même de créer votre propre captcha personnalisé.

Y a-t-il des alternatives à CAPTCHA pour les formulaires de commentaires WordPress?

Oui, il existe plusieurs alternatives à CAPTCHA pour les formulaires de commentaires WordPress. Ceux-ci incluent Akismet, un service de filtrage de spam et un pot de miel, une méthode qui trompe les bottes pour se révéler en interagissant avec un champ de formulaire caché.

Puis-je utiliser CAPTCHA sur d'autres formes sur mon site WordPress?

Absolument. CAPTCHA peut être intégré à n'importe quel formulaire sur votre site WordPress, y compris les formulaires de contact, les formulaires d'enregistrement et les formulaires de connexion. Cela offre une sécurité et une prévention des spams supplémentaires sur l'ensemble de votre site.

Que dois-je faire si Captcha ne fonctionne pas sur mon formulaire de commentaire WordPress?

Si CAPTCHA ne fonctionne pas sur votre formulaire de commentaire WordPress, Vérifiez d'abord que le plugin est correctement installé et activé. Si le problème persiste, essayez d'effacer votre cache de navigateur ou de désactiver d'autres plugins pour voir s'il y a un conflit.

Comment puis-je rendre le captcha plus accessible pour les utilisateurs handicapés?

pour rendre le captcha plus Accessible, envisagez d'utiliser un captcha audio ou un captcha basé sur la logique, qui demande aux utilisateurs de répondre à une question simple. Assurez-vous également que votre plugin CAPTCHA est conforme aux directives d'accessibilité du contenu Web (WCAG).

Le captcha est-il efficace contre tous les types de spam?

Bien que CAPTCHA soit très efficace pour prévenir le spam généré par le bot, il peut ne pas être aussi efficace contre le spam généré par l'homme. Pour cela, envisagez d'utiliser des mesures supplémentaires telles que la modération des commentaires ou la liste noire de certains mots ou des adresses IP.

L'intégration de CAPTCHA au formulaire de commentaire WordPress affecte-t-il les performances du site?

L'intégration de CAPTCHA au formulaire de commentaire WordPress ne devrait pas affecter de manière significative les performances du site. Cependant, comme n'importe quel plugin, il utilise certaines ressources. Si vous remarquez un ralentissement, envisagez d'utiliser un plugin CAPTCHA léger ou d'optimiser les performances de votre site par d'autres moyens.

Puis-je intégrer CAPTCHA avec le formulaire de commentaire WordPress sans plugin?

Bien qu'il soit techniquement Possible d'intégrer CAPTCHA au formulaire de commentaire WordPress sans plugin, il nécessite des connaissances de codage avancées et n'est pas recommandé pour la plupart des utilisateurs. L'utilisation d'un plugin simplifie le processus et garantit que le captcha est correctement implémenté.

À quelle fréquence dois-je mettre à jour mon plugin captcha?

Il est recommandé de mettre à jour votre plugin CAPTCHA chaque fois qu'une nouvelle version est publiée. Cela garantit que vous avez les dernières fonctionnalités de sécurité et que le plugin reste compatible avec la dernière version de WordPress.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!