Skip to main content

Cara Membuat Captcha dengan PHP



Dalam kesempatan pada tutorial kali ini kita akan membahas Cara Membuat CAPTCHA Menggunakan PHP, dalam tutorial ini kita akan membuat CAPTCHA secara manual atau sendiri dengan bahasa PHP.
Berikut  adalah tampilan halaman CAPTCHA yang selesai dibuat, halaman ini terdiri dari satu halaman HTML, dua file PHP dan satu file font. Ikuti langkah-langkah dibawah ini untuk dapat membuat CAPTCHA menggunakan PHP.

Sebelum langsung praktek dalam membuat CAPTCHA menggunakan PHP, ada baiknya kita mengetahui sedikit dari istilah dari CAPTCHA.

CAPTCHA merupakan sebuah alat untuk menguji inputan dari reader, apakah reader itu manusia atau robot atau alat yang digunakan oleh sebuah aplikasi untuk memastikan bahwa jawaban tidak dihasilkan oleh komputer secara otomatis. Dalam sebuah halaman web, alat ini berfungsi untuk menghindari spam atau robot yang mengisikan data secara otomatis.

Proses CAPTCHA biasanya melibatkan suatu komputer (server) yang meminta reader atau user untuk menyelesaikan suatu uji sederhana yang dapat dihasilkan dan dinilai oleh komputer tersebut.

Karena komputer tidak dapat memecahkan CAPTCHA, user yang dapat memberikan jawaban yang benar akan dianggap sebagai manusia. CAPTCHA umumnya menggunakan huruf dan angka dari citra terdistorsi yang muncul di layar.

Oke, mari kita mulai membuat CAPTCHA menggunakan PHP.

Cara Membuat CAPTCHA Menggunakan PHP


CAPTCHA sebenarnya mudah dibuat karena hanya membuat fungsi untuk menggenerate karakter random kemudian meletakkannya di dalam gambar. Serta menyimpannya dalam bentuk session atau variabel tertentu.

Tapi memang teknologi CAPTCHA belumlah sempurna, karena Spammer bisa saja mementahkan CAPTCHA secara manual, dan juga bisa membuat software untuk memecahkan CAPTCHA dengan tingkat kesulitan tertentu.

Walaupun demikian, CAPTCHA tetap penting untuk website. Karena sangat berperan mengurangi spam dan entri form yang salah.

Langkah 1: Membuat Halaman CAPTCHA Web


Seperti biasa silahkan anda membuka teks editor kesukaan anda, dalam tutorial ini capsmedia menggunakan notepad++, setelah itu sillahkan mengetikkan atau langsung salin kode/skrip dibawah ini dan simpan dengan nama index.html.
<html>
<head>
	<title>Halaman Login</title>
</head>
<body>
	<p align="center"><b>Isi Username dan Password Anda</b></p>
	<!-- Membuat Form Login -->
	<!-- tentukan aksi jika form telah disubmit -->
	<form action="hasil.php" method="post">
		<table border="0" cellpadding="0" cellspacing="0" align="center">
			<tr>
				<td> Username </td>
				<td><input name="username" value="" maxlength="10"></td>
			</tr>
			<tr>
				<td>Password</td>
				<td><input type="password" name="password" value ="" maxlength="10"></td>
			</tr>
			<tr>
				<td>Captcha</td>
				<!-- kita tentukan letak dari skrip generate gambar -->
				<td><img src="gambar.php" alt="gambar" /></td>
			</tr>
			<tr>
				<td>Isikan captcha </td>
				<td><input name="nilaiCaptcha" value="" maxlength="6"/></td>
			</tr>
			<tr>
				<td><input type ="submit" value="Masuk"></td>
			</tr>
		</table>
	</form>
</body>
</html>

Skrip diatas terdapat satu form yang terdiri dari input
Username
dan input CAPTCHA. Form tersebut jika disubmit akan menjalankan file


hasil.php
Sedangkan skrip
<img src="gambar.php" alt="gambar"/>
berfungsi untuk menampilkan gambar CHAPTCHA.
Oke, kita sudah selesai membuat  CAPTCHA pada halaman web, selanjutnya kita membuat skrip gambar.php, skrip ini seperti yang sudah dijelaskan diatas yaitu berfungsi sebagai generate sekaligus penampil gambar CAPTCHA.

Langkah 2: Membuat Skrip Generate CAPTCHA

Buat file baru di teks editor anda dan beri nama gambar.php, file gambar.php harus satu folder dengan file index.html. Berikut Skrip atau kode dalam generate CAPTCHA.
<?php
//aktifkan session
session_start();
header("Content-type: image/png");
// beri nama session dengan nama Captcha
$_SESSION["Captcha"]="";
//tentukan ukuran gambar
$gbr = imagecreate(200, 50);
//warna background gambar
imagecolorallocate($gbr, 167, 218, 239);
$grey = imagecolorallocate($gbr, 128, 128, 128);
$black = imagecolorallocate($gbr, 0, 0,0);
// tentukan font
$font = "monaco.ttf";
// membuat nomor acak dan ditampilkan pada gambar
for($i=0;$i<=5;$i++) {
	// jumlah karakter
	$nomor=rand(0, 9);
	$_SESSION["Captcha"].=$nomor;
	$sudut= rand(-25, 25);
	imagettftext($gbr, 20, $sudut, 8+15*$i, 25, $black, $font, $nomor);
	// efek shadow
	imagettftext ($gbr, 20, $sudut, 9+15*$i, 26, $grey, $font, $nomor);
}
//untuk membuat gambar 
imagepng($gbr);
imagedestroy($gbr);
?>
Kode di atas hanya berupa kode PHP saja, fungsinya untuk membuat gambar. Tidak ada sama sekali tag-tag HTML. Di atas ada tulisan
$font = 'monaco.ttf'
Ini karena capsmedia menggunakan font monaco yang diletakkan satu folder dengan file php-nya. Kalau Anda menggunakan font lain, tinggal diganti Kode
session_start();
adalah untuk menjalankan
session
karena hasil angka yang digenerate akan ditampilkan di CAPTCHA dan dimasukkan ke session agar bisa disimpan pada Kode
$_SESSION["CAPTHA"]=""
digunakan untuk mengosongkan sesi nomor CAPTCHA agar kosong dahulu. Jika sebelumnya sudah terdapat session, maka kalau halaman di-refresh akan kosong lagi session-nya.
Dengan perintah
magecreate
di atas gunanya untuk membuat gambar dengan ukuran tertentu. Setelah itu Anda meng-generate nomor acak dengan perintah
rand()
Nomor acak ini kemudian ditambahkan ke dalam CAPTCHA dengan
loop for
Kemudian dieksekusi pembuatan png dengan perintah
imagepng()
Hasil Tampilan halaman website setelah kita selesai Membuat Skrip Generate CAPTCHA.
Coba refresh halaman browser, maka akan menampilkan kode CAPTCHA yang baru.
Jika anda memasukkan username dan password disertai dengan kode CAPTCHA dan klik tombol “Masuk”, maka tidak akan muncul apa-apa, karena pada proses form jika disubmit akan membutuhkan file hasil.php

Langkah 3: Membuat kode atau Skrip Hasil Form HTML

Mari kita periksa lagi kode/skrip dari file index.html, dari skrip tersebut terdapat baris kode
<form action="hasil.php" method="post">
baris kode ini membutuhkan file hasil.php
dalam memproses halaman web jika tombol “Masuk” diklik.
Sekarang kita buat file hasil.php
kemudian berikan kode untuk cek username, password dan CAPTCHA. Berikan kondisi jika pengisian kode CAPTCHA sesuai dengan session atau tidak. Berikut adalah kode/skrip dari file html.php
<html>
<head>
	<title> Cek Hasil CAPTCHA </title>
</head>
<body>
<p align="center"> Hasil Login <br/>
 <?php
	//memanggil lagi session untuk dimulai 
	session_start();
	if($_SESSION["Captcha"]!=$_POST["nilaiCaptcha"]){
		echo "Username anda ".$_POST["username"]; echo "<br />";
		echo "Password anda ".$_POST["password"]; echo "<br />";
		echo "Kode Captcha Anda Salah";
	}else{ 
		// jika teryata lolos
		echo "Username anda ".$_POST["username"] ; echo "<br/>";
		echo "Password anda ".$_POST["password"]; echo "<br/>";
		echo "Kode Captcha Anda Benar";
   }
?>
</p>
</body>
</html>
Kode diatas dimulai dengan session_start();
untuk memulai session, setelah itu ada pengecekan nilai session dengan input dari user. Jika hasil benar maka akan menampilkan pesan “Kode Captcha Anda Benar”, tetapi jika salah akan memunculkan pesan “Kode Captcha Anda Salah”.

Langkah 4: Uji Coba CAPTCHA dalam halaman web

Sekarang tiba saatnya untuk uji coba skrip CAPTCHA menggunakan PHP, silahkan buka file index.html  maka akan muncul halaman web seperti berikut.
Masukkan Username, Password dan jangan lupa masukkan kode CAPTCHA dengan benar, jika input anda benar maka akan muncul halaman web seperti gambar berikut.
Tetapi jika input kode CAPTCHA anda salah, maka akan menampilkan halaman web seperti berikut ini.
Semoga tutorial Cara Membuat CAPTCHA Menggunakan PHP bisa bermanfaat bagi pembaca web

Comments

Popular posts from this blog

Membuat Tombol Scroll ke Atas (back to top) dengan JQuery

Cara membuat tombol scroll ke atas dengan jquery (back to top) – Sebuah website yang begitu panjang kebawah tentu akan menyulitkan penggunanya untuk bisa kembali lagi keatas, karena harus scroll terus dengan menggunakan mouse. Hal tersebut tentu kurang efektif. Untuk mengatasi hal tersebut, banyak orang menggunakan sebuah tombol yang ketika di klik akan membawa kita ke bagian atas halaman website dengan animasi yang menarik. Dibutuhkan jquery untuk membuat hal semacam itu, dan pada tutorial kali ini  Media Kunci  akan mengajarkan Anda cara membuatnya. Mudah kok, script nya juga tidak panjang. 1.  HTML:  Buat sebuah file html dan tuliskan script markup nya seperti berikut ini <div id="wrapper"> <h1>Membuat Tombol Scroll to Top Dengan Jquery</h1> <h5><a href="https://mediakunci.blogspot.com/2019/04/membuat-tombol-scroll-ke-atas-back-to.html">Baca tutorial di Media Kunci</a></h5> Konten yang panjang disini....

Insert Data ke Database Tanpa Loading dengan PHP dan jQuery

Insert Data ke Database Tanpa Loading dengan PHP dan jQuery. Tutorial pertama tentang jQuery ini akan saya mulai dari yang sederhana aja dulu yaitu cara Insert Data ke Database Tanpa Loading dengan PHP dan jQuery. Baca juga :  Menampilkan Data dari Database MySQL Tanpa Loading Dengan jQuery Sebelumnya silahkan download dahulu jQuery di website resminya  disini . Selanjutnya buat sebuah database, dalam hal ini saya membuat database dengan nama  terserah . Kemudian dumping Script SQL di bawah ini: CREATE TABLE `siswa` ( `nama` varchar(32) NOT NULL, `kelas` varchar(3) NOT NULL, `jurusan` varchar(20) NOT NULL ) ENGINE=MyISAM DEFAULT CHARSET=utf8; Dari Script SQL di atas anda akan mendapatkan sebuah table dengan nama  siswa  dengan tiga buah field yaitu nama, kelas, jurusan. Jika sudah kita akan membuat Form HTML, dan berikut ini kodenya: <html> <head> <title>Insert Data ke Database Dengan jQuery</title> </head> <body> <form id=&q

Belajar PHP (Membuat Halaman Komentar)

Fasilitas komentar pada sebuah website akan menjadikan situs kita rancang menjadi lebih hidup karena dapat mengajak pengunjung untuk berinteraksi secara langsung. Umumnya fasilitas komentar dapat kita jumpai hampir disetiap website, blog atau bahkan forum seperti ini untuk mendapatkan umpan balik baik itu masukan, kritikan, pertanyaan atau bahkan pujian dari pengunjung website. Konsep pembuatan komentar ternyata cukup sederhana, asalkan paham sedikit mengenai PHP dan MYSQL, Insya Allah kamu dapat memahami bagaimana cara kerjanya. Berikut ini saya akan mencoba menulis bagaimana membuat fasilitas halaman komentar sederhana Masuk ke MYSQL buat database dan tabel dalam contoh ini databasenya adalah komentar sedangkan tabelnya adalah data. mysql> use komentar; Database changed mysql> mysql> use komentar; Database changed mysql> create table data( -> id INT NOT NULL  AUTO_INCREMENT PRIMARY KEY, -> nama VARCHAR(50) NOT NULL, -> email VARCHAR(50) NOT NULL, -> isi TEXT