Refresh Recaptcha Mews Captcha Di Laravel

Langsung ke inti pointnya Recaptcha adalah salah satu komponen penting dalam sebuah website yang dimana kalo kita perhatikan sekelas Google saja suka menempatakan recaptcha. Fungsi recaptcha sendiri kalo secara sudut pandang itu untuk meminimalisir Brute force sebuah web misalkan biasanya terdapat dalah sebuah form seperti di bawah ini.

Jadi kalo kita lihat bila user misalkan tidak melengkapi recaptcha atau tidak mengisi recaptcha maka form tidak akan bisa lanjut. Bila kalian sempat seberapa penting recaptcha kalian bisa lihat di website lain sebagai dasar pemahaman, untuk membuat recaptcha dilaravel saya rekomendasikan menggunakan package mews/captcha versi yang saya gunakan adalah versi 2.0 dan laravel yang digunakan versi 5.8. Untuk dokumentasi resmi kalian bisa ditemukan digithub untuk artikel kali ini saya hanya ingin melengkapi dimana saya akan menampilkan captcha dengan cara merefresh captcha jika misalkan ada salah atau masalah pada packagenya. Saya anggap misalkan sudah bisa tampil captchanya diwebsite atau diproject aplikasimu.

Langsung kita praktek, supaya bisa refresh captcha kalian siapkan fungsi dicontroller dengan fungsi seperti ini :

    public function refereshCapcha()
    {
        return captcha_img('math');
    }

Lalu buat route di web.php untuk memanggil fungsi yang kalian buat. 

Route::get('/refereshcapcha', 'HomeController@refereshCapcha');

Tempatkan captcha default dengan code seperti berikut ini.

<div class="captcha" style="margin-bottom: 5px;">
 <span id="captcha-img" class="refereshrecapcha">{!! captcha_img('math') !!}</span>
</div>
<button class="btn btn-primary btn-sm refresh-captcha">Refresh Captcha</button>

Supaya bisa merefresh captchanya kalian bisa tambahkan fungsi jquery dengan event onclick seperti berikut ini :

    $(document).on('click', '.refresh-captcha', function(e){
        e.preventDefault();
        $.ajax({
            url: "/refereshcapcha",
            type: 'get',
            dataType: 'html',
            success: function(json) {
                $('.refereshrecapcha').html(json);
            },
            error: function(data) {
                alert('Try Again.');
            }
        })
    });

Demikianlah artikel tentang refresh captcha, semoga bermanfaat.

 

Related Articles

Comments