
เรามักจะเห็นตัวหนังสือภาพที่เขียนด้วยภาษา PHP มาคอย Random เวลาที่เราล็อคอิน หรือโพสตาม เว็บบอร์ด เพื่อป้องกันการสแปมเว็บ หรือ การถูกก่อกวนจากผู้ไม่ประสงค์ดี อันนี้ว่ากันตามที่เขาพูดต่อๆกันมานะครับ หรือ ทำให้ผู้ไม่ประสงค์ดี เหนื่อยอ่อนใจกับการที่ต้องมาคอย กรอกโค้ด chaptcha ความจริงมันก็เหนื่อยทั้งผู้ประสงค์ดี และผู้ไม่ประสงค์ดี นั้นแหละ..555+... เอากันจริงๆก็คือ การป้องกันการ spam เว็บจาก bot ของผู้ไม่ประสงค์ดีนั่นเอง....
สิ่งที่ต้องมี
1. captcha.php
2. text_captcha.php
3. captcha_result.php
4. jquery.js
5. 40240.TTF (font ตัวหนังสือที่ต้องการ)
6. bg.png (ภาพ background)
7. refresh.jpg (ภาพ)
เริ่ม.. สร้าง form กันก่อน
ไฟล์ captcha.php
<div id="container"> <form name="form1" method="post" action="captcha_result.php"> <table> <tr valign="top"> <td>Emailaddress ::</td> <td> <div><input type="text" name="email" id="email"></div> </td> </tr> <tr> <td></td> <td> <div><img src="text_captcha.php?str=<?=$ran_str?>" id="captcha"/></div> </td> <td><div id="refresh"><img height="30" src="refresh.jpg"/></div></td> </tr> <tr> <td>Code ::</td> <td><input name="code_input" type="text"></td> </tr> <tr> <td></td> <td><input type="submit" name="Submit" value="Submit"></td> </tr> </table> </form> </div>
จบแล้วในส่วนของ form ตามมาด้วยการสร้างข้อความรูปภาพ เริ่มที่การ สร้าง function random text ออกมา 6ตัว หรือตามที่ต้องการ ดังนี้
ไฟล์ text_captcha.php
<? function ranDomStr($length){ $str2ran = 'abcdefghijklmnopqrstuvwxyz123456789'; $str_result = ""; while(strlen($str_result)<$length){ $str_result .= substr($str2ran,(rand()%strlen($str2ran)),1); } return($str_result); } $ran_str = randomstr(6); ?>
จากนั้นก็มาสร้าง text ให้เป็นรูปภาพ ดังนี้
ไฟล์ text_captcha.php
<?php $font = "40240.TTF";//กำหนด font ตัวหนังสือ $image = imagecreatefrompng('bg.png'); //สร้าง background จาก .png $bg = imagecolorallocate($image,200,220,220); //พื้นหลังสีขาว $color = imagecolorallocate($image, rand(200, 300),rand(1, 200), rand(100, 300)); //ตรงนี้ ผมใส่ rand เพื่อให้ตัวหนังสือเปลี่ยนสี imagettftext($image,25,0,12,30,$color,$font,$ran_str); header("Content-type:image/png");//ส่งออกรูปภาพ imagepng($image); imagedestroy($image); $_SESSION['security_code'] = $ran_str; //เอาค่าที่ random ได้มาฝากไว้กับตัวแปร session เพราะฉนั้นท่านก็ต้อง state session ก่อน ?>
กำหนดการเปิดใช้งาน session ไว้ด้านบนสุดของเพจ ดังนี้
ไฟล์ text_captcha.php
<?php session_start();?>
จบแล้วในส่วนของ ข้อความรูปภาพ
ที่นี้ก็มาถึงในส่วนของการเช็คความถูกต้องของ ข้อความที่ส่งมา วิธีการคือ
เก็บตัวแปร session มาเช็คกับ code ที่กรอก input มานั่นเอง
ถ้า $_SESSION['security_code']ตรงกับ $_POST['code_input']
และ $_SESSION['security_code'] จะต้องไม่ใช่ค่าว่าง ถ้าเป็นตามเงื่อนไขนี้ก็ผ่าน
ไฟล์ captcha_result.php
<?php if( $_SESSION['security_code'] == $_POST['code_input'] && !empty($_SESSION['security_code'] ) ) { echo 'ขอบคุณ สำหรับการทดสอบของท่าน'; unset($_SESSION['security_code']); } else { echo 'เสียใจด้วย รหัสภาพของท่านไม่ถูกต้อง'; } echo "<br/><br/><a href='captcha.php'>Back</a>" ?>
บทความนี้ก็จบลงเพียงเท่านี้ครับ.....
แล้วข้อนี้ต้องหามาจากไหนล่ะ
ตอบลบ4. jquery.js
5. 40240.TTF (font ตัวหนังสือที่ต้องการ)
6. bg.png (ภาพ background)
7. refresh.jpg (ภาพ)