Implementasi Google reCaptcha pada Laravel

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.

reCAPTCHA

reCAPTCHA is a security service that protects your websites from fraud and abuse.

www.google.com

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.

Dark Mode

no-captcha (this link opens in a new window) by anhskohbo (this link opens in a new window)

No CAPTCHA reCAPTCHA For Laravel.

45 Subscribers 1174 Watchers 176 Forks Check out this repository on GitHub.com (this link opens in a new window)

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.

Alfa Adhitya Member since December 18, 2019

Computer science education cannot make anybody an expert programmer any more than studying brushes and pigment can make somebody an expert painter – Eric S