YaSmartCaptcha - защитите ваши формы от спама умной капчей от Яндекс
Привет!
Представляю вам небольшой пакет, который упростит интеграцию Яндекс SmartCaptcha на ваш сайт.
Это дополнение позволит использовать SmartCaptcha от Яндекс на вашем сайте на MODX в формах, созданных с использованием сниппета FormIt (ну а также других компонентах, являющимися надстройкой над FormIt, такими как AjaxForm, SendIt).
Перед началом работы ознакомьтесь с инструкцией и зарегистрируйтесь в сервисе: cloud.yandex.ru/ru/docs/smartcaptcha/quickstart
Для работы с капчей вам будет необходимо создать платежный аккаунт, для чего потребуется ввести данные банковской карты или зарегистрировать его на организацию.
После прохождения регистрации создайте свою первую капчу и вы получите 2 ключа (клиентский и серверный). У Яндекса хорошая и понятная документация, проблем быть не должно.
Это бесплатно?
На момент публикации (январь 2024) Яндекс дает 250000 бесплатных проверок на спам в месяц, больше уже за деньги.
Перейдите в системные настройки, выберите пространство yasmartcaptcha, и пропишите ключи:
Вообще принцип работы такой же, как в Google Recaptcha v2, если вы пользовались им ранее, то трудностей быть не должно.
Шаг 1. В том месте, где вам нужно добавить капчу, добавьте некешированный вызов сниппета:
Данный сниппет подключит на страницу (перед закрывающимся body) скрипт
и добавит html блок с капчей.
У сниппета единственный параметр tpl, имеющий значение по умолчанию tpl.YaSmartCaptcha.
Шаг 2. Добавьте хук YaSmartCaptcha к FormIt, например:
Если проверка не будет пройдена, то хук установит сразу 2 одинаковые ошибки с ключами smart-token и yasmartcaptcha.
Можете использовать любой ключ для показа ошибки, они равнозначны, просто первая соответствует названию hidden поля, создаваемого SmartCaptcha, а вторая названию компонента.
Ссылка на github:
https://github.com/createit-ru/YaSmartCaptcha
Скачать пакет:
https://modstore.pro/packages/utilities/yasmartcaptcha
Также ссылка на транспортный пакет есть на github в разделе Releases (правда не гарантирую, что раздел Releases не забуду обновлять).
Компонент бесплатный, но если вам понравился и пригодился — можно поблагодарить финансово по ссылке:
Ваши благодарности ускорят внедрение новых функций, увеличат мою мотивацию, заставят внимательнее прислушиваться к пожеланиям!
Представляю вам небольшой пакет, который упростит интеграцию Яндекс SmartCaptcha на ваш сайт.
Это дополнение позволит использовать SmartCaptcha от Яндекс на вашем сайте на MODX в формах, созданных с использованием сниппета FormIt (ну а также других компонентах, являющимися надстройкой над FormIt, такими как AjaxForm, SendIt).
Регистрация в Yandex Cloud
Перед началом работы ознакомьтесь с инструкцией и зарегистрируйтесь в сервисе: cloud.yandex.ru/ru/docs/smartcaptcha/quickstart
Для работы с капчей вам будет необходимо создать платежный аккаунт, для чего потребуется ввести данные банковской карты или зарегистрировать его на организацию.
После прохождения регистрации создайте свою первую капчу и вы получите 2 ключа (клиентский и серверный). У Яндекса хорошая и понятная документация, проблем быть не должно.
Это бесплатно?
На момент публикации (январь 2024) Яндекс дает 250000 бесплатных проверок на спам в месяц, больше уже за деньги.
Настройка компонента
Перейдите в системные настройки, выберите пространство yasmartcaptcha, и пропишите ключи:
- yasmartcaptcha_client_key — Клиентский ключ
- yasmartcaptcha_server_key — Серверный ключ
Добавление капчи в форму
Вообще принцип работы такой же, как в Google Recaptcha v2, если вы пользовались им ранее, то трудностей быть не должно.
Шаг 1. В том месте, где вам нужно добавить капчу, добавьте некешированный вызов сниппета:
[[!YaSmartCaptcha]]
Данный сниппет подключит на страницу (перед закрывающимся body) скрипт
https://smartcaptcha.yandexcloud.net/captcha.js
и добавит html блок с капчей.
У сниппета единственный параметр tpl, имеющий значение по умолчанию tpl.YaSmartCaptcha.
Шаг 2. Добавьте хук YaSmartCaptcha к FormIt, например:
[[!FormIt?
&hooks=`YaSmartCaptcha,email`
..
]]
Если проверка не будет пройдена, то хук установит сразу 2 одинаковые ошибки с ключами smart-token и yasmartcaptcha.
Можете использовать любой ключ для показа ошибки, они равнозначны, просто первая соответствует названию hidden поля, создаваемого SmartCaptcha, а вторая названию компонента.
Ссылки
Ссылка на github:
https://github.com/createit-ru/YaSmartCaptcha
Скачать пакет:
https://modstore.pro/packages/utilities/yasmartcaptcha
Также ссылка на транспортный пакет есть на github в разделе Releases (правда не гарантирую, что раздел Releases не забуду обновлять).
В заключение
Компонент бесплатный, но если вам понравился и пригодился — можно поблагодарить финансово по ссылке:
Ваши благодарности ускорят внедрение новых функций, увеличат мою мотивацию, заставят внимательнее прислушиваться к пожеланиям!
Комментарии: 4
Подскажите пожалуйста, я правильно понял что YaSmartCaptcha работает только с компонентом FormIt? Пытался ее включить для компонента Login, но даже с незаполненным secret_key проходило валидацию. Удалось решить доработав сниппет YaSmartCaptcha:
if ((isset($formit) || isset($login)) && isset($hook)) {
Ага, верное замечание.
Я только для formit писал. И исправили верно сниппет.
Если я доберусь до github и будет свободное время — нужно сделать обновление)
Может PR сделаете, чтобы не забыл? Или issue)
Я только для formit писал. И исправили верно сниппет.
Если я доберусь до github и будет свободное время — нужно сделать обновление)
Может PR сделаете, чтобы не забыл? Или issue)
Готово. Добавил. Спасибо Вам.
Я выпустил обновление с этим исправлением. Теперь компонент работает с FormIt и Login
Авторизуйтесь или зарегистрируйтесь, чтобы оставлять комментарии.