Woocommerce - 如何将新的Google“no Captcha”reCaptcha添加到前端注册表单中

时间:2021-04-01 15:47:47

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

我需要在前端Woocommerce注册表单页面中使用新的Google“no Captcha”reCaptcha。

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":

以及文件“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.

显然,“xxxxxxxxx MY ID xxxxxxxxx”是我的谷歌身份证代码。

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 个解决方案

#1


6  

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

Stimart打开这个问题已经有一段时间了,但是如果有人需要,我会在这里给出我的建议。

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.

Stimart这里需要添加一些PHP代码来验证当用户勾选reCaptcha框以确认它们不是机器人时谷歌发送到页面的reCaptcha响应值。

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

困难的方法是在functions.php文件中写这样的东西:

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.

您可以查看这篇文章http://www.themelocation.com/how-to-add-custom-fields-to-user-registration-form-in-woocommerce/以及此插件的方式https://wordpress.org/ plugins / theme-my-login /处理这个问题。

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

或者更容易安装和设置像这样的插件。 ;)

Hope that it helps. :)

希望它有所帮助。 :)

#1


6  

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

Stimart打开这个问题已经有一段时间了,但是如果有人需要,我会在这里给出我的建议。

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.

Stimart这里需要添加一些PHP代码来验证当用户勾选reCaptcha框以确认它们不是机器人时谷歌发送到页面的reCaptcha响应值。

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

困难的方法是在functions.php文件中写这样的东西:

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.

您可以查看这篇文章http://www.themelocation.com/how-to-add-custom-fields-to-user-registration-form-in-woocommerce/以及此插件的方式https://wordpress.org/ plugins / theme-my-login /处理这个问题。

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

或者更容易安装和设置像这样的插件。 ;)

Hope that it helps. :)

希望它有所帮助。 :)