Woocommerce - How to add the new Google “no Captcha” reCaptcha into frontend registration form

问题

I need to use the new Google "no Captcha" reCaptcha in frontend Woocommerce registration form page.

I've inserted following code before the < / head > tag:

<script src='https://www.google.com/recaptcha/api.js'></script>

and this one inside form tab in file "woocommerce\myaccount\form-login.php":

<div class="g-recaptcha" data-sitekey="xxxxxxxxx MY ID xxxxxxxxx"></div>

where, obviously, "xxxxxxxxx MY ID xxxxxxxxx" is my google id code.

It shows the new captcha box but if I try to register a new user without check the captcha, it doesn't stops registration process and complete registration without errors.

回答1:

It's being a while since Stimart opened this question but I'll give here my suggestion in case someone needed it.

Stimart here need to add some PHP code to validate the reCaptcha response value that google sends to the page when the user ticks the reCaptcha box to confirm they are not a robot.

The hard way would be to write something like this in the functions.php file:

function wooc_validate_re_captcha_field( $username, $email, $wpErrors )
{
    $remoteIP = $_SERVER['REMOTE_ADDR'];
    $recaptchaResponse = $_POST['g-recaptcha-response'];

    $response = wp_remote_post( 'https://www.google.com/recaptcha/api/siteverify', [
        'body' => [
            'secret'   => 'PRIVATE KEY HERE !!!',
            'response' => $recaptchaResponse,
            'remoteip' => $remoteIP
        ]
    ] );

    $response_code = wp_remote_retrieve_response_code( $response );
    $response_body = wp_remote_retrieve_body( $response );

    if ( $response_code == 200 )
    {
        $result = json_decode( $response_body, true );

        if ( ! $result['success'] )
        {
            switch ( $result['error-codes'] )
            {
                case 'missing-input-secret':
                case 'invalid-input-secret':
                    $wpErrors->add( 'recaptcha', __( '<strong>ERROR</strong>: Invalid reCAPTCHA secret key.', 'woocommerce' ) );
                    break;

                case 'missing-input-response' :
                case 'invalid-input-response' :
                    $wpErrors->add( 'recaptcha', __( '<strong>ERROR</strong>: Please check the box to prove that you are not a robot.', 'woocommerce' ) );
                    break;

                default:
                    $wpErrors->add( 'recaptcha', __( '<strong>ERROR</strong>: Something went wront validating the reCAPTCHA.', 'woocommerce' ) );
                    break;
            }
        }
    }
    else
    {
        $wpErrors->add( 'recaptcha_error', __( '<strong>Error</strong>: Unable to reach the reCAPTCHA server.', 'woocommerce' ) );
    }
}
add_action( 'woocommerce_register_post', 'wooc_validate_re_captcha_field', 10, 3 );

You can check this article http://www.themelocation.com/how-to-add-custom-fields-to-user-registration-form-in-woocommerce/ and the way this plugin https://wordpress.org/plugins/theme-my-login/ handle this problem.

or a lot easier is to install and set up a plugin like this one. ;)

Hope that it helps. :)

来源：https://stackoverflow.com/questions/27493499/woocommerce-how-to-add-the-new-google-no-captcha-recaptcha-into-frontend-reg

标签

wordpress

forms

woocommerce

registration

captcha