kali ini saya akan share tutorial cara membuat captcha sederhana, captcha digunakan terutamanya untuk mengelakkan perisian automatik (bot) dari melakukan tindakan sama seperti manusia melakukan sign up atau login dan sebagainya. Misalnya ketika sign up untuk akun email baru, anda akan menemui captcha di bahagian bawah sign-up, Ini sebenarnya untuk memastikan bahawa form tersebut hanya boleh diisi oleh manusia dan bukannya perisian automatik atau komputer bot.
fungsi dari captcha sendiri bisa juga diartikan untuk menguji kebenaran dari suatu jawaban yang soalnya diberikan oleh computer yang berupa angka dan huruf, tujuan captcha adalah untuk membedakan apakah jawaban itu dari computer atau dari manusia.
ok kita langsung saja ke inti pembahasan, pertama buatlah projek dengan nama terserah anda, kemudian buat file dengan nama index.php dan salin kode berikut
<!DOCTYPE html>
<html>
<head>
<title>MEMBUAT CAPTHA SEDERHANA</title>
<script type="text/javascript">
window.onload = function() {
document.getElementById('send_data').addEventListener('click', function() {
var http,
response,
captcha;
captcha = document.getElementById('captcha');
if (window.XMLHttpRequest) {
http = new XMLHttpRequest();
} else {
http = new ActiveXObject('Microsoft.XMLHTTP');
}
http.onreadystatechange = function() {
if (http.readyState == 4 && http.status == 200) {
// set response menjadi JSON
response = JSON.parse(http.responseText);
// munculkan pesan
alert(response.message);
// kosongkan textbox
captcha.value = '';
}
}
http.open('POST', 'cek.php', false);
http.setRequestHeader('Content-type', 'application/x-www-form-urlencoded');
http.send('captcha='+ captcha.value);
});
}
</script>
</head>
<body>
<img src="captcha.php"><br />
<input type="text" id="captcha" /><br />
<button id="send_data">CEK CAPTCHA</button>
</body>
</html>
selanjutnya yaitu buat script yang akan memproses captcha yang di kirim melalui textbox yang di inputsilahkan salin kode berikut dan simpan file didalam projek yang sudah anda buat dengan nama cek.php
<?php
session_start();
$captcha = $_POST['captcha'];
// jika captcha tidak kosong
if (!empty($captcha)) {
// jika captcha sesuai dengan image
if ($captcha == $_SESSION['captcha']) {
$response = array(
'error'=>false,
'message'=>'Captcha valid'
);
// jika captcha tidak sesuai dengan image
} else {
$response = array(
'error'=>false,
'message'=>'Captcha invalid'
);
}
// jika captcha kosong
} else {
$response = array(
'error'=>false,
'message'=>'Please enter captcha'
);
}
// buat response berupa JSON
echo json_encode($response);
dan yang terakhir adalah membuat captcha nya, silahkan salin kode berikut dan simpan di dalam projek yang sudah anda buat dengan nama captcha.php
<?php
session_start();
header('Content-type: image/png');
// mengacak huruf dan angka
$chart = str_shuffle('0123456789abcdefghijklmnopqrstuvwxyz');
// ambil 5 karankter dari chart yang di acak
$captcha = substr($chart, 0, 5);
// simpan captcha di dalam session
$_SESSION['captcha'] = $captcha;
// membuat gambar
// imagecreate(P, L)
// P : panjang, L : tinggi
$image = imagecreate(65, 30);
// membuat background dan text
// imagecolorallocate(image, red, green, blue);
$background = imagecolorallocate($image, 2, 89, 47);
$text = imagecolorallocate($image, 255, 255, 255);
imagefilledrectangle($image, 0, 0, 65, 30, $background);
imagestring($image, 20, 10, 7, $captcha, $text);
imagejpeg($image);
imagedestroy($image);
sekarang buka projek anda dengan browser, dan coba masukan captcha yang tertera pada browser anda jika captcha yang di masukan adalah benar maka anda akan mendapatkan pesan Captcha valid sedangkan jika tidak, anda akan mendapatkan pesan Captcha invalidok sampai disini dulu tutorial kali ini, selamat mencoba dan semoga bisa bermanfaat.
gambar nya tidak muncul kok??
ReplyDeletemantab nih tutorialnya
ReplyDeleteJasa Sewa Gudang