ARCANEDEV / noCAPTCHA

:passport_control: Helper for Google's new noCAPTCHA (reCAPTCHA v2 & v3)
MIT License
358 stars 56 forks source link

RecaptchaV3. Error «incorrect-captcha-sol» #110

Open suddhah opened 1 year ago

suddhah commented 1 year ago

Description:

When verifying the request, the error "incorrect-captcha-sol" is returned. I tried recreating recaptcha keys, different connection methods, clearing browser cookies, opening the site through a different browser.

Steps To Reproduce:

For example FeedbackController.php file:

public function post(Request $request)
{
    $captcha = new NoCaptchaV3(
        'RECAPTCHAV3_SECRET',
        'RECAPTCHAV3_SITEKEY'
    );

    if ($request->all() && $request['g-recaptcha-response']) {
        $response = $captcha->verify($request['g-recaptcha-response'] ?? null);

        if ($response->isSuccess()) {
            ...
        } else {
            dd($response);
        }
    }
}

feedback.blade.php:

<form action="{{ route('feedback.post') }}" method="POST" name="formFeedback" class="contact-form contact__form">
    {{ csrf_field() }}
    <input type="hidden" value="{{$page}}" name="page" />
    <input class="contact-form__input" name="phone" type="text" placeholder="Телефон*">
    <input class="contact-form__input" name="name" type="text" placeholder="Имя">
    <textarea class="contact-form__input contact-form__area" name="msg" placeholder="Текст сообщения"></textarea>
    <span class="contact-form__policy">Нажимая "Отправить" вы соглашаетесь с политикой обработки персональных данных</span>
    <input class="contact-form__btn btn" type="submit" value="Отправить">

    {{ no_captcha()->input('g-recaptcha-response') }}
</form>

{{ no_captcha()->script() }}
{{ no_captcha()->getApiScript() }}

<script>
    grecaptcha.ready(() => {
        window.noCaptcha.render('formFeedback', (token) => {
            let recaptchaInputs = document.querySelectorAll('#g-recaptcha-response');
            recaptchaInputs.forEach(function (element) {
                element.value = token;
            });
        });
    });
</script>

main.js:

const recaptchaSitekey = 'RECAPTCHAV3_SITEKEY';

$('.contact-form').on('submit', function(e) {
    e.preventDefault();
    var formData = $(this).serializeArray().reduce(function(obj, item) {
        obj[item.name] = item.value;
        return obj;
    }, {});

    let url = $(this).attr('action');
    return axios
        .post(url, formData)
        .then(function(res) {
            if(res.data.status=='ok'){
                notifier.success('Спасибо, ваше сообщение успешно отправлено!');

                grecaptcha.reset(recaptchaSitekey);
                grecaptcha.ready(() => {
                    window.noCaptcha.render('thatForm', (token) => {
                        var recaptchaInputs = document.querySelectorAll('#g-recaptcha-response');
                        recaptchaInputs.forEach(function (element) {
                            element.value = token;
                        });
                    });
                });
            }
            else{
                notifier.alert('Что-то пошло не так :( Попробуйте позже...')
            }
        })
        .catch(error => {
            notifier.alert('Что-то пошло не так :( Попробуйте позже...')

            console.error(error);
        });
})