使用 Gregwar Captcha 为 WordPress 表单添加验证码实现表单验证

Posted on Updated on

验证码可以在很大程度上防止机器注册，恶意注册等表单提交类型的攻击。WordPress 没有提供验证码机制，于是有很多插件为 WordPress 提供了验证码支持，对于普通用户，直接安装一个验证码插件就可以在 WordPress 站点上实现验证码功能了。而对于开发者来说，如果每个功能都用插件来实现，那安装的插件就太多了，插件太多会拖慢网站的速度。很多负责任有追求的开发者会自己实现一个类似的功能。今天为大家介绍一个不用插件实现验证码的方法。

安装 URL router 库和生成验证码的库并引入
使用 Gregwar Captcha 生成验证码的方法非常简单，只需要实例化 CaptchaBuilder 类，新建一个对象就可以了。在下面的对象中，WordPress Dispatch 是我们用来创建请求网址的类库。

require_once( dirname( FILE ) . ‘/../vendor/autoload.php’ );

use Gregwar\Captcha\CaptchaBuilder;
use TheFold\WordPress\Dispatch;

new Dispatch( [

'captcha/([a-z0-9]+)' => function ( $request, $type ) {

    // 生成验证码
    $builder = new CaptchaBuilder;

    // 把生成的验证码写入 WordPress 数据库中，供第三步中验证使用
    update_option( $type . '_captcha', $builder->getPhrase());

    // 输出验证码
    header( 'Content-type: image/jpeg' );
    $builder->build()->output();

},

] );
在表单中显示生成的验证码，点击图片刷新验证码。
在前端显示验证码的方法非常简单，只需要把验证码图片的 src 地址设置为我们上面新建的 URL 就可以了，网址中“captcha/”后面的字符串是验证码的类型，供区分不同的验证码使用。 验证码

刷新验证码用到的 JacaScript 函数非常简单，也就是当用户点击图片时，重新加载图片，在这是给验证码图片加上了一个随机的字符串，防止缓存导致图片不刷新。

对比用户提交的验证码和程序生成的验证码。
当用户提交表单的时候，我们获取用户提交过来的验证码，并和生成验证码时保存在数据库中的验证码做对比，如果对比通过，则说明验证码正确，如果对比失败，验证码错误，返回错误信息。

$account_captcha = $_POST[ ‘captcha’ ];
if ( ! strcasecmp( get_option( ‘account_captcha’ ), $account_captcha ) == 0 ) {
//进行注册操作
} else {
$msg = [
‘registered’ => false,
‘message’ => __( ‘

验证码错误.’, ‘ wizhi’ ),
];
}

wp_send_json( $msg );
至此，使用 Gregwar Captcha 为 WordPress 表单添加验证码的方法就介绍完毕了，可以看出，整个过程中需要的代码量非常小。如此，我们就可以把我们的精力集中在完善业务逻辑上了，花在业务逻辑上的时间多了，相信开发出来的程序 Bug 会少很多，使用起来会更加稳定。