Hôm nay mình xin hướng dẫn các bạn tạo mã captcha, các bạn cũng thường thấy mã Captcha ở những trang web trên mạng. Khi bạn đăng ký một tài khoản thường có những mã Captcha yêu cầu bạn xác nhận để xác nhận một vấn đề nào đó mà trang web yêu cầu,...Vậy hôm nay mình xin hướng dẫn các bạn làm một ví dụ nhỏ về phần Captcha này. Yêu cầu của mình là xác nhận tài khoản đăng nhập. Bạn nhập tên tài khoản và password, sau đó yêu cầu bạn nhập đúng mã Captcha, thì mới cho phép bạn làm một công việc nào đó, công việc gì thì tùy bạn cho phép người dùng sử dụng.
phần CSS dùng để chỉnh Form
/*
Author:Nguyễn Thanh Hòa;
Contact:nguyenthanhhoa.com@gmail.com;
Date: 26-9-2014;
Version: 2;
*/
*{margin:0px;padding:0px;}
#background{width:900px;margin: 0px auto;}
#create-form{width: 900px;margin: 50px auto;}
#form{width: 900px;margin: 0px auto;}
#noidung div{padding:5px 0px;margin-left: 280px;width: 400px;width: 400px;border:1px solid #ccc;border-top-style: none;}
div.label-tua{background: #000000;}
div.label-tua h2{width: 400px;text-align: center;color:blue;color:white;padding:10px 0px;}
div.label label{width:400px;padding:2px;display: inline-block;font-style: italic;font-size: 18px;font-weight: bold;margin-left: 100px;border-bottom-style: none;}
div.label label input{width: 200px;padding:5px 5px;font-style: italic;text-align: center;font-size: 16px;}
Nội dung trang Index.php đây là trang sẽ hiện thị đầu tiên. Trong trang này sẽ đưa ra một giao diện Form Xác nhận tài khoản yêu cầu nhập thông tin.
code html
<html>
<head>
<title>Create Captcha</title>
<meta charset='UTF-8'>
<link rel="stylesheet" type="text/css" href="css/style.css">
</head>
<body>
<div id="background">
<!--create form-->
<div id="create-form">
<div id="form">
<form action ="index.php" method="post">
<div id="noidung">
<div class="label-tua">
<h2> XÁC NHẬN TÀI KHOẢN</h2>
</div>
<div class="label">
<label class="name-tua">Username</label>
<label class="past-tua">
<input type="text" name="user" placeholder="Username" />
</label>
</div>
<div class="label">
<label class="name-tua">Password</label>
<label class="past-tua">
<input type="password" name="pass" placeholder="Password"/>
</label>
</div>
<div class="label">
<label class="name-tua">Xác nhận mã</label>
<label class="past-tua">
<img src="include/img_captcha.php" />
</br>
<input text="text" name='ma_captcha' placeholder="Xác nhận mã" />
</label>
</div>
<div class="label">
<label>
<input type="submit" name="xacnhan" value="Xác nhận" />
</label>
</div>
</div><!--end noidung-->
</form><!--ket thuc form-->
<div class="label">
<label>
<?php
$kq=new Captcha();
echo $kq->xacnhan();
//echo '<script>alert('.$kq->xacnhan().');</script>';
?>
</label>
</div>
</div><!--End form-->
</div>
</div><!--End Background-->
</body>
</html>
Tiếp theo các bạn tạo file captcha.class.php các bạn copy source bên dưới bỏ vào file captcha.class.php, file này có nhiệm vụ tạo ra mã captcha và thực hiện nhiệm vụ khi ta xác nhận, xem coi thông tin yêu cầu chính xác chứa. ếp theo các bạn tạo file captcha.class.php các bạn copy source bên dưới bỏ vào file captcha.class.php, file này có nhiệm vụ tạo ra mã captcha và thực hiện nhiệm vụ khi ta xác nhận, xem coi thông tin yêu cầu chính xác chứa.
code php
<?php
/*
Author:Nguyễn Thanh Hòa
Contact:nguyenthanhhoa.com@gmail.com
Date:26-09-2014
*/
Class Captcha{
private $string;
private $img;
private $background;
private $text_color;
private $user;
private $pass;
private $chuoi_capcha;
private $message=NULL;
public function imgageCaptcha(){
$captcha_arr = array("0","1","2","3","4","5","6","7","8","9",
"A","B","C","D","E","F","G","H","I","J","K","L","M","N","O","P","Q","R","S","T","U","V","W","X","Y","Z",
"a","b","c","d","e","f","g","h","i","j","k","l","m","n","o","p","q","r","s","t","u","v","w","x","y","z");
$captcha_index = array_rand($captcha_arr,6);
$captcha = $captcha_arr[$captcha_index[0]].$captcha_arr[$captcha_index[1]].$captcha_arr[$captcha_index[2]].
$captcha_arr[$captcha_index[3]].$captcha_arr[$captcha_index[4]].$captcha_arr[$captcha_index[5]];
/*
$this->string=md5(time());
$this->string=substr($this->string, 0,6);
*/
$_SESSION['captcha']=$captcha;
//tao image
$this->img=imagecreate(200,50);
$this->background=imagecolorallocate($this->img, 0, 0, 0);
$this->text_color=imagecolorallocate($this->img,255,255,255);
imagestring($this->img, 20, 40, 15, $captcha, $this->text_color);
header("Content-type:image/png");
imagepng($this->img);
imagedestroy($this->img);
}
public function xacnhan(){
if(isset($_POST['xacnhan'])){
$this->user=$_POST['user'];
$this->pass=$_POST['pass'];
$this->chuoi_captcha=$_POST['ma_captcha'];
if($this->user=='thanhhoa' && $this->pass=='123' && $this->chuoi_captcha==$_SESSION['captcha']){
$this->message='<script>alert("Bạn xác nhận thành công!");</script>';
}
else{
$this->message='<script>alert("Vui lòng kiểm tra lại!");</script>';
}
}
return $this->message;
}
}
?>
code view
<?php
session_start();
//su dung autoload class
function __autoload($url){
$url=str_replace("_","/",$url);
require("".$url.".class.php");
}
$chuoi=new Captcha();
$hinh="";
$hinh .=$chuoi->imgageCaptcha();
//echo $hinh;
?>
Chúc các bạn làm thành công!
