Ana içeriğe atla

Google reCAPTCHA ile Giriş Yapmak Asp.Net


"reCAPTCHA" Google nin ürettiği güzel bir kullanıcı ayıklama yazılımı. Bu yazılım sayesinde sitenize giriş yapan kullanıcıların "robot" mu "insan" mı ayrımını rahatlıkla yapabilecek ve spamların önüne geçmiş olacaksınız.
Öncelikle "reCAPTCHA"" kodumuzu Googleden nasıl alıcaz onu işleyelim.

1. Olarak Google reCAPTCHA  adresine gidelim.



2. Olarak aşağıda görünen kızma tıklayıp diğer aşamaya geçelim.

3. Olarak Google hesabınız varsa giriş yapı yoksa yeni hesap açmanız şart :)
4. Olarak "reCAPTCHA" kullanacağınız sitenizi kaydedin.

Label: Eklediğiniz siteleri hatırlamak için bir etiket 
Domains: Kullanacağınız site adresleri, her satıra bir site girebilirsiniz. (Ben her site için yeni bir kayıt oluştururum) 
Send alerts to owners: Bu seçeneği işaretleyin ki herhangi bir durum olursa size geribildirim gelsin. (bildirimler giriş yaptığınız Google hesabına gönderilir.) 
 Gerekli bilgileri girdikten sonra Register butonuna tıklayarak kaydı bitirin. Kayıt işlemi tamamladıktan sonra kaydettiğiniz siteye tıklayın. Karşınıza şöyle bir ekran çıkacak.

5. Olarak bu sayfayı bi kenara kaydedelim veya açık tutalım bize lazım olacak.

Şimdi bunu sayfamıza nasıl ekleyeceğiz onu görelim.
1. Olarak sayfamızda "reCAPTCHA" nerede görünecekse oraya aşağıdaki kodu yazıyoruz.
<div id="dvCaptcha">
</div>
<asp:TextBox ID="txtCaptcha" runat="server" Style="display: none" />
<asp:RequiredFieldValidator ID = "rfvCaptcha" ErrorMessage="İşaretleme yapmadınız." ControlToValidate="txtCaptcha"
    runat="server" ForeColor = "Red" Display = "Dynamic" />
<br />
<br />
<asp:Button ID="btnSubmit" Text="Giriş runat="server" />

2. Olarak kod kısmına aşağıdaki sınıfları ve kodları ekliyoruz 

using System.Net;
using System.Web.Services;

public partial class _Default : System.Web.UI.Page
{
    protected static string ReCaptcha_Key = "<Bizim sitemize verilen site key ini yazıyoruz>";
    protected static string ReCaptcha_Secret = "<Bizim sitemize verilen Secret Key i yazıyoruz>";
    [WebMethod]
    public static string VerifyCaptcha(string response)
    {
        string url = "https://www.google.com/recaptcha/api/siteverify?secret=" + ReCaptcha_Secret + "&response=" + response;
        return (new WebClient()).DownloadString(url);
    }
}


3. Olarak HTML kısmında aşağıdaki kodları ekliyoruz.
Not: "Default.aspx" yazan kısma hazırladığınız giriş sayfasını yazıyoruz. İlk giriş burası önemli. 
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script type="text/javascript" src="https://www.google.com/recaptcha/api.js?onload=onloadCallback&render=explicit"
async defer></script>
<script type="text/javascript">
var onloadCallback = function () {
    grecaptcha.render('dvCaptcha', {
        'sitekey''<%=ReCaptcha_Key %>',
        'callback'function (response) {
            $.ajax({
                type: "POST",
                url: "Default.aspx/VerifyCaptcha",
                data: "{response: '" + response + "'}",
                contentType: "application/json; charset=utf-8",
                dataType: "json",
                success: function (r) {
                    var captchaResponse = jQuery.parseJSON(r.d);
                    if (captchaResponse.success) {
                        $("[id*=txtCaptcha]").val(captchaResponse.success);
                        $("[id*=rfvCaptcha]").hide();
                    } else {
                        $("[id*=txtCaptcha]").val("");
                        $("[id*=rfvCaptcha]").show();
                        var error = captchaResponse["error-codes"][0];
                        $("[id*=rfvCaptcha]").html("RECaptcha error. " + error);
                    }
                }
            });
        }
    });
};
</script>

ve olay bukadar hadi hayırlı olsun :)








Yorumlar

Bu blogdaki popüler yayınlar

Asp.Net ile Uyarı Mesajları Vermek (msgbox)

Asp.Net ile T.C. Kimlik Doğrulama (Mernis) Web Service ile

Asp.Net Eval Kullanımı