ورود / ثبت نام
0
0

استفاده از RECaptcha گوگل در ASP.NET

689 بازدید
RECaptcha گوگل

RECaptcha گوگل

در این مقاله با ارائه ی یک مثال ساده با هم به سراغ نحوه ی معتبرسازی RECaptcha گوگل نسخه ی ۲.۰ پیش از فرم ثبت و با استفاده از JavaScript و jQuery در ASP.NET خواهیم رفت. RECaptcha گوگل نسخه ی ۲.۰ امکان معتبرسازی درخواست های Captcha را در سمت کاربر با استفاده از توابع Callback می دهد.

RECaptcha گوگل

دریافت کلید سایت RECaptcha گوگل و کلید Secret

برای دریافت کلید سایت RECaptcha گوگل میتوانید به لینک زیر مراجعه کنید :

http://www.google.com/recaptcha/intro/index.html

HTML Markup

کد HTML زیر شامل یک HTML DIV برای نمایش RECaptcha گوگل ، یک RequiredFieldValidator و یک کنترل Button می باشد.

همچنین یک TextBox مخفی به نام txtCaptcha نیز داریم که برای معتبرسازی RECaptcha گوگل استفاده میشود.

<div id="dvCaptcha">
</div>
<asp:TextBox ID="txtCaptcha" runat="server" Style="display: none" />
<asp:RequiredFieldValidator ID = "rfvCaptcha" ErrorMessage="Captcha validation is required." ControlToValidate="txtCaptcha"
    runat="server" ForeColor = "Red" Display = "Dynamic" />
<br />
<br />
<asp:Button ID="btnSubmit" Text="Submit" runat="server" />

فضای نام ها

C#

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

VB.NET

Imports System.Net
Imports System.Web.Services

WebMethod برای تایید هویت RECaptcha

در قسمت Code Behind دو متغیر رشته ای که مقادیر کلید سایت RECaptcha گوگل و کلید مخفی را در خود نگه میدارد نیز داریم.

شما باید مقادیر این دو متغیر را با مقدار های مربوط به هرکدام تنظیم کنید.

همچنین یک WebMethod وجود دارد که پس از آنکه کاربر به درستی به Captcha پاسخ داد ، این WebMethod مقدار درخواستی که به SiteVerify API RECaptcha گوگل به همراه کلید مخفی پاس داده میشود و یک درخواست JSON بازمیگرداند که به سمت Script کاربر برای پردازش بیشتر میرود.

C#

public partial class _Default : System.Web.UI.Page
{
    protected static string ReCaptcha_Key = "<RECaptcha Site Key>";
    protected static string ReCaptcha_Secret = "<RECaptcha Secret Key>";
 
    [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);
    }
}

VB.NET

Partial Class Default
    Inherits System.Web.UI.Page
    Protected Shared ReCaptcha_Key As String = "<RECaptcha Site Key>"
    Protected Shared ReCaptcha_Secret As String = "<RECaptcha Secret Key>"
 
    <WebMethod()> _
    Public Shared Function VerifyCaptcha(response As String) As String
        Dim url As String = "https://www.google.com/recaptcha/api/siteverify?secret=" & ReCaptcha_Secret & "&response=" & response
        Return (New WebClient()).DownloadString(url)
    End Function
End Class

اجرا و معتبرسازی RECaptcha در سمت کاربر

در داخل رویداد OnLoadCallBack مربوط به Google RECaptcha API ، RECaptcha بر روی صفحه با استفاده از تابع Render ، رندر میشود که این تابع ID مربوط به HTML DIV (که Captcha درون آن رندر شده است) ، کلید سایت RECaptcha گوگل و رویداد CallBack را میپذیرد.

رویداد CallBack زمانی که کاربر به یک Captcha به درستی پاسخ دهد فعال میشود. رویداد CallBack درخواست Captcha را میپذیرد.

مقدار درخواست Captcha به WebMethod VerifyCaptcha فرستاده میشود و یک شئ JSON که شامل وضعیت موفقیت آمیز و کد های خطا دار را برمیگرداند.

اگر وضعیت موفقیت آمیز برابر با True بود آنگاه مقدار در TextBox مخفی قرار داده میشود و RequiredFieldValidator پنهان است.

اگر وضعیت موفقیت آمیز برابر با false بود آنگاه RequiredFieldValidator نمایش داده میشود و برای این ایجاد شده است که پیام خطای بازگشتی از Google RECaptcha SiteVerify API را نمایش دهد.

<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>

اجرای Google RECaptcha در ASP.NET

اعتبارسنجی Google RECaptcha پیش از فرم ثبت با استفاده از JavaScript و jQuery در ASP.NET .

پیغام خطای RequiredFieldValidator زمانی که Captcha پاسخی نمیدهد.

اعتبارسنجی Google RECaptcha پیش از فرم ثبت با استفاده از JavaScript و jQuery در ASP.NET .

نمایش پیغام خطای RECaptcha گوگل

RECaptcha گوگل

Google RECaptcha به درستی پاسخ دهد

اعتبارسنجی Google RECaptcha پیش از فرم ثبت با استفاده از JavaScript و jQuery در ASP.NET .

پیغام خطای نمایش داده شده ازGoogle RECaptcha SiteVerify API وضعیت موفقیت آمیزش برابر با false است.

RECaptcha گوگل

موفق باشید!

آیا این مطلب را می پسندید؟
https://www.mspsoft.com/?p=16294
اشتراک گذاری:
واتساپتوییترفیسبوکپینترستلینکدین
داریوش فرخی
داریوش فرخی هستم از سال 92 شروع به یادگیری برنامه نویسی و از سال 93 در بخش برنامه نویسی و تولید محتوای سایت mspsoft.com مشغول هستم. فعالیتم نیز بیشتر در زمینه های برنامه نویسی با سی شارپ و asp.net بوده است. اوقات فراغتم را هم غالبا با تماشای فیلم یا بازی های کامپیوتری پر میکنم .
مطالب بیشتر
برچسب ها:

نظرات

1 نظر در مورد استفاده از RECaptcha گوگل در ASP.NET

دیدگاهتان را بنویسید

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *

  1. بسیار ممنون بابت این کد
    براحتی کار من رو راه انداخت
    خدا خیرتون بده
    قبلا از یه کپچای معمولی استفاده می کردم که تو آخرین بروزرسانی ساست آنتی ویروس سرور dll کد کپچا رو حذف می کرد ولی این کد باعث شد یه کپچای مدرن و با کیفیت اضافه کنم

    لایک