Lompat ke konten Lompat ke sidebar Lompat ke footer

Cara buat Integrasi CAPTCHA Google di Laravel 8/9/10 dengan Buzz\LaravelGoogleCaptcha

 Support Laravel 5/6/7/8/9/10




CAPTCHA adalah sebuah alat yang digunakan untuk memverifikasi apakah pengguna yang mengakses suatu situs web adalah manusia atau tidak. CAPTCHA biasanya digunakan untuk mencegah spam, bot, dan serangan lainnya.

Dalam tutorial ini, kita akan belajar cara mengintegrasikan CAPTCHA di Laravel dengan menggunakan paket Buzz\LaravelGoogleCaptcha. Paket ini menyediakan API yang mudah digunakan untuk menampilkan dan memvalidasi CAPTCHA dari Google reCAPTCHA.

Langkah-langkah:

  1. Install paket Buzz\LaravelGoogleCaptcha.
composer require buzz/laravel-google-captcha
  1. Publikasikan file konfigurasi CAPTCHA.
php artisan vendor:publish --provider="Buzz\LaravelGoogleCaptcha\CaptchaServiceProvider"
  1. Dapatkan kunci rahasia dan kunci situs dari Google reCAPTCHA.

Anda dapat membuat kunci rahasia dan kunci situs dari situs web Google reCAPTCHA.

  1. Setel kunci rahasia dan kunci situs di file .env.
CAPTCHA_SECRET=[secret-key]
CAPTCHA_SITEKEY=[site-key]Anda bisa membuat kunci rahasia di website https://www.google.com/recaptchapilih yg v2checkbox
  1. Tampilkan CAPTCHA di formulir.

Untuk menampilkan CAPTCHA di formulir, gunakan kode berikut:

HTML
{!! app('captcha')->display($attributes = [], $options = ['lang'=> 'id']) !!}
  1. Validasi CAPTCHA.

Untuk memvalidasi CAPTCHA, gunakan kode berikut di controller Anda:

PHP
$validation = $this->validate($request, [
    'g-recaptcha-response' => 'required|captcha'
]);
  1. Tampilkan pesan kesalahan CAPTCHA.

Untuk menampilkan pesan kesalahan CAPTCHA, gunakan kode berikut di view Anda:

HTML
@error('g-recaptcha-response') <small class="text-danger"> {{$message}} </small> @enderror

Contoh:

Berikut adalah contoh penerapan CAPTCHA di Laravel dengan menggunakan paket Buzz\LaravelGoogleCaptcha:

PHP
// Controller
public function login(Request $request)
{


    $validation = $this->validate($request, [
        'email' => 'required|email',
        'password' => 'required',
        'g-recaptcha-response' => 'required|captcha'
    ]);


    if ($validation->fails()) {
        return redirect()->back()->withErrors($validation);
    }


    // ...
}

// View
<div class="d-flex flex-column">
                  <div>
                    {!! app('captcha')->display($attributes = [], $options = ['lang'=> 'id']) !!}
                  </div> 
                  <div>
                    @error('g-recaptcha-response') <small class="text-danger"> {{$message}} </small> @enderror
                  </div>
                </div>

Penjelasan:

  • Langkah 1: Install paket Buzz\LaravelGoogleCaptcha menggunakan Composer.
  • Langkah 2: Publikasikan file konfigurasi CAPTCHA.
  • Langkah 3: Dapatkan kunci rahasia dan kunci situs dari Google reCAPTCHA.
  • Langkah 4: Setel kunci rahasia dan kunci situs di file .env.
  • Langkah 5: Tampilkan CAPTCHA di formulir.
  • Langkah 6: Validasi CAPTCHA.
  • Langkah 7: Tampilkan pesan kesalahan CAPTCHA.

Kesimpulan:

Dengan mengikuti langkah-langkah di atas, Anda dapat dengan mudah mengintegrasikan CAPTCHA di Laravel dengan menggunakan paket Buzz\LaravelGoogleCaptcha.