Cara Mudah Membuat Captcha di Php Tanpa Plugin

Share:

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>
agar lebih terlihat indah, form registrasi diberi bootstrap. Form registrasi di atas sangat sederhana, intinya memperlihatkan kepada teman-teman sekalian bagaimana penerapan captcha pada form registrasi.

  • 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 - sahretech
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 } ?>

di dalam proses.php kode captcha akan diperiksa, jika kode captcha salah maka akan dikembalikan ke halaman sebelumnya dan menampilkan pesan captcha yang anda masukan salah. Sebaliknya jika kode captcha benar maka akan menampilkan nama dan email yang dimasukkan oleh user

  • 4. Nyalakan webservice kalian, buka browser dan ketik localhost/captcha. Hasilnya akan tampak seperti gambar di bawah ini.

hasil captcha dan proses captcha - sahretech
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 :)

11 comments:

  1. Replies
    1. alhamdulillah, terima kasih gan atas kunjugannya. Senang bisa membantu orang lain

      Delete
  2. kok tidak muncul gambar captcha nya ya?

    ReplyDelete
    Replies
    1. Ada errornya gk mas?, atau coba diikuti ulang terus codingannya dicopas aja

      Delete
  3. saya sudah copas codingnya mas, tapi kenapa gambar captchanya tidak muncul?

    ReplyDelete
    Replies
    1. terima 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+

      Jika masih terjadi error, coba DM saya saja langsung melalui fanspage sahretech. Terima kasih :)

      Delete
    2. saya juga sudah coba codingannya gan. captchanya jg tidak muncul. versi php sudah 7+ dan internet lancar. kenapa ya?

      Delete
    3. klo php 7+ harusnya lancar sih, kecuali pake php 8 mungkin gk bisa. mas yusuf soalnya di php 8 bermasalah, di php 7 lancar

      Delete
  4. Mas 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.
    contoh isinya ada 5 index, nanti muncul satu persatu bergantian saat refresh. Terimakasih

    ReplyDelete
  5. yang bertanya kenapa gambar nya tidak muncul. coba cek PHP GD nya sudah terinstall belum. caranya buat script seperti ini

    ReplyDelete

Jangan lupa kasih komentar ya!. Karena komentar kalian membantu kami menyediakan informasi yang lebih baik

Tidak boleh menyertakan link atau promosi produk saat berkomentar. Komentar tidak akan ditampilkan. Hubungi 081271449921(WA) untuk dapat menyertakan link dan promosi