Captcha (Completely Automated Public Turing Test to Tell Computers and Humans Apart) adalah suatu bentuk uji tantangan-tanggapan (challenge-response test) yang digunakan untuk memastikan bahwa jawaban tidak dihasilkan oleh suatu komputer atau bot. Dengan kata lain Captcha ini digunakan untuk mengidentifikasi sebuah perangkat dipakai oleh manusia atau bot. Jika manusia yang mengoperasikan perangkat, maka akan mudah untuk mengisi kode captcha, akan tetapi captcha dibuat lebih sulit untuk bot.
Salah satu layanan CAPTCHA yang sangat bagus adalah reCAPTCHA yang berada dalam pengelolaan salah satu raksasa internet yaitu Google. reCAPTCHA mampu memberikan tantangan CAPTCHA yang kompleks namun tetap mudah diselesaikan pengguna biasa. Oleh karena itu, pada artikel kali ini kita akan membahas bagaimana cara implementasi Google reCaptcha pada Laravel.

Setting reCAPTCHA
Pertama-tama kita harus memiliki 2 key yang diperlukan untuk mengimplementasikan reCAPTCHA pada aplikasi kita. Key tersebut adalah site key dan secret key. Untuk mendapatkannya, kita harus mendaftarkan website kita pada halaman google reCAPTCHA melalui link dibawah ini.
Kemudian klik pada ikon plus untuk mendaftarkan website kita agar bisa di integrasikan dengan google reCaptcha.

Pada contoh kali ini kita akan menggunakan reCaptcha versi 2, silahkan isi data yang lain pada form diatas sesuai dengan kebutuhan. Setelah mengisi form diatas, kita akan diarahkan kehalaman setup key untuk mendapatkan 2 key (site key dan secret key) yang harus kita gunakan untuk implementasi Google reCaptcha pada Laravel.

Langkah diatas merupakan langkah terakhir dalam pengaturan google reCaptcha, selanjutnya kita akan membahas apa saja yang harus kita persiapkan pada project Laravel kita.
Install Laravel reCaptcha package
Pada tutorial kali ini kita akan menggunakan sebuah package untuk implementasi google reCaptcha di Laravel.
no-captcha (this link opens in a new window) by anhskohbo (this link opens in a new window)
No CAPTCHA reCAPTCHA For Laravel.
Untuk menginstal package gunakan perintah composer dibawah ini.
composer require anhskohbo/no-captcha
Publish config file dengan menggunakan perintah dibawah ini
php artisan vendor:publish --provider="Anhskohbo\NoCaptcha\NoCaptchaServiceProvider"
Pengaturan
Seperti yang telah kita bahas sebelumnya, kita perlu mendefinisikan 2 buah keys dari google reCaptcha agar project Laravel yang kita buat bisa terintegrasi dengan google reCaptcha.
Untuk konfigurasi keys dari google reCaptcha kita perlu mendefinisikan NOCAPTCHA_SECRET
dan NOCAPTCHA_SITEKEY
pada file .env di project Laravel kita.
NOCAPTCHA_SECRET=secret-key NOCAPTCHA_SITEKEY=site-key
Penggunaan
Untuk menampilkan google reCaptcha pada view Laravel, pertama kita harus menginclude kode javascript dari google reCaptcha pada halaman view dengan menggunakan kode dibawah ini
{!! NoCaptcha::renderJs() !!}
Display reCaptcha
Langkah selanjutnya untuk menampilkan reCaptcha pada halaman view tambahkan kode dibawah ini
{!! NoCaptcha::display() !!}
Silahkan tambahkan kode diatas pada view yang akan menampilkan google reCaptcha. Jika semua konfigurasi diatas telah sesuai, google reCaptcha akan muncul pada halaman view yang digunakan seperti contoh dibawah ini. Pada contoh ini saya menggunakan view login untuk menampilkan google reCaptcha.

reCaptcha Validation
Setelah google reCaptcha muncul pada halaman view, langkah selanjutnya kita harus memastikan bahwa pengguna menceklis google reCaptcha dengan menambahkan rules validasi.
Untuk memvalidasi captcha ini kita hanya perlu menambahkan 'g-recaptcha-response' => 'required|captcha'
pada validation rules yang kita gunakan.

Jika pengguna mensubmit form tanpa menceklis google reCaptcha, maka pesan diatas akan muncul.
No Comments
Leave a comment Cancel