|
คิดว่าทุก ๆ คนคงจะเคยเห็นกันนะครับ เวลาที่เราจะสมัครสมาชิก หรือไปโพสคอมเมนท์บล๊อกของใครเขา
ก็จะมีรหัสให้กรอกยืนยันก่อนการส่งข้อมูล ทั้งนี้ก็เพื่อเป็นการป้องกันการสแปมนั่นเองครับ
บางคนยังไม่เข้าใจว่า สแปม มันคืออะไรกัน
ก็คือ เดี๋ยวนี้เขามีโปรแกรมโพสคอมเม้นท์ หรือช่วยซับมิต หรือโปรแกรมหาแบล๊กลิงค์เป็นอัตโนมัติกันเยอะครับ
เขาก็จะหารายชื่อเว็บ หรือ บล๊อกที่สามารถโพสบทได้เป็น พัน เป็นหมื่นเว็บ แล้วก็สั่งให้โปรแกรมที่ว่ามันทำงานไป
โดยที่เจ้าตัวไม่ต้องมานั่งทำเอง การโพสก็จะโพสข้อความเดิม ๆ ซ้ำ ๆ หรือสุ่มเปลี่ยนไปเรื่อยแล้วแต่
ซึ่งบทความที่โพสอัตโนมัติเหล่านี้หล่ะครับ ที่เขาเรียกว่า "สแปม"
ซึ่งถ้าเราไม่ป้องกันไว้ จะเกิดอะไรขึ้น
บทความของเรา เว็บของเราก็จะมีแต่ข้อความที่มาจากสแปมครับ
ซึ่งเห็นบางเว็บไซต์ ยาวเยียดเลยทีเดียว ทำให้หนักเครื่อง กินทรัพยากร และทำให้โหลดหน้าเว็บได้ช้าด้วยนะ
ดังนั้นเราจึงต้องมาทำความรู้จักกับการทำ Captcha Security Code กันในวันนี้ครับ
เอาแต่เนื้อ ๆ นะครับ น้ำไม่ชอบ เดี๋ยวกันจะเยอะ ทำให้รกเสียเปล่า ๆ
ขั้นตอนและกระบวนการ
1. เราจะทำการสุ่มรหัสลับออกมา (จะเอาตัวอักษร ตัวเลข หรือผสมกันก็สุดแล้วแต่)
2.จากนั้นเราก็จะแปลงรหัสนั้นให้เป็นไฟล์ภาพ (เพื่อป้องกันอีกชั้นนึ่ง และทำให้ยากขึ้นไปอีก เพราะถ้าเราทำเพียงแค่ตัวอักษรแปะไว้ข้าง ๆ เขาก็ก๊อปวางได้ แต่ถ้าทำเป็นรูปภาพแล้วหล่ะก็ ยังไงก็ต้องพิมพ์เองใช่ไหมครับ 5555+)
มาดูโค้ดกัีนเลยดีกว่า
<?php
function createRandomPassword() { // ฟังก์ชั่นสำหรับสุ่มรหัสลับ
srand( date("s") );
$chars = "ABCDEFGHIJKLMNOPQRSTUVWXYZ"; // ตัวแปรที่จะทำการสุ่ม จะเป็นตัวเลข ตัวเล็ก ตัวใหญ่ หรือผสมกันไปก็ใส่เพิ่มเอาเอง
$ret_str = "";
$num = strlen($chars);
for($i=0; $i < 6; $i++) {
$ret_str.= $chars[rand()%$num]." ";// สุ่มเอามาสัก 6 ตัว 0 ถึง 5 ก็ 6 นั่นหล่ะน่าาา
}
return $ret_str;
}
$text = createRandomPassword(); // เรียกใช้หังก์ชั้นสุ่มรหัสลับ แล้วมาเก็บค่าไว้ในตัวแปร $text
echo ''; // ตรงนี้สำหรับเก็บค่าตัวแปรที่ได้เพื่อส่งไปทำการตรวจเช็คกับ รหัสลับ ที่ผู้ใช้กรอก ว่าถูกต้องตรงกันหรือไม่
$font_size = 20;
$height = 20;
$width = 100;
// ข้างล่างนี้เป็นการสร้างภาพและเอารหัสลับที่ได้ยัดใส่เข้าไปอยู่ในภาพที่สร้าง สามารถปรับเปลี่ยนได้นะครับ
$im = ImageCreate($width, $height);
$grey = ImageColorAllocate($im, 230, 230, 230);
$black = ImageColorAllocate($im, 0, 0, 0);
$text_bbox = ImageTTFBBox($font_size, 0, "ANGSAZ.TTF", $text); // อย่าลืมก๊อปไฟล์ฟอร์นมาไว้ในโฟลเดอร์ด้วยนะ ไม่งั้นจะไม่แสดงผล
$image_centerx = $width / 2;
$image_centery = $height / 2;
$text_x = $image_centerx - round(($text_bbox[4]/2));
$text_y = $image_centery + 5;
//$text_y = $image_centery;
ImageTTFText($im, $font_size, 0, $text_x, $text_y, $black, "ANGSAZ.TTF", $text);
ImagePng($im,"image-code.png");
ImageDestroy ($im);
echo " "; >// และสุดท้ายก็แสดงผลรูปภาพออกมา
?>
ส่วนการตรวจเช็คก็ทำได้หลายวิธีครับ แต่ผมชอบวิธีนี้
คือตรวจก่อนส่งไปเลย ว่าถูกต้องหรือไม่ถูกต้อง ก็เขียนโค้ดในส่วนของฟอร์มดังนี้ครับ คือเมื่อคลิกที่ submit เราก็เรียกใช้ฟังก์ชั่นสำหรับตรวจสอบค่าของเท็กซ์ว่า ว่างหรือไม่ หรือถ้าไม่ว่างรหัสลับกรอกถูกต้องหรือไม่
onSubmit="return Check_txt()" enctype="multipart/form-data">
ส่วนของฟังก์ชั่นตรวจเช็คความถูกต้อง
*** แล้ว document.getElementById('code_chk').value มันมาจากไหนหว่าาาาาาาา
อันนี้ผมเอาไปยัดไว้ตอนสุ่มรหัสนู้น ครับ (สีน้ำเงิน) แต่ถ้าใครไม่ชอบแบบนี้ก็ย้ายมันไปไว้ที่อื่นก็ได้ไม่ว่ากันครับ
เพียงแค่นี้เว็บเราก็จะมีระบบป้องกันสแปมแล้ว ถือว่าดูดีมีระดับขึ้นมาอีกขั้นนึง
บางเว็บอาจจะส่งค่าตัวแปรไปเช็ครหัสลับตอนก่อนบันทึกผลก็เห็นเยอะครับ แต่ผมไม่ชอบแบบนั้น
อยากให้ผู้ใช้ได้รู้เลยว่า มันผิด มันถูกไหม อย่างไร จะได้แก้ให้จบกันไปเลยทีเดียว............
|