wordpress添加评论验证码

通过清心醉

wordpress添加评论验证码

wordpress是被脚本自动评论的重灾区,后台打开一堆的评论,要么清数据表要么人工来去移除,太恶心了。

好了,上代码。打开对应主题的comments.php文件,找到:add_filter(‘comment_form_default_fields’, ‘appointment_fields’);

            $appointment_defaults = array(
                'fields' => apply_filters('comment_form_default_fields', $appointment_comment_fields),
                'comment_field' => '
            <div class="blog-form-group-textarea" >
            <p >请输入验证码:<img src="getcode.php" id="qingxinzui_get_code">
            <button onclick="getCode();" type="button">获取验证码</button>
            </p>
            <p><input type="text" name="code"></p>
			<textarea id="comments" rows="7" class="blog-form-control-textarea" name="comment" type="text" placeholder="' . esc_attr__('Leave your message', 'appointment') . '"></textarea></div>',
                'logged_in_as' => '<p class="blog-post-info-detail">' . esc_html__("Logged in as", 'appointment') . '<a href="' . esc_url(admin_url('profile.php')) . '">' . $user_identity . '</a>' . '<a href="' . esc_url(wp_logout_url(get_permalink())) . '" title="' . esc_attr__('Logout from this Account', 'appointment') . '">' . esc_html__("Logout", 'appointment') . '</a>' . '</p>'
                .'',
                'id_submit' => 'blogdetail-btn',
                'label_submit' => esc_html__('Send Message', 'appointment'),
                'comment_notes_after' => '',
                'comment_notes_before' => '',
                'title_reply' => '<div class="comment-title"><h3>' . esc_html__('Leave a Reply', 'appointment') . '</h3></div>',
                'id_form' => 'commentform'
            );

这里我们会请求一个getcode.php文件。我们在wordpress根目录创建一个getcode.php显示图片的文件

<?php 
session_start();
ob_clean();
$image = imagecreatetruecolor(100, 30); //创建一个100×30的画布
$white = imagecolorallocate($image,255,255,255);//白色
imagefill($image,0,0,$white);//覆盖黑色画布
$session = "";
$font = './th.ttf'; //字体

for($i=0;$i<4;$i++){
    $size = 24;
    $x = $i*25+7;  //每个字体的宽度
    $y = 25; //靠上边多少
    $sizi_color = imagecolorallocate($image,mt_rand(100,220),mt_rand(100,220),mt_rand(100,220));
    $char = join("",array_merge(range('a','z'),range(0,9)));   //range('a','z'),range('A','Z'),range(0,9)
    $char = str_shuffle($char);
    $char = substr($char,0,1);
    imagettftext($image,$size,0,$x,$y,$sizi_color,$font,$char);
    $session .= $char ;
}
for($k=0;$k<200;$k++){
    $rand_color = imagecolorallocate($image,mt_rand(100,200),mt_rand(100,200),mt_rand(100,200));
    imagesetpixel($image,mt_rand(1,99),mt_rand(1,29),$rand_color);
}
for($n=0;$n<5;$n++){
    $line_color = imagecolorallocate($image,mt_rand(80,220),mt_rand(80,220),mt_rand(80,220));
    imageline($image,mt_rand(1,99),mt_rand(1,29),mt_rand(1,99),mt_rand(1,29),$line_color);
}
$_SESSION['code'] = $session; 
header('content-type:image/png');//设置文件输出格式
imagepng( $image ); //以png格式输出$image图像
imagedestroy( $image ); //销毁图像
?>

这里我们需要一个th.ttf的字体包,下载ttf字体并且放到wordpress根目录

这个时候,默认就会引用出图片了,但是可能图片会有过期,所以需要一个JS的getCode()方法来获取最新的图片验证码

在对应模板footer.php最底下添加:

<script>
    function getCode(){
        var demoDom = document.getElementById("qingxinzui_get_code");
        demoDom.src = "getcode.php";
    }
</script>

这样默认打开初始化图片,或者人工点获取图片就已经完成了,然后接着就是校验了。

根目录的:wp-comments-post.php文件里

nocache_headers();

在这后面添加校验,因为前面是以SESSION的方式存储。

nocache_headers(); 
//这里开始添加
session_start();
if(!$_SESSION['code']){
	wp_die(
		'<p>验证码失效</p>',
		__( 'Comment Submission Failure' ),
		array(
			'response'  => $data,
			'back_link' => true,
		)
	);exit;
}
if(empty($_POST['code'])){
	wp_die(
		'<p>请填写验证码</p>',
		__( 'Comment Submission Failure' ),
		array(
			'response'  => $data,
			'back_link' => true,
		)
	);exit;
}

if($_SESSION['code'] != $_POST['code']){
	wp_die(
		'<p>验证码不正确</p>',
		__( 'Comment Submission Failure' ),
		array(
			'response'  => $data,
			'back_link' => true,
		)
	);exit;
}
//这里结束添加。进入wordpress内部的内容
$comment = wp_handle_comment_submission( wp_unslash( $_POST ) );

最后在wp-comments-post.php文件底部写入数据库之后,进行销毁session

unset($_SESSION['code']);
wp_safe_redirect( $location ); //wp-comments-post.php文件最后的动作

关于作者

清心醉 administrator

发表评论

请输入验证码: