Капча с обновлением
Капча служит для защиты от роботов, которые в автоматическом режиме спамят сайты. В первую очередь, это относится к сайтам на готовых движках. К сожалению, их даже капчи не спасают (если в сети оказалось описание "дыры" в движке). Но если Ваш сайт уже достаточно популярен, то обязательно найдутся люди, желающие пропиариться за Ваш счёт. Они напишут скрипт специально под Ваш движок и заспамят Ваш сайт всё равно. Для защиты от этого необходимо ставить капчи. Однако, не всегда капчи генерируются хорошо, ввиду чего даже человек не может её расшифровать. В связи с этим, я рекомендую делать капчу с обновлением. То есть если человек не может её расшифровать, то он жмёт кнопку "Обновить", и проверочный код становится другим. Вот именно реализацию этого мы и разберём в данной статье.
Для начала разберём код генерации капчи. У нас есть шрифт по такому пути: "fonts/verdana.ttf". Теперь создадим файл captcha.php со следующим кодом:
<?php
session_start(); // Начинаем сессию
$string = "";
for ($i = 0; $i < 5; $i++)
$string .= chr(rand(97, 122)); // Генерация случайной строки
$_SESSION['rand_code'] = $string; // Записываем код в сессию
$dir = "fonts/"; // Путь к папке со шрифтом
$image = imagecreatetruecolor(170, 60); // Создаём изображение
$color = imagecolorallocate($image, 200, 100, 90); // Создаём цвет текста
$white = imagecolorallocate($image, 255, 255, 255); // Создаём цвет фона
imagefilledrectangle($image, 0, 0, 170, 60, $white); // Закрашиваем изображение
imagettftext ($image, 30, 0, 10, 40, $color, $dir."verdana.ttf", $_SESSION['rand_code']); // Рисуем текст на капче
header("Content-type: image/png"); // Отправляем заголовок с типом содержимого
imagepng($image); // Выводим картинку
?>
По сути, данный скрипт включается в себя 3 стадии:
- Генерацию случайной строки и запись её в сессию.
- Рисование картинки.
- Отправка заголовка и вывод картинки.
Все эти 3 пункта могут быть по-разному реализованы в разных капчах, однако, все 3 стадии всегда присутствуют. Можете взять какой-нибудь готовый код с генерацией сложной, но в то же время читабельной капчи. В данном примере, рассмотрен лишь простейший вариант.
Теперь займёмся выводом капчи. Делается это очень просто:
<img src="captcha.php" alt="" />
И теперь займёмся кнопкой "Обновить". Фактически, всё, что нам нужно - это обновлять src у тега img с капчей. Но постоянно обновлять src на "captcha.php" результата не получится, поскольку браузер не будет обновлять ничего (он же не знает, что картинка по тому же адресу уже будет другой). Поэтому нужно обновлять с каким-нибудь случайным GET-параметром.
Вот как это делается:
<img src="captcha.php" alt="" id="captcha" />
<span style="border-bottom: 1px dashed #f00; color: #f00; cursor: pointer;" onclick="document.getElementById('captcha').src = 'captcha.php?' + Math.random()">Обновить</span>
Как видите, при клике по ссылке "Обновить" у нас изменяется атрибут src у тега img с капчей. Плюс src каждый раз разный. Это никакого влияния на саму капчу не оказывает (если мы того не захотим, конечно, обработав GET-параметры в captcha.php), однако, для браузера это новая картинка, поэтому он её заново подгружает. В captcha.php создаётся новый код, он заново записывается в сессию, рисуется заново картинка и после возвращается в тег img.
Вот таким образом делается капча с обновлением без перезагрузки самой страницы.
-
Создано 28.09.2013 00:17:28
-
Михаил Русаков
Комментарии (4):
Исправляйте "// Записаем код в сессию "
Ответить
Спасибо, исправил!
Ответить
Спасибо Вам за статью! Очень пригодилась.
Ответить
Дайте скрипт каптчи, которая у Вас на странице: https://myrusakov.ru/register.html
Ответить
Для добавления комментариев надо войти в систему.
Если Вы ещё не зарегистрированы на сайте, то сначала зарегистрируйтесь.