Как сохранить капчу в файл

Обновлено: 07.07.2024

Чтобы обойти капчу, нужно понимать, как она устроена изнутри.

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

Откуда берется эта капча? Она генерируется скриптом PHP при обращению на заданный URL, пусть для примера этот URL такой - capcha.php. Тогда в HTML коде формы для картинки капчи будет такой код: <img src="http://old.code.mu/books/advanced/php/parsing/capcha.php">.

Если мы зайдем на страницу с формой, то картинка капчи автоматически подтянется со страницы capcha.php.

При этом страница capcha.php - это скрипт, который генерирует случайную строку, делает из нее картинку капчи и отдает ее в браузер.

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

Если обратиться на страницу capcha.php - она каждый раз будет отдавать новую капчу и, соответственно, эта новая капча будет затирать старую в сессии.

Как обойти капчу

Итак, теперь вы знаете как устроена капча. Давайте теперь о том, как ее обойти. Для этого нужно сделать несколько запросов с помощью CURL.

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

Результатом данной операции будет картинка, ее можно сохранить в файл с помощью file_put_contents. Зачем сохранять - чтобы можно было прочитать капчу и разобрать ее каким-либо образом (для начала вручную).

Запрос на капчу обязательно следует слать через curl, а не file_get_contents, так как нам обязательно следует принимать и оправлять куки - ведь капча работает на сессиях PHP.

Итак, получаем капчу, сохраняем его в файл, разбираем эту капчу вручную и шлем второй запрос уже на страницу с формой вместе с POST данными для формы (и с разобранной капчей).

Не ошибитесь и не сделайте лишнего запроса к капче!

Использование сервисов распознавания

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

Лучше подключить специальный сервис, на котором специально обученные китайцы за копейки разбирают капчи.

Как это работает: вы считываете капчу в файл, а затем используя API сервиса отправляете эту капчу на сервис. Через 3-5 секунд получаете эту капчу обратно в разобранном виде.

Стоит это удовольствие не дорого - менее одного доллара за 1000 разобранных капч.

Captcha (капча) – это некий тест, который человек решает очень легко, а робот – нет (научить компьютер решать его крайне сложно и затруднительно).

Другими словами, основная цель капчи – это определить кем является пользователь: человеком или роботом .

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

Исходные коды капчи

Исходные коды капчи расположены на GitHub: itchief/captcha.

Скриншот формы с капчей:

Процесс разработки капчи представлен в виде следующих этапов:

верстка формы;
создания файла «captcha.php» для генерация кода капчи и изображения;
написание обработчика для формы (файл «process-form.php»);
написание JavaScript для отправки формы на сервер через AJAX и обработки ответа.

Верстка формы

Генерация кода капчи и изображения

Формирование кода капчи и изображения выполним в файле «captcha.php», который поместим в папку «/assets/php»:

Генерирование текста капчи выполняется очень просто. Для этого в переменную $chars помещаются символы, из которых она может состоять. Далее с помощью функции str_shuffle() эти символы случайным образом перемешиваются и посредством substr выбирается первые шесть из них.

Сохранении полученной капчи по умолчанию осуществляется в сессионную переменную. Но если хотите в куки, то установите переменной $use_session значение false :

Для отправки капчи клиенту создается изображение, имеющее фон «bg.jpg», на котором с помощью функции imagefttext() пишется текст капчи.

Скрипт для обновления капчи на форме

Код для обновления капчи при нажатию на кнопку .captcha__refresh :

Добавление обработчика к кнопке выполняется через addEventListener .

Написание обработчика формы

Для обработки формы создадим файл «process-form.php» в папке «/assets/php/»

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

В качестве результата будем возвращать JSON. В случае успеха:

В противном случае, success присвоим значение false , а в errors поместим ошибки:

По умолчанию этот файл сравнивает капчу со значением, находящимся в сессии. Если в «captcha.php» сохраняете капчу в куки, то здесь необходимо закомментировать секцию 1a и раскомментировать 1b:

JavaScript для отправки формы на сервер через AJAX

Код для отправки формы на сервер через AJAX и обработки полученного результата:

В этом коде отправка данных через AJAX выполняется посредством fetch() . Получение данных формы с использованием FormData .

Для отправки и получения cookie посредством fetch() установим:

Если в success находится значение false , то будем помечать поля, которые не прошли валидацию и выводить подсказки:

Именно поэтому многие используют капчу, и сегодня я вам покажу, как установить ее на сайт с WordPress.

Что такое капча и как она работает

CAPTCHA – это компьютерный тест, используемый для определения того, кем является пользователь системы: человеком или компьютером. Данный механизм используется в целях устранения спама и автоматизированного извлечения данных из веб-сайтов.

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

В разное время такую проверку проходили различными способами. Например, когда-то нужно было прослушивать текст, а потом его вводить либо печатать увиденные символы в отведенной для этого строке. С 2015 года для подтверждения личности достаточно поставить кнопку напротив графы «Я не робот», как это проиллюстрировано выше.

Не так давно вышло еще одно обновление – теперь доступна invisible reCAPTCHA, которая позволяет осуществлять фоновую валидацию действий пользователей на сайте. В отличие от предыдущей версии, она не требует от пользователей того, чтобы они нажимали на кнопку «Я не робот».

Invisible reCAPTCHA позволяет совершать на сайте какие-либо действия без ввода капчи. По умолчанию только самые подозрительные действия пользователей не позволят им пройти дальше. В этом случае капча предложит им решить задачу.

Стоит также понимать, что капча – это не только инструмент от Google, существует множество инструментов от других разработчиков.

Установка капчи на WordPress

Для установки капчи от нас потребуется всего две вещи – это регистрация сайта на специальном сервисе от Google и установка плагина, в котором будут прописаны все полученные данные из сервиса.

Готово! Теперь ваш сайт защищен от надоедливых ботов. Это был лишь один из способов установки капчи на WordPress. Мы также можем установить ее через HTML-код либо с помощью других плагинов, о которых речь пойдет ниже.

Топ-5 плагинов для установки капчи на WordPress

Выше мы установили капчу от Google, но это не единственная возможная капча, о чем я уже говорил. Есть множество других, о которых я расскажу в этом разделе. Здесь не будет уже рассмотренного плагина, но будут другие, также отлично справляющиеся со спамом и ботами.

Really Simple CAPTCHA

Первый в нашем списке плагин – это Really Simple CAPTCHA, используемый как дополнительный модуль для плагина Contact Form 7. Это очень простая и понятная Captcha для пользователей, с помощью которой можно легко защититься от спама. Достаточно ввести код с картинки, и капча будет пройдена.

Плюсы:

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

Минусы:

отсутствует перевод на многие языки;

может использоваться только как дополнение к Contact Form 7: не предназначен для работы с другими плагинами.

Ссылка на скачивание: Really Simple CAPTCHA

SI CAPTCHA Anti-Spam

SI CAPTCHA Anti-Spam добавляет различные методы анти-спама для форм в WordPress: комментариев, регистрации, утерянного пароля, логина или сразу всех. Он отлично совместим с WP, WPMU и BuddyPress.

Плюсы:

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

Минусы:

не всегда защищает сайт от спама;
иногда сложно определить, какие символы нужно ввести.

Ссылка на скачивание: SI CAPTCHA Anti-Spam

Captcha

Captcha – еще один плагин, позволяющий добавить капчу. Он устанавливает защиту к стандартным формам на WordPress с помощью математической логики. Расширение также совместимо с Contact Form, что позволяет создать отлично защищенную форму обратной связи.

Плюсы:

простота установки и использования;
отличная читабельность капчи;
механизм проверки использует математику: сложение, вычитание и умножение;
можно использовать словесное, цифровое или смешанное отображение элементов капчи;
доступен на 36 языках;
совместимость с Contact Form;
есть PRO-версия с поддержкой Contact Form 7 и BuddyPress;
подробная документация с пошаговой видеоинструкцией по настройке и установке;
в платной версии доступна возможность кастомизации.

Минусы:

в бесплатной версии нет совместимости с BuddyPress;
долгий ответ технической поддержки в обычной версии.

Ссылка на скачивание: Captcha

Google Captcha (reCAPTCHA) by BestWebSoft

Это один из самых популярных плагинов на WordPress, позволяющий установить Google-капчу в два клика. Google Captcha (reCAPTCHA) by BestWebSoft является универсальным инструментом, так как позволяет установить проверку на большинство разделов сайта. Среди них формы регистрации, входа, напоминания пароля, добавления комментариев, контактов и т.д.

Плюсы:

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

Минусы:

Ссылка на скачивание: Google Captcha (reCAPTCHA) by BestWebSoft

Confident CAPTCHA

Confident CAPTCHA – это не простой ввод символов, как было в предыдущих случаях, а капча с простым выбором картинки. Для прохождения проверки достаточно выбрать картинку, на которой изображен предложенный объект, например цветок.

Плюсы:

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

Минусы:

не работает с WP Multisite;
может показаться, что это реклама.

Ссылка на скачивание: Confident CAPTCHA

Заключение

Установка капчи на WordPress – это простой способ защитить свой сайт от нежелательных ботов и спама. Сегодня мы убедились, что в ее настройке и установке нет ничего сложного – достаточно лишь установить нужный плагин.

В этом руководстве мы добавим в PHP-форму Google reCAPTCHA v3 и отправим ее данные без перезагрузки веб-страницы, используя Ajax.

Почему Google reCAPTCHA v3?

У многих пользователей раньше возникали проблемы при прохождении капчи.

К счастью, сейчас многие сайты используют Google reCAPTCHA v2, которая просто отображает флажок «Я не робот».

В 2018 году Google выпустила reCAPTCHA v3, которая вообще не требует взаимодействия с пользователем. Ее можно использовать в формах, чтобы предотвратить отправку спама.

Теперь узнаем, как добавить Google reCAPTCHA v3 в простую форму.

Сначала необходимо зарегистрировать свой сайт и получить ключи здесь . Затем добавьте метку, выберите reCAPTCHA v3, введите доменное имя сайта и отправьте данные.

После этого будет сгенерирован site key и secret key. Скопируйте и сохраните их.

HTML-форма

Ниже представлен HTML-код формы. Ее CSS-код доступен в архиве с исходниками .

Отправка данных формы с помощью Ajax

Доработаем процесс отправки формы с помощью Ajax, Для этого потребуется библиотека jQuery. Загрузите ее, используя CDN. Вставьте приведенную ниже строку кода перед закрывающимся тегом body.

Теперь выполнить Ajax-запрос на отправку данных формы.

Теперь пришло время интегрировать reCAPTCHA v3.

Интеграция на стороне клиента

Загрузите API JavaScript с site key. Вставьте приведенный ниже код под ссылкой на CDN JQuery.

Важно : замените YOUR_SITE_KEY_HERE значением, которое вы сохранили ранее.

Вызовите эту функцию ниже Ajax-запроса и присвойте скрытому полю ввода значение токена.

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

Интеграция на стороне сервера

После проверки введенных пользователем данных на стороне сервера, нужно получить оценку от Google, чтобы убедиться в том, что имеем дело с реальным человеком. Внутри блока if(isvalid()) < >добавьте приведенный ниже код, чтобы выполнить API-запрос для получения оценки.

Важно : замените YOUR_SECRET_KEY_HERE значением, которое вы скопировали ранее. Secret key предназначен только для серверной части.

Полученный ответ является объектом JSON.

Расшифруем объект JSON $recaptcha и проверим success, score и action. Оценка имеет значение от 0,0 до 1,0. По умолчанию можно использовать порог 0,5.

Бонусный совет:

Добавив JavaScript API, мы получили раздражающий значок reCAPTCHA в правом нижнем углу веб-страницы.

Но этот значок можно скрыть, если добавить следующий текст в поток пользователя:

Поэтому добавьте это в элемент < p > под кнопкой отправки.

Теперь, чтобы скрыть значок, просто добавьте приведенный ниже код в CSS.

СКАЧАТЬ ИСХОДНЫЙ КОД

Дайте знать, что вы думаете по данной теме статьи в комментариях. За комментарии, отклики, лайки, подписки, дизлайки огромное вам спасибо!

Читайте также: