Мы все с вами привыкли видеть на сайтах при заполнении любой формы трудночитаемую картинку с рандомными символами и цифрами. Данная картинка называется КАПТЧА (от CAPTCHA— англ. Completely Automated Public Turing test to tell Computers and Humans Apart — полностью автоматизированный публичный тест Тьюринга для различения компьютеров и людей). Как описано в расшифровке аббревиатуры данная картинка позволяет определить робот или человек заполняет форму.
В настоящее время существует множество разновидностей КАПТЧ, это может быть картинка с рандомным текстом, или картинка с математическими действиями, блок картинок в которых нужно выбрать определенные предметы и т.д. Все эти картинки направлены на борьбу с роботами спамерами, которые заполняют формы автоматически.
Стоит понимать что КАПЧА это не панацея, и при желании ее всегда можно распознать автоматически использую соответствующие сервисы. Данная проблема актуальна для высоконагруженных веб сайтов с большой аудиторией, например социальные сети или популярные доски объявлений такие как Авито и т.д.
Переходя от вступления к практики, для написания КАПТЧИ нам понадобится библиотека GD. GD Graphics Library (GD) — программная библиотека, написанная Томасом Баутелом (Thomas Boutell) и другими разработчиками для динамической работы с изображениями. Данная библиотека работает с множеством других языков программирования и служит для работы с графикой. Как вы уже догадались, мы будем с помощью библиотеки GD и PHP создавать свою картинку с рандомным текстом. Graphics Library позволяет также редактировать существующие изображения, а именно наложение логотипа на картинку, изменения размеров загружаемого изображения и многое другое.
Приступаем к написанию КАПТЧИ. Первое что нам нужно – это генератор случайных чисел. Такой генератор я писал в одной из статей Генератор пароля + соль в пароле для хранения в MySQL. Так же необходимо загрузить файл шрифта на сервер для использования его в КАПТЧе.
<?php /** * КАПТЧА 1.0 * Site: http://bezramok-tlt.ru * Создание КАПТЧИ своими руками * Autor: Админ */ //Запускаем сессию session_start(); //Устанавливаем кодировку и вывод всех ошибок header('Content-Type: text/html; charset=UTF-8'); error_reporting(E_ALL); function getRandString($num) { //Генерим массив из букв $letter = range('a', 'z'); //Генерим массив из цифр $number = range(0, 9); //Создаем строку с маленькими и большими буквами и цифрами $letter = implode('',$letter); $letter = $letter.strtoupper($letter).implode('',$number); //Строка с генерированым кодом $randStr = ''; for ($i = 0; $i < $num; $i++){ //Прогоняем циклом столько, сколько нужно символов в строке $randStr .= $letter[rand(0, strlen($letter) - 1)]; } return $randStr; } //Функция генерации цвета function randColor($imgPng, $red = null, $green = null, $blue = null) { if(is_numeric($red) and is_numeric($green) and is_numeric($blue)) return imagecolorallocate($imgPng, $red, $green, $blue); else return imagecolorallocate($imgPng, rand(0, 255), rand(0, 255),rand(0, 255)); } //Путь до нужного шрифта $fonts = "./font/verdana.ttf"; //Нижняя плашка каптчи $url = "http://bezramok-tlt.ru"; //Размер шрифта каптчи $fontSize = 24; $fontSizeUrl = 12; //Размеры холста холста $width = 200; $height = 80; //Количество линий и пикселей на холсте $countLine = rand(0, 10); $countPixel = rand(200, 1000); // Сколько символов будем выводить на картинке $numbers = 5; //Получаем сгенерированую строку $randStr = getRandString($numbers); // Записываем каптчу в сессию $_SESSION['captcha'] = $randStr; // Создаем картинку (холст) размером 200 X 60 $imgPng = imagecreatetruecolor($width, $height); // Создаем фон холста, RGB(255, 181, 181) $imgColor = randColor($imgPng, 255, 181, 181); //Зададим цвет линиям, у меня он динамический $lineСolor = randColor($imgPng); //Зададим цвет для точек, у меня он динамический $pixelСolor = randColor($imgPng); //Цвет текста, у меня он динамический $textColor = randColor($imgPng); //Цвет полоски с текстом в низу картинки $bgColor = randColor($imgPng, 0, 0, 0); //Цвет текста URL красный $redColor = randColor($imgPng, 255, 0, 0); //Определяем фон картинки imagefilledrectangle($imgPng, 0, 0, $width, $height, $imgColor); //Создаем линии на холсте for ($i = 0; $i < $countLine; $i++) { imageline($imgPng, 0, rand(0, $height), $width, rand(0, $height), $lineСolor); } //Создаем точки на холсте for ($i = 0; $i < $countPixel; $i++) { imagesetpixel($imgPng, rand(0, $width) , rand(0, $height), $pixelСolor); } //Пишем по букве не холсте for ($i = 0; $i < strlen($randStr); $i++) { //Растояние между символами $x = ($width - 20) / strlen($randStr) * $i + 10; //Случайное смещение $x = rand($x, $x + 4); //Координата Y $y = $height - (($height - $fontSize) / 2 ); //Случайны цвет отдельного символа $letterColor = randColor($imgPng); //Случайный угол наклона символов $angle = rand(-25, 50); //Пишем текст на холсте (наш код каптчи) imagettftext($imgPng, $fontSize, $angle, $x, $y, $letterColor, $fonts, $randStr[$i]); } // создаем рамку для текста $bbox = imagettfbbox($fontSizeUrl, 0, $fonts, $url); //Высчитываем координаты для выравнивания по центру $textX = $bbox[0] + (imagesx($imgPng) / 2) - ($bbox[4] / 2); //Определяем фон картинки imagefilledrectangle($imgPng, 0, 60, $width, $height, $bgColor); //Надпись с URL imagettftext($imgPng, $fontSizeUrl, 0, $textX, 75, $redColor, $fonts, $url); // Посылаем заголовок серверу о том что у нас картинка в формате png header("Content-type: image/png"); imagepng($imgPng); //Освобождаем imagedestroy($imgPng); ?>
Если обратиться к этому файлу через браузер, то мы получим вот такую картинку.
<!DOCTYPE html> <html lang="en"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <meta charset="UTF-8"> <!-- Latest compiled and minified CSS --> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous"> <title>Document</title> </head> <body> <div class="container"> <div class="row"> <div class="col-md-6 col-md-offset-3"> <h1 class="text-center">Форма работы каптчи:</h1> <!-- Выводим ошибки --> <?php if(count($err) > 0) echo '<div class="alert alert-danger">'. implode('<br>', $err).'</div>'; if(!empty($ok)) echo '<div class="alert alert-success">'. $ok .'</div>'; ?> <form method="POST" action=""> <div class="form-group"> <label for="exampleInputEmail1">Email</label> <input type="email" class="form-control" id="exampleInputEmail1" name="email" placeholder="Email"> </div> <div class="form-group"> <label for="code">Код с картинки</label> <input type="text" class="form-control" id="code" name="captcha" placeholder="Код с картинки"> </div> <div class="form-group"> <p class="help-block"><img id="captcha" src="captcha.php" alt=""> <button class="btn btn-default" id="refreshImg"><span class="glyphicon glyphicon-refresh" aria-hidden="true"></span></button></p> </div> <button type="submit" class="btn btn-primary" name="send">Отправить</button> </form> </div> </div> </div> <script src="http://code.jquery.com/jquery-2.2.4.min.js" integrity="sha256-BbhdlvQf/xTY9gja0Dq3HiwQF8LaCRTXxZKRutelT44=" crossorigin="anonymous"></script> <script> $(document).ready(function(){ $('#refreshImg').click(function(e){ e.preventDefault(); $('#captcha').attr('src', 'captcha.php?r=' + Math.random()); }) }); </script> </body> </html>
<?php /** * Главный файл * Site: http://bezramok-tlt.ru * Создание КАПТЧИ своими руками */ //Запускаем сессию session_start(); //Устанавливаем кодировку и вывод всех ошибок header('Content-Type: text/html; charset=UTF8'); error_reporting(E_ALL); //Инициализируем переменные для работы $err = array(); //Если нажата кнопка отправки формы if(isset($_POST['send'])) { //Утюжим пересенные if(!filter_var($_POST['email'], FILTER_VALIDATE_EMAIL)) $err[] = 'Не верный email!'; if($_SESSION['captcha'] != $_POST['captcha']) $err[] = 'Код с картинки не совпадает!'; if(empty($err)) $ok = 'Вы прошли проверку!'; } //Подключаем наш шаблон include './form.html'; ?>
Скачать: Создание каптчи своими руками на PHP
Теги:
Поддержи проект:
Мне кажется, что данная тема очень узко направленная и не всем интересна. Так что не стоит ждать в ближайшее время.
Посмотри что ты отправляешь на сервер в POST
echo '<pre>';
print_r($_POST);
echo '</pre>';
Вечером поймай меня. Пока на работе.
Привет, перезолил.
В шаблон в ставь где каптчу нужно вывести:
<img src="captcha.php" alt="capthca">