От автора: в очередном уроке нашего цикла по созданию привлекательной формы на сайт мы добавим к форме капчу. Это будет математическая капча, которую мы возьмем из урока 2 варианта капчи для сайта.
Поскольку алгоритм работы капчи детально описан в указанном выше уроке, я не буду объснять его повторно. Итак, приступим.
Детали учебника
Тема: PHP
Сложность: Средняя
Урок: Видео версия (.mp4)
Время: 00:18:46
Размер архива: 53 Mb
Реализацию задачи начнем, конечно же, с создания поля для капчи. Добавим это поле, к примеру, после поля для отзыва:
1 2 3 4 |
<p> <label for="captcha"><span class="formTextRed">*</span> 2 + 5 = ?:</label> <input type="text" name="captcha" id="captcha" /> </p> |
Пока что числа мы прописали статически, далее они будут генерироваться рандомно, т.е. случайным образом.
Теперь давайте проверим в клиентском скрипте, чтобы поле капчи было заполнено перед отправкой на сервер. Для этого всего-навсего достаточно добавить имя данного поля в массив fields скрипта form.js:
1 |
var fields = ["lastname", "firstname", "email", "comment", "captcha"]; |
Следующим шагом давайте реализуем динамическую генерацию чисел. Для этого воспользуемся функцией mt_rand() и сохраним в 2 переменные 2 сгенерированных числа. Также в сессионную переменную сохраним результат математического действия. Все это уместится в 3 строки кода, которые мы напишем после тела условия if($_POST):
1 2 3 |
$a = mt_rand(1, 10); $b = mt_rand(1, 10); $_SESSION['res_captcha'] = $a + $b; |
Теперь выведем в форме значения переменных $a и $b:
1 2 3 4 |
<p> <label for="captcha"><span class="formTextRed">*</span> <?php echo "$a + $b" ?> = ?:</label> <input type="text" name="captcha" id="captcha" /> </p> |
Теперь с каждым обновлением страницы мы будем видеть разные цифры в математическом выражении. Ну а в сессионной переменной у нас хранится результат вычисления математического выражения. Осталось в теле условия if($_POST) сравнить то, что ввел пользователь в поле капчи, с тем, что сохранено в сессионной переменной. Если значения совпадут, значит пользователь прошел проверку.
До проверки значения переменной $error проверим сформированное условие:
1 2 3 4 |
if($_POST['captcha'] != $_SESSION['res_captcha']){ $_SESSION['res']['error'] .= "Дан неверный ответ на вопрос <br />"; $error = true; } |
Вот, собственно, и все. Как видите, все довольно просто и уместилось буквально в несколько строк кода 🙂
На этом наш урок завершен. Если у Вас возникли какие-либо вопросы по уроку, то задавайте их, пожалуйста, на нашем форуме.
Удачи и до новых встреч!
Комментарии (26)