Google reCAPTCHA v3 Kullanımı

Google reCAPTCHA v3 Kullanımı

Selamlar,

Daha önceki yazımda Invisible reCAPTCHA mvc üzerinde nasıl kullanılacağını anlatmıştım. Bu yazımda ise Google tarafından 29 Ekim’de duyurulan reCAPTCHA v3 birlikte inceleyelim.

reCAPTCHA v3 tek seferlik doğrulamanın yeterli olmadığı, istediğimiz zaman çalıştırmamıza rağmen conversion kaybetmeden kullanılabilecek bir versiyon olarak karşımıza çıkıyor. “Bunu nasıl yapabiliriz” dediğinizi duyar gibiyim.
Önce tanıtım videosunu izleyelim

Video’da da bahsedildiği üzere reCAPTCHA v3 bunu kullanıcılarınıza 0.0 ile 1.0 arasında bir puan vererek sağlıyor. 0.0 genellikle bir bot, puan 1.0 yaklaştıkçada iyi bir kullanıcı anlamına geliyor.

Site üzerinde istediğiniz alanlarda reCAPTCHA v3 için gerekli script’leri çalıştırarak kullanıcınız için puanı öğrenip kullanım şeklinize göre aksiyon alabileceksiniz.

Google tarafından örneklenen kullanım senaryoları ise şu şekilde;

Kullanım yeri : Login sayfası
Kullanım tavsiyesi : Eğer giriş yapmaya çalışan kullanıcı düşük bir skora sahip ise Two Factor Authentication yada e-mail doğrulaması isteyebilirsiniz. Böylelikle credential stuffing attacks’dan korunabileceksiniz.

Kullanım yeri : E-Ticaret
Kullanım tavsiyesi : Sitenizde gerçekleştirelen siparişlerde kullanıcının skoruna bakarak spam olup olmadığı konusunda karar verebilmek için fraud kontrolü yapabilirsiniz.

reCAPTCHA v3 detaylıca değindikten sonra şimdi nasıl kullanabileceğimize bakabiliriz.

Öncelikle buradan reCAPTCHA v3 için geçerli key almamız gerekiyor

Sonrasında aşağıdaki kodu çalıştırarak .net core mvc projemizi oluşturabiliriz

Projemiz oluştuktan sonra _Layout.cshtml view içerisinde head tag’i kapatılmadan hemen öncesinde

satırını eklememiz gerekiyor. Bu satırdaki reCAPTCHA_site_key değerini google reCAPTCHA panelinden aldığımız değer ile değiştirmemiz gerekiyor

Sonrasında reCAPTCHA v3 deneyeceğimiz About view’i üzerine aşağıdaki satırları ekliyoruz

Bu kodlarda ki grecaptcha.ready jquery’de kullandığımız $(document).ready() ile aynı mantıkda çalışıyor. reCAPTCHA v3 scripti kullanıma hazır olduğunda tetikleniyor. Sonrasında grecaptcha.execute ile reCAPTCHA v3 ile ilgili action’ı bildiriyoruz.

Bir sayfa içerisinde farklı farklı birden fazla action için reCAPTCHA v3 çalıştırabilirsiniz.

grecaptcha.execute bize doğrulama işlemlerinde kullanmak üzere bir token veriyor. Bu token ile /Home/RecaptchaV3Vverify method’una istek atarak backend üzerinden reCAPTCHA apisi üzerinden kullanıcının skor bilgisini öğreneceğiz.

Yaptığımız isteğin sonucunda google bize döneceği response şu şekilde;

Bu response için kullanacağımız modeli Models klasörü altında TokenResponse olarak oluşturalım

.net Core projesi üzerinden HttpClient ile istek yapacağımız için Startup.cs > ConfigureServices methodu içerisine

satırını eklememiz gerekiyor. Bu değişiklik sonrasında Controller’ımızın Constructor’na IHttpClient geliyor olacak.

Burada tanımladığımız _googleVerifyAddress ve _googleRecaptchaSecret adında iki adet string değişkeni ise HomeController üzerinde Google reCAPTCHA servislerine istek atmak için kullanacağımız RecaptchaV3Vverify methodun’da kullanacağız.

_googleRecaptchaSecret için geçerli key’i reCAPTCHA admin paneli üzerinden Secret key bölümünden alabilirsiniz

Method ile reCAPTCHA doğrulama api istek atıp cevabı direk json olarak geri dönüyoruz.

Bu method üzerinden dönen cevabı ise test etmek açısından console yazıyoruz.

İşte bu kadar demo için reCAPTCHA v3 entegrasyonunu tamamlamış olduk.

Demo amaçlı olduğu için doğrulama kodunu ayrı bir method ile yaptım ama siz bu işlemi ihtiyacınız olan method içerisinde yapıp user için dönen skora göre akışı istediğiniz şekilde yönetebilirsiniz.

Görüşmek üzere!

  1. Merhaba,
    üstat anlatımınız için teşekkkürler günlerdir çözmeye çalıştığım bir konu fakat siz bir profosyonel anlayacak şekilde yazmışsınız. Bu şekilde sitenizden sadece gerekli bilgiye sahip kişiler faydalanabilir. Örnek : wordpress te entegrasyon için hangi php dosyalrının içerisine hangi koddan önce veya sonra google recaptcha v3 entegrasyon kodlarını ekleyeceğiz 🙂 açıklamalı yazarsanız seviniri benim gibi cahilerde sebeplenir diye düşünüyorum teşekürler şimdiden

    1. Merhaba Barış,

      Dönen sonuca göre alabileceğiniz aksiyonların bir sınırı yok aslında. reCAPTCHA v3 ile birlikte asıl amaç kullanıcıların akışını bozmadan sistemi botlardan korunabilmesini sağlamak.

      Aklıma gelen örnekler şu şekilde;

      • E-ticaret sitesinde ürünlere yapılan yorumları bot’lardan korumak için reCAPTCHA v3 puanı baz alınabilir.
      • Yeni üye olan kişilere bir kupon kodu üretilecek ise yine burada reCAPTCHA v3 puanı ile karar verilebilir

      Eğer sormak istediğiniz sipesifik bir sektör/proje var ise iletişim sayfasından yazabilirsiniz 🙂

BARIŞ BAR için bir cevap yazın Cevabı iptal et

E-posta hesabınız yayımlanmayacak. Gerekli alanlar * ile işaretlenmişlerdir

Sonraki:

Jenkins UI Dil Desteği Kazandırmak

Jenkins UI Dil Desteği Kazandırmak