Cara Mudah Membuat Captcha di Php tanpa Plugin. Assalamualaikum, halo semuanya kembali lagi di sahretech. Kali ini saya akan berbagi tutorial cara membuat captcha sebagai validasi form register yang akan kita buat.
Lebih lanjut, captcha adalah salah satu tools yang berfungsi untuk memvalidasi inputan user. Dengan hadirnya captcha user akan dites, apakah mereka adalah robot atau manusia. Itulah alasan kenapa banyak situs-situs besar menerapkan captcha setiap kali ada user yang melakukan pendaftaran.
Cara kerjanya cukup simple, web akan membuat sebuah karakter acak setiap kali halaman direfresh, user wajib memasukan karakter acak tersebut di form yang disediakan, jika captcha salah maka proses akan kembali ke halaman registrasi tapi jika captcha benar maka proses akan dilanjutkan.Ok, biar nggak penasaran langsung saja kita coba ngoding. Kita akan membuat sebuah contoh sederhana penerapan captcha yang akan membuka wawasan anda.
Cara Membuat Captcha di Php
- 1. Buat sebuah folder baru dengan nama captcha, lalu buat sebah file baru di dalam folder captcha dengan nama index.php. Isi file index.php dengan script di bawah ini.
<link href="//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css">
<script src="//netdna.bootstrapcdn.com/bootstrap/3.0.0/js/bootstrap.min.js"></script>
<br><br>
<div class="container">
<div class="row">
<div class="col-md-4 col-md-offset-4">
<div class="panel panel-default">
<div class="panel-heading">
<h3 class="panel-title">Register</h3>
</div>
<div class="panel-body">
<form action="proses.php" method="post">
<div class="form-group">
<input class="form-control" placeholder="Name" name="name" type="text">
</div>
<div class="form-group">
<input class="form-control" placeholder="Phone" name="phone" type="number">
</div>
<div class="form-group">
<input class="form-control" placeholder="Email" name="email" type="text">
</div>
<div class="form-group">
<input class="form-control" placeholder="Password" name="password" type="password">
</div>
<div class="form-group">
<img src="generate.php" alt="gambar" />
</div>
<div class="form-group">
<input class="form-control" name="kode" value="" placeholder="kode captcha" maxlength="5"/>
</div>
<input class="btn btn-lg btn-success btn-block" type="submit" value="Register">
</form>
</div>
</div>
</div>
</div>
</div>
- 2. Buat sebuah file baru di dalam folder captcha dengan nama generate.php, lalu copy paste script di bawah ini
<?php
session_start();
function acakCaptcha() {
$kode = "abcdefghijklmnopqrstuwxyzABCDEFGHIJKLMNOPQRSTUWXYZ0123456789";
$pass = array();
$panjangkode = strlen($kode) - 2;
for ($i = 0; $i < 5; $i++) {
$n = rand(0, $panjangkode);
$pass[] = $kode[$n];
}
return implode($pass);
}
//hasil kode acak disimpan di $code
$code = acakCaptcha();
//kode acak disimpan di dalam session agar data dapat dipassing ke halaman lain
$_SESSION["code"] = $code;
//membuat background
$wh = imagecreatetruecolor(173, 50);
$bgc = imagecolorallocate($wh, 22, 86, 165);
//membuat text warna
$fc = imagecolorallocate($wh, 223, 230, 233);
imagefill($wh, 0, 0, $bgc);
imagestring($wh, 10, 50, 15, $code, $fc);
//membuat gambar
header('content-type: image/jpg');
imagejpeg($wh);
imagedestroy($wh);
?>
untuk membuat kode captcha, kita perlu menggunakan beberapa fungsi dasar seperti for dan session. Session digunakan agar variabel yang ada di dalamnya dapat dipassing ke halaman lain. Lalu ada beberapa fungsi php yang kita gunakan untuk membuat warna background, warna text dan membuat gambar. Jika, kalian sudah membuat 2 file di atas maka hasilnya akan tampak seperti gambar di bawah ini
Tampilan form registrasi dengan captcha |
- 3. Buat sebuah file baru di dalam folder captcha dengan nama proses.php lalu copy paste script di bawah ini.
<?php
session_start();
if($_SESSION["code"] != $_POST["kode"]){
//jika code captcha salah mmaka akan kembali ke halaman sebelumnya
echo "<script>alert('captcha yang anda masukkan salah');window.history.go(-1);</script>";
}else{ ?>
<link href="//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css">
<script src="//netdna.bootstrapcdn.com/bootstrap/3.0.0/js/bootstrap.min.js"></script>
<br><br>
<div class="container">
<div class="row">
<div class="col-md-4 col-md-offset-4">
<div class="panel panel-default">
<div class="panel-heading">
<h3 class="panel-title">Register</h3>
</div>
<div class="panel-body">
<div class="form-group">
<?php echo $_POST['name']; ?>
</div>
<div class="form-group">
<?php echo $_POST['email']; ?>
</div>
</div>
</div>
</div>
</div>
</div>
<?php } ?>
- 4. Nyalakan webservice kalian, buka browser dan ketik localhost/captcha. Hasilnya akan tampak seperti gambar di bawah ini.
Hasil captcha dan proses captcha |
Bagaimana, mudah bukan ?. kalian tidak perlu install plugin yang macam-macam, juga tidak perlu menggunakan javascript, cukup menggunakan pemahaman php dasar kalian, dan jadilah sebuah captcha yang dapat digunakan untuk validasi form registrasi.
Ok sekian tutorial cara mudah membuat captcha di php tanpa plugin. Mudah-mudahan tutorial ini dapat membantu kalian semua dan semoga dari yang sedikit ini dapat diimprove lagi ke tingkat lanjut (advance). Lebih dan kurangnya saya mohon maaf, bila ada kritik, saran dan pertanyaan silahkan tinggalkan di kolom komentar di bawah ini. Happy Coding :)
Terima kasih gan tutorial nya.
ReplyDeletealhamdulillah, terima kasih gan atas kunjugannya. Senang bisa membantu orang lain
Deletekok tidak muncul gambar captcha nya ya?
ReplyDeleteAda errornya gk mas?, atau coba diikuti ulang terus codingannya dicopas aja
Deletesaya sudah copas codingnya mas, tapi kenapa gambar captchanya tidak muncul?
ReplyDeleteterima kasih mas yusuf ilham atas kunjungannya, sudah saya coba ulang mas, dan alhamdulillah tidak terjadi masalah. Solusi yg bisa dijalankan, pertama: pastikan terkoneksi ke internet, dan php yang digunakan adalah versi 7+
DeleteJika masih terjadi error, coba DM saya saja langsung melalui fanspage sahretech. Terima kasih :)
saya juga sudah coba codingannya gan. captchanya jg tidak muncul. versi php sudah 7+ dan internet lancar. kenapa ya?
Deleteklo php 7+ harusnya lancar sih, kecuali pake php 8 mungkin gk bisa. mas yusuf soalnya di php 8 bermasalah, di php 7 lancar
DeleteMas boleh minta solusinya cara membuat captchanya tidak acak, jadi kita sudah masukan nilainya dalam array. cara memunculkannya kelayar gimana ya gan munculnya bergantian saat browser di refresh.
ReplyDeletecontoh isinya ada 5 index, nanti muncul satu persatu bergantian saat refresh. Terimakasih
sudah saya jawab di facebook mas
Deleteyang bertanya kenapa gambar nya tidak muncul. coba cek PHP GD nya sudah terinstall belum. caranya buat script seperti ini
ReplyDelete