Капча как у Google

Оптимизируйте свои подборки Сохраняйте и классифицируйте контент в соответствии со своими настройками.

reCAPTCHA v3 возвращает оценку для каждого запроса без трения со стороны пользователя. Оценка основана на взаимодействии с вашим сайтом и позволяет вам предпринять соответствующие действия для вашего сайта. Зарегистрируйте ключи reCAPTCHA v3 в консоли администратора reCAPTCHA .

На этой странице объясняется, как включить и настроить reCAPTCHA v3 на вашей веб-странице.

Размещение на вашем сайте

reCAPTCHA v3 никогда не будет прерывать работу ваших пользователей, поэтому вы можете запускать ее в любое время, не влияя на конверсию. reCAPTCHA работает лучше всего, когда у нее есть наибольший контекст взаимодействия с вашим сайтом, который возникает из-за того, что вы видите как законное, так и оскорбительное поведение. По этой причине мы рекомендуем включать проверку reCAPTCHA в формах или действиях, а также в фоновом режиме страниц для аналитики.

Примечание. Срок действия токенов reCAPTCHA истекает через две минуты. Если вы защищаете действие с помощью reCAPTCHA, обязательно вызовите execute , когда пользователь выполняет действие, а не при загрузке страницы.

How to Bypass CAPTCHA Verification in Google Chrome — (2023)

Вы можете выполнить reCAPTCHA для любого количества действий на одной странице.

Автоматически привязывать вызов к кнопке

Самый простой способ использовать reCAPTCHA v3 на вашей странице — включить необходимый ресурс JavaScript и добавить несколько атрибутов к вашей html-кнопке.

Загрузите API JavaScript.

function onSubmit(token)
Submit

Программно вызвать вызов

Если вы хотите иметь больший контроль над запуском reCAPTCHA, вы можете использовать метод execute в объекте grecaptcha . Для этого вам нужно добавить параметр render в загрузку скрипта reCAPTCHA.

Загрузите API JavaScript с помощью своего ключа сайта.

function onClick(e) < e.preventDefault(); grecaptcha.ready(function() < grecaptcha.execute(‘reCAPTCHA_site_key’, ).then(function(token) < // Add your logic to submit to your backend server here. >); >); >

Интерпретация счета

reCAPTCHA v3 возвращает оценку (1.0, скорее всего, хорошее взаимодействие, 0.0, скорее всего, бот). На основе оценки вы можете предпринимать различные действия в контексте вашего сайта.

Каждый сайт уникален, но ниже приведены несколько примеров того, как сайты используют оценку. Как и в приведенных ниже примерах, примите меры за кулисами, а не блокируйте трафик, чтобы лучше защитить свой сайт.

Вариант использования Рекомендация

домашняя страница	Просматривайте единое представление о своем трафике в консоли администратора во время фильтрации парсеров.
авторизоваться	При низких баллах требуется двухфакторная аутентификация или проверка электронной почты, чтобы предотвратить атаки с заполнением учетных данных.
Социальное	Ограничьте безответные запросы в друзья от оскорбительных пользователей и отправляйте рискованные комментарии на модерацию.
электронная коммерция	Ставьте свои реальные продажи выше продаж ботов и выявляйте рискованные транзакции.

reCAPTCHA учится, видя реальный трафик на вашем сайте. По этой причине оценки в промежуточной среде или вскоре после внедрения могут отличаться от производственных. Поскольку reCAPTCHA v3 никогда не прерывает поток пользователей, вы можете сначала запустить reCAPTCHA без каких-либо действий, а затем выбрать пороговые значения, просмотрев свой трафик в консоли администратора . По умолчанию вы можете использовать порог 0,5.

Действия

reCAPTCHA v3 представляет новую концепцию: действия. Когда вы указываете имя действия в каждом месте выполнения reCAPTCHA, вы включаете следующие новые функции:

• Подробная разбивка данных по десяти основным действиям в консоли администратора.
• Адаптивный анализ рисков, основанный на контексте действия, поскольку оскорбительное поведение может варьироваться.

Важно отметить, что при проверке ответа reCAPTCHA вы должны убедиться, что имя действия соответствует ожидаемому.

Примечание. Действия могут содержать только буквенно-цифровые символы, косые черты и символы подчеркивания. Действия не должны быть специфичными для пользователя.

Ответ на проверку сайта

Сделайте запрос на проверку токена ответа , как в случае с reCAPTCHA v2 или Invisible reCAPTCHA.

Ответ представляет собой объект JSON:

Советы

1. grecaptcha.ready() запускает вашу функцию при загрузке библиотеки reCAPTCHA. Чтобы избежать условий гонки с помощью api.js , включите api.js перед сценариями, вызывающими grecaptcha, или продолжайте использовать обратный вызов onload , определенный в API версии 2.
2. Попробуйте подключить вызов execute к интересным или конфиденциальным действиям, таким как Регистрация, Сброс пароля, Покупка или Игра.
3. Используйте https://www.google.com/recaptcha/api.js?trustedtypes=true для загрузки кода, совместимого с Trusted Types .

Если не указано иное, контент на этой странице предоставляется по лицензии Creative Commons «С указанием авторства 4.0», а примеры кода – по лицензии Apache 2.0. Подробнее об этом написано в правилах сайта. Java – это зарегистрированный товарный знак корпорации Oracle и ее аффилированных лиц.

Последнее обновление: 2023-02-14 UTC.

Источник: developers.google.com

Защита форм от спама «невидимой» Google reCAPTCHA v3 без потери баллов по PageSpeed Insight

Периодически возникал вопрос по защите от ботов различных форм на сайте: регистрация, авторизация, подписка на рассылку, обратная связь, комментирование и т.д.

Стандартная капча — бесполезная, ботами она проходится «на раз», а пользователям создает проблемы.

Оптимальное решение это использовать Google reCAPTCHA v2 или v3. Обе версии Google reCAPTCHA — отличный вариант. Это лучшее, что сейчас доступно на рынке из понятных и надежных решений к тому же бесплатных.

Основная проблема у обеих версий — при подключении значительно снижаются баллы по PageSpeed Insight на 20-30.

Пример reCAPTCHA v2 — требует угадывать картинки

Пример reCAPTCHA v3 — не требует от пользователя действий, в фоне анализирует его поведение

Важный для меня момент — не создавать проблемы реальным пользователям, т.к. я сам не большой любитель угадывать транспортные средства в reCAPTCHA v2, поэтому мой выбор v3.

Итак две проблемы Google reCAPTCHA v3, которые необходимо решить:

• висящий логотип в нижнем правом углу;
• потеря 20-30 баллов по Google PageSpeed Insight.

В лицензионном соглашении Google допускает убрать логотип, скрыв его через CSS.

.grecaptcha-badge

Взамен под каждой формой написать «Защита от спама reCAPTCHA Конфиденциальность и Условия использования» со ссылками на соответствующие страницы Google.

Потеря баллов по Google PageSpeed Insight

При подключении javascript-файла от reCAPTCHA v3, сильно снижаются баллы по Google PageSpeed Insight. Для меня это было критично. Думаю, что это связано с анализом поведения пользователей (подобное снижение происходит при использовании вебвизора в Яндекс.Метрике).

На хорошо оптимизированных ресурсах можно потерять 20-30 баллов. Поэтому использовать её на отдельных страницах, где скорость не важна (например, контактов) можно и без модификаций. Для использования на всём сайте (например, для защиты сквозной формы авторизации или подписки на рассылку) желательно сделать модификацию.

Я придумал вариант инициализировать reCAPTCHA v3 по клику на поля формы. По умолчанию javascript-файл от reCAPTCHA v3 не загружаю, и только если пользователь поставил курсор на одно из полей формы выполняю его загрузку. Скорее всего данный метод снижает точность определения реальных пользователей, но проблем не возникало. Для моих задач данной точности хватает.

Данную методику начал применять сначала на веб-формах 1С-Битрикс, далее для сквозных форм авторизации и подписки на рассылку на сайтах без Битрикса.

Ввиду того, что 1С-Битрикс публичная CMS, расскажу в общих чертах на её примере — про методику и возможный вариант использования. Более тонкую настройку можно сделать под свои потребности.

Использование Google reCAPTCHA v3 в веб-формах 1С-Битрикс

1. Форму вызываем стандартным компонентом bitrix:form и делаем 2 дополнения:

• Заменяем кнопку button type=submit на обычный button type=button
• добавляем hidden поле name=g_recaptcha_response

2. Добавляем в javascript-файл сайта или компонента инициализацию reCAPTCHA при клике по полям формы (в этом примере я предполагаю, что вы используете jQuery):

$(‘body’).on(‘click’,’form input, form textarea’, function() < if (typeof(grecaptcha) == ‘undefined’) < var grecaptcha_s = document.createElement(‘script’); grecaptcha_s.src = ‘https://www.google.com/recaptcha/api.js?render=’; var grecaptcha_h = document.getElementsByTagName(‘script’)[0]; grecaptcha_h.parentNode.insertBefore(grecaptcha_s,grecaptcha_h); > >);

3. Добавляем отслеживание клика по кнопке button в форме. Далее внутри, используем пример описанный в документации Google. Он заполняет поле g_recaptcha_response, которое мы будет использовать на последнем шаге для валидации пользователя.

$(‘body’).on(‘click’,’form button[name=»web_form_submit»]’, function() < grecaptcha.ready(function() < grecaptcha.execute(»,).then( function(token) < $(‘form input[name=»g_recaptcha_response»]’).val(token); var form_obj = $(‘form’); var event_obj = form_obj.get(0); BX.fireEvent(event_obj,’submit’); event_obj.submit(); >); >); >);

4. Отслеживаем event onBeforeResultAdd в init.php

Перед отправкой результатов формы делаем обращение на сервер Google с вашим , и значением из hidden поля g_recaptcha_response из формы.

В ответ получаем баллы данного пользователя:

• 1 это точно человек
• 0 точно робот
• Больше 0.5 можно считать человеком

AddEventHandler(«form»,»onBeforeResultAdd»,»onBeforeResultAddHandler»); function onBeforeResultAddHandler($WEB_FORM_ID,$arFields,$arrVALUES) < global $APPLICATION; $g_recaptcha_response = $arrVALUES[«g_recaptcha_response»]; if (!empty($g_recaptcha_response)) < $response = json_decode(file_get_contents(«https://www.google.com/recaptcha/api/siteverify?secret=.$g_recaptcha_response.».$_SERVER[«REMOTE_ADDR»]),true); $g_recaptcha_response_check = false; if (($response[«success»] and $response[«score»] >= 0.5 and $response[«action»] == ‘feedback’])) < $g_recaptcha_response_check = true; >if (!$g_recaptcha_response_check) < $APPLICATION->ThrowException(‘Не пройдена проверка Google reCAPTCHA v3.’); > > else < $APPLICATION->ThrowException(‘Не пройдена проверка Google reCAPTCHA v3.’); > >

В заключение

Данную методику можно использовать на любых сайтах и формах вне зависимости от CMS. Я привёл общие методики работы, которые можно применять в своём проекте.

Подобным образом можно поступить и с Google reCAPTCHA v2, инициализировать по клику на форме и просить пользователя установить галочку «Я не робот» и отгадать картинки, если потребуется. В данном случае это также сэкономит баллы по PageSpeed Insight и даст пользователю инструмент (выбирать картинки), чтобы доказать, что он не робот. Но как я уже говорил выше для меня самое важное, это не создавать пользователю преград.

• 1с-битрикс
• pagespeed insights
• recaptcha v3

• Разработка веб-сайтов
• 1С-Битрикс

Источник: habr.com

Установка reCaptcha на сайт: инструмент от Google

Привет, уважаемые читатели блога.

Сегодняшний обзор посвящен установке на свой сайт инструмента ReCaptcha. Мы разберемся для чего нужен данный сервис, а также поэтапно рассмотрим процесс его установки и настройки. Для тех, кто сталкивается с этим понятием впервые, читайте статью «Что такое антикапча?». Там объясняется понятие капчи, а также приводятся методы ее обхода для нужд вебмастера.

Рекапча: цели и назначение сервиса

Наверняка, каждому из вас доводилось подтверждать недоверчивому Гуглу, что вы не робот. В разное время такую проверку проходили различными способами. Так, нужно было прослушивать текст, а потом его вводить, либо печатать увиденные символы в отведенной для этого строке.

Сервис reCaptcha (усовершенствованная версия Captcha) был выкуплен компанией Google в 2009 году. Основным его назначением стала борьба со спамом и ботами. Но кроме того, reCaptcha использовалась для распознавания и оцифровки текста (газет, книг и т.п.).

С 2015 года для подтверждения того, что вы человек, достаточно поставить галочку напротив графы «Я не робот».

Но при использовании Tor-браузера придется помучаться с распознаванием картинок машин, витрин, дорог и прочего. Читайте «Что лучше: анонимный или открытый блог?».

Сегодня Google разрабатывает новую версию reCaptcha Invisible.

Но уже на этой стадии можно протестировать beta-версию «невидимой» рекапчи. Все эти разработки нацелены на избавление от спамных обращений, действий роботов. В том числе reCaptcha может быть свободно использована для защиты сайтов. Разберемся, как установить данную программу на свой блог.

Как установить reCaptcha на сайт: инструкция

Для начала требуется зарегистрировать свой сайт в сервисе. Переходим по ссылке на официальный сайт Google в раздел «recaptcha» — https://www.google.com/recaptcha/admin#list . Вводим url и выбираем тип рекапчи, который будем устанавливать.

Как видно на скриншоте есть три варианта:

• reCaptcha V2 – с помощью флажка «Я не робот»;
• Invisible reCaptcha – проверка пользователей в фоновом режиме;
• reCaptcha для Android – для приложений на Андроид.

После выбора подходящей рекапчи, появится дополнительное поле, где нужно указать домен и все поддомены, для которых будет работать сервис. Далее ставим галочку в графе «Примите условия использования reCaptcha» после ознакомления, и ниже, возле пункта «Отправлять владельцам оповещения». Последнее обеспечит вас информацией о проблемах и ошибках на сайте, а также о росте подозрительного трафика. Жмем «Регистрация» и переходим к следующей странице.

Для добавления reCaptcha на сайт необходимо пройти три этапа:

1. добавить ключ в html-код сайта;
2. пройти интеграцию на стороне клиента;
3. пройти интеграцию на стороне сервера.

Можно проделать все рекомендации Гугла по установке капчи на сайт вручную, но проще – воспользоваться плагином. Для этих целей подойдет простой плагин No Captcha ReCaptcha. После его установки в админке находим соответствующий пункт и заходим в настройки.

Вводим в верхней строке первый ключ, во второй — секретный ключ, полученный при регистрации сайта в сервисе ранее. Далее выбираем формы, для которых будет действовать рекапча от Google.

Если проставить все галочки, то придется вводить капчу при входе в админку блога (Login Form), в форме регистрации и при добавлении комментариев. Подходящие пункты можно выбрать на свое усмотрение.

Ниже в настройках плагина No Captcha ReCaptcha можно указать тему, цвет, язык виджета. В последней строке прописываем текст, который будет всплывать при неверно введенной капче, или, когда reCaptcha-тест провален.

После каждого внесенного изменения необходимо нажимать «Save All Changes».

Теперь ваш сайт будет надежно защищен от ботов! Отсеянные комментарии, которые не прошли тест будут попадать в корзину, а автоспам по всем отмеченным формам остановлен.

Кроме описанного плагина также можно воспользоваться Google Captcha (reCAPTCHA) by BestWebSoft. Он предлагает добавить reCaptcha в формы регистрации, входа, восстановления пароля, комментариев, пользовательскую форму, а также в Contact Form. При этом можно фильтровать пользователей: все, кто занесен в белый список не будут получать рекапчи.

Также читайте статью «Как избавиться от спама в комментариях?». Данная информация поможет разобраться, как убирать спамные комментарии, в том числе оставленные вручную.

Технологии не стоят на месте, а, значит, необходимо своевременно обновлять средства защиты своего блога. Ведь спам и вирусы подрывают доверие пользователей к вашему ресурсу и его стабильное функционирование.

Возьмите на заметку приведенную в статье информацию и пусть она будет полезна для вас. Не забывайте оставлять комментарии под обзором и делиться своим опытом борьбы со спамом и использования капча-сервисов.

Источник: pro-wordpress.ru