captcha 使用_使用No Captcha reCaptcha防止对WordPress进行Bot攻击

captcha 使用

There are many different solutions to prevent bots from submitting web forms; one of the most popular solutions is reCaptcha. reCaptcha actually displays an image with some text in it and user has to enter the text to submit the form successfully. It was difficult for bots to read the text on the image, but as bots algorithms become more advanced, they started breaking this security. It was no more safe. This old method is pretty bad in terms of user friendliness. Then Google created a new reCaptcha called No Captcha reCaptcha.

有许多不同的解决方案可以防止漫游器提交Web表单。 最受欢迎的解决方案之一是reCaptcha。 reCaptcha实际上会显示其中包含一些文本的图像，用户必须输入文本才能成功提交表单。 僵尸程序很难读取图像上的文本，但是随着僵尸程序算法变得越来越先进，他们开始破坏这种安全性。 这不再安全了。 就用户友好性而言，这种旧方法非常糟糕。 然后Google创建了一个新的reCaptcha，称为No Captcha reCaptcha。

In this tutorial we will look at what exactly No Captcha reCaptcha is and how to create a plugin which integrates reCaptcha in WordPress Login, Registration and Comment forms to prevent various types of attacks.

在本教程中，我们将查看No Captcha reCaptcha到底是什么，以及如何创建将reCaptcha集成到WordPress登录，注册和评论表单中的插件，以防止各种类型的攻击。

看看没有验证码reCaptcha (A Look at No Captcha reCaptcha)

No Captcha reCaptcha just displays a checkbox asking the user to check it if he/she is not a bot. It might look very hackable but internally Google uses advanced algorithms and methods to find if the user is a bot or not. This new model is more user friendly and secure than the old one.

没有Captcha reCaptcha只会显示一个复选框，要求用户检查他/她是否不是机器人。 它看起来可能很容易被黑客入侵，但是Google内部使用高级算法和方法来确定用户是否是机器人。 这种新模型比旧模型更加用户友好和安全。

它是如何工作的？ (How Does it Work?)

It may seem like a simple checkbox but it's not a checkbox at all. Its a graphics that behaves like a checkbox. Most bots don't run JavaScript so they cannot emulate it. But for the bots which can emulate, this is tracked down by mouse movement and Google's Adsense fraud click detection algorithms.

它可能看起来像一个简单的复选框，但根本不是一个复选框。 它的图形行为类似于复选框。 大多数漫游器不会运行JavaScript，因此无法对其进行仿真。 但是对于可以模仿的机器人来说，可以通过鼠标移动和Google的Adsense欺诈点击检测算法来追踪。

注册无验证码reCaptcha应用程序 (Registerating a No Captcha reCaptcha App)

Users who install this plugin need to register their website to retrieve a site key and secret key.

安装此插件的用户需要注册其网站才能检索站点密钥和秘密密钥。

You need to create a settings page for the plugin which allows the WordPress administrator to install the site key and secret key they retrieved from reCaptcha admin panel.

您需要为插件创建一个设置页面，该页面允许WordPress管理员安装从reCaptcha管理面板中检索到的站点密钥和秘密密钥。

function 
no_captcha_recaptcha_menu()
{
    add_menu_page( "reCapatcha Options", "reCaptcha Options", "manage_options", "recaptcha-options", "recaptcha_options_page", "", 100 );
}

function recaptcha_options_page()
{
    ?>
        <div class="wrap">
        <h1>reCaptcha Options</h1>
        <form method="post" action="options.php">
            <?php
                settings_fields( "header_section" );
                do_settings_sections( "recaptcha-options" );
                submit_button();                     
            ?>          
        </form>
    </div>
    <?php
}

add_action( "admin_menu", "no_captcha_recaptcha_menu" );

function display_recaptcha_options()
{
    add_settings_section( "header_section", "Keys", "display_recaptcha_content", "recaptcha-options" );

    add_settings_field( "captcha_site_key", __("Site Key"), "display_captcha_site_key_element", "recaptcha-options", "header_section" );
    add_settings_field( "captcha_secret_key", __("Secret Key"), "display_captcha_secret_key_element", "recaptcha-options", "header_section" );

    register_setting( "header_section", "captcha_site_key" );
    register_setting( "header_section", "captcha_secret_key" );
}

function display_recaptcha_content()
{
    echo __( '<p>You need to <a href="https://www.google.com/recaptcha/admin" rel="external">register you domain</a> and get keys to make this plugin work.</p>' );
    echo __( "Enter the key details below" );
}
function display_captcha_site_key_element()
{
    ?>
        <input type="text" name="captcha_site_key" id="captcha_site_key" value="<?php echo get_option('captcha_site_key'); ?>" />
    <?php
}
function display_captcha_secret_key_element()
{
    ?>
        <input type="text" name="captcha_secret_key" id="captcha_secret_key" value="<?php echo get_option('captcha_secret_key'); ?>" />
    <?php
}

add_action( "admin_init", "display_recaptcha_options" );

Let's see how the above code works:

让我们看看上面的代码如何工作：

• We created a settings page on the WordPress admin dashboard.
  我们在WordPress管理仪表板上创建了一个设置页面。
• This settings page displays two input text fields for site key and secret key.
  此设置页面显示站点密钥和秘密密钥的两个输入文本字段。

• These keys are stored as WordPress options. We name the options as site_key and secret_key

  这些密钥存储为WordPress选项。 我们将选项命名为site_key和secret_key

防止垃圾评论 (Preventing Comment Spams)

You need to integrate reCaptcha in front end comments forms to prevent bots from putting spam comments.

您需要将reCaptcha集成到前端评论表单中，以防止漫游器放置垃圾评论。

Create a style.css file in your plugin directory and place this code

在您的插件目录中创建一个style.css文件并放置此代码

#submit { display: none; }

The above code hides the submit button in the WordPress comment form so that we can place the reCaptcha box above the submit button by inserting both submit button and reCaptcha box manually.

上面的代码在WordPress注释表单中隐藏了提交按钮，以便我们可以通过手动插入提交按钮和reCaptcha框将reCaptcha框放置在Submit按钮上方。

Here is the code to integrate reCaptcha on comment forms

这是在注释表单上集成reCaptcha的代码

add_action( "wp_enqueue_scripts", "frontend_recaptcha_script" );

function frontend_recaptcha_script()
{
    if( get_option( 'captcha_site_key' ) && get_option( 'captcha_secret_key' ) )
    {
        wp_register_script( "recaptcha", "https://www.google.com/recaptcha/api.js" );
        wp_enqueue_script( "recaptcha" );

        $plugin_url = plugin_dir_url( __FILE__ );

        wp_enqueue_style( "no-captcha-recaptcha", $plugin_url . "style.css" );
    }   
}

add_action( "comment_form", "display_comment_recaptcha" );

function display_comment_recaptcha()
{
    if( get_option( 'captcha_site_key' ) && get_option( 'captcha_secret_key' ) )
    {
        ?>
            <div class="g-recaptcha" data-sitekey="<?php echo get_option( 'captcha_site_key' ); ?>"></div>
            <input name="submit" type="submit" value="Submit Comment">
        <?php   
    }

}

add_filter( "preprocess_comment", "verify_comment_captcha" );

function verify_comment_captcha( $commentdata )
{
    if( isset( $_POST['g-recaptcha-response'] ) )
    {
        $recaptcha_secret = get_option( 'captcha_secret_key' );
        $response = file_get_contents( "https://www.google.com/recaptcha/api/siteverify?secret=" . $recaptcha_secret . "&response=" .$_POST['g-recaptcha-response'] );
        $response = json_decode( $response, true );
        if( true == $response["success"] )
        {
            return $commentdata;
        }
        else
        {
            echo __( "Bots are not allowed to submit comments." );
            return null;
        }
    }
    else
    {
        if( get_option( 'captcha_site_key' ) && get_option( 'captcha_secret_key' ) )
        {
            echo __( "Bots are not allowed to submit comments. If you are not a bot then please enable JavaScript in browser." );
            return null;    
        }   
        else
        {
            return $commentdata;
        }
    }
}

Let's see how the above code works:

让我们看看上面的代码如何工作：

• We en-queued Google's reCaptcha JavaScript file to WordPress frontend by using wp_enqueue_scripts action.

  我们使用wp_enqueue_scripts操作将Google的reCaptcha JavaScript文件排队到WordPress前端。

• We also en-queued the style.css file using wp_enqueue_style

  我们还使用wp_enqueue _style将style.css文件排队

• Inside the comment form we display the checkbox using comment_form action.

  在评论表单中，我们使用comment_form操作显示复选框。

• When the comment is submitted and before inserting it to the database, WordPress calls the preprocess_comment filter. Inside the filter we check if the user is human or bot. If human then we return the comment to be inserted otherwise we return null to prevent the comment from being added to database.

  提交评论后以及将其插入数据库之前，WordPress会调用preprocess_comment过滤器。 在过滤器内部，我们检查用户是人类还是机器人。 如果是人类，则返回要插入的注释，否则返回null以防止将注释添加到数据库。

防止暴力登录攻击 (Preventing Brute Force Login Attacks)

We need to integrate reCaptcha in the admin login form to prevent bots from running a brute force attack to crack passwords. Here is the code to integrate it on admin login form

我们需要将reCaptcha集成到管理员登录表单中，以防止僵尸程序进行暴力攻击来破解密码。 这是将其集成到管理员登录表单中的代码

add_action( "login_enqueue_scripts", "login_recaptcha_script" );

function login_recaptcha_script()
{
    if( get_option( 'captcha_site_key' ) && get_option( 'captcha_secret_key' ) )
    {
        wp_register_script( "recaptcha_login", "https://www.google.com/recaptcha/api.js" );
        wp_enqueue_script( "recaptcha_login" );
    }
}

add_action( "login_form", "display_login_captcha" );

function display_login_captcha()
{
    if( get_option( 'captcha_site_key' ) && get_option( 'captcha_secret_key' ) )
    {
        ?>
            <div class="g-recaptcha" data-sitekey="<?php echo get_option('captcha_site_key' ); ?>"></div>
        <?php
    }   
}

add_filter( "wp_authenticate_user", "verify_login_captcha", 10, 2 );

function verify_login_captcha( $user, $password )
{
    if( isset( $_POST['g-recaptcha-response'] ) )
    {
        $recaptcha_secret = get_option( 'captcha_secret_key' );
        $response = file_get_contents( "https://www.google.com/recaptcha/api/siteverify?secret=" . $recaptcha_secret . "&response=" . $_POST['g-recaptcha-response'] );
        $response = json_decode( $response, true );
        if( true == $response["success"] )
        {
            return $user;
        }
        else
        {
            return new WP_Error( "Captcha Invalid", __( "<strong>ERROR</strong>: You are a bot" ) );
        } 
    }
    else
    {
        if( get_option( 'captcha_site_key' ) && get_option( 'captcha_secret_key' ) )
        {
            return new WP_Error( "Captcha Invalid", __( "<strong>ERROR</strong>: You are a bot. If not then enable JavaScript" ) );
        }
        else
        {
            return $user;
        }
    }   
}

Let's see how the above code works:

让我们看看上面的代码如何工作：

• We en-queued Google's reCaptcha JavaScript file to WordPress admin login, registration and lost password pages by using the login_enqueue_scripts action.

  我们使用login_enqueue_scripts操作将Google的reCaptcha JavaScript文件排队到WordPress管理员登录，注册和密码丢失页面中。

• We displayed the checkbox using the login_form action.

  我们使用login_form操作显示了该复选框。

• Before producing the final authentication result, WordPress runs the wp_authenticate_user filter to let us add a extra validation step. We check if the user is bot or human inside this filter. If its human we return the user object else we return and WordPress error object.

  在产生最终的验证结果之前，WordPress运行wp_authenticate_user过滤器，让我们添加一个额外的验证步骤。 我们检查该过滤器中的用户是机器人还是人。 如果是人类，我们返回用户对象，否则返回WordPress错误对象。

防止创建假账户 (Preventing Creation of Fake Accounts)

We need to integrate reCaptcha in the admin registration form to prevent bots from creating fake accounts. Here is the code to integrate it on admin registration form

我们需要将reCaptcha集成到管理员注册表单中，以防止漫游器创建虚假帐户。 这是将其集成到管理员注册表中的代码

add_action( "register_form", "display_register_captcha" );

function display_register_captcha()
{
    if( get_option( 'captcha_site_key' ) && get_option( 'captcha_secret_key' ) )
    {
        ?>
            <div class="g-recaptcha" data-sitekey="<?php echo get_option( 'captcha_site_key' ); ?>"></div>
        <?php   
    }       
}

add_filter( "registration_errors", "verify_registration_captcha", 10, 3 );

function verify_registration_captcha( $errors, $sanitized_user_login, $user_email )
{
    if( isset( $_POST['g-recaptcha-response'] ) )
    {
        $recaptcha_secret = get_option( 'captcha_secret_key' );
        $response = file_get_contents( "https://www.google.com/recaptcha/api/siteverify?secret=" . $recaptcha_secret . "&response=" . $_POST['g-recaptcha-response'] );
        $response = json_decode( $response, true );
        if( true == $response["success"] )
        {
            return $errors;
        }
        else
        {
            $errors->add( "Captcha Invalid", __( "<strong>ERROR</strong>: You are a bot" ) );
        }
    }
    else
    {   
        if( get_option( 'captcha_site_key' ) && get_option( 'captcha_secret_key' ) )
        {
            $errors->add( "Captcha Invalid", __( "<strong>ERROR</strong>: You are a bot. If not then enable JavaScript" ) );
        }
        else
        {
            return $errors;
        }

    }   

    return $errors;
}

Let's see how the above code works:

让我们看看上面的代码如何工作：

• We displayed the checkbox using register_form action.

  我们使用register_form操作显示了该复选框。

• Before producing the final authentication result WordPress runs the registration_errors filter to let us add a extra validation step. We check if the user is bot or human inside this filter. If its human we return empty error object else we add a add to the error object and return it.

  在产生最终的身份验证结果之前，WordPress将运行registration_errors过滤器，让我们添加一个额外的验证步骤。 我们检查该过滤器中的用户是机器人还是人。 如果是人类，我们返回空的错误对象，否则我们向错误对象添加一个add并返回它。

防止机器人提交丢失的密码表格 (Preventing Bots Submitting Lost Password Form)

We need to integrate reCaptcha in the admin lost password form to prevent bots from submitting this form. Here is the code to integrate it on admin lost password form

我们需要将reCaptcha集成到“管理员密码丢失”表单中，以防止漫游器提交此表单。 这是将其集成到管理员密码丢失表单中的代码

add_action( "lostpassword_form", "display_login_captcha" );
add_action( "lostpassword_post", "verify_lostpassword_captcha" );

function verify_lostpassword_captcha()
{
    if( isset( $_POST['g-recaptcha-response'] ) )
    {
        $recaptcha_secret = get_option( 'captcha_secret_key' );
        $response = file_get_contents( "https://www.google.com/recaptcha/api/siteverify?secret=" . $recaptcha_secret . "&response=" . $_POST['g-recaptcha-response'] );
        $response = json_decode( $response, true );
        if( true == $response["success"] )
        {
            return;
        }
        else
        {
            wp_die( __( "<strong>ERROR</strong>: You are a bot" ) );
        }
    }
    else
    {
        if( get_option( 'captcha_site_key' ) && get_option( 'captcha_secret_key' ) )
        {
            wp_die( __( "<strong>ERROR</strong>: You are a bot. If not then enable JavaScript" ) ); 
        }
        else
        {
            return;
        }

    }   

    return $errors; 
}

Let's see how the above code works:

让我们看看上面的代码如何工作：

• We displayed the checkbox using lostpassword_form action.

  我们使用lostpassword_form操作显示了该复选框。

• Before producing the final password reset link WordPress runs the lostpassword_post action to let us add a extra validation step. We check if the user is bot or human inside this filter. If its human we return nothing else we kill the script with an error message.

  在生成最终的密码重设链接之前，WordPress将运行lostpassword_post操作，以使我们添加额外的验证步骤。 我们检查该过滤器中的用户是机器人还是人。 如果它是人类，我们什么也不会返回，我们会通过错误消息杀死脚本。

最后的想法 (Final Thoughts)

Its a new way to protect your website forms from bots and increase user friendliness. You can also learn how Google detects bot or human internally using this new type of captcha. Once you have integrated this plugin in your WordPress site write your experiences below.

它是一种保护您的网站表单免受机器人攻击并提高用户友好性的新方法。 您还可以了解Google如何使用这种新型的验证码在内部检测机器人或人类 。 将这个插件集成到WordPress网站后，请在下面写下您的经验。

翻译自: https://davidwalsh.name/preventing-bot-attacks-wordpress-captcha-recaptcha

captcha 使用