How to implement reCaptcha V3 in ASP.NET

Question

Does anyone have a full implementation demo of reCaptcha V3 in ASP.NET?

I found this article: Google Recaptcha v3 example demo

At the moment I am using reCaptcha V2 with the following code:

public bool RecaptchaValidate()
    {
        string Response = Request.Form["g-recaptcha-response"];//Getting Response String Append to Post Method
        bool Valid = false;
        //Request to Google Server
        var CaptchaSiteKey = Settings["NewUserRegCaptchaSecretSiteKey"].ToString();
        HttpWebRequest req = (HttpWebRequest)WebRequest.Create
        (" https://www.google.com/recaptcha/api/siteverify?secret=" + CaptchaSiteKey + "&response=" + Response);
        try
        {
            //Google recaptcha Response
            using (WebResponse wResponse = req.GetResponse())
            {

                using (StreamReader readStream = new StreamReader(wResponse.GetResponseStream()))
                {
                    string jsonResponse = readStream.ReadToEnd();

                    JavaScriptSerializer js = new JavaScriptSerializer();
                    ReCaptchaObject data = js.Deserialize<ReCaptchaObject>(jsonResponse);// Deserialize Json

                    Valid = Convert.ToBoolean(data.success);
                }
            }

            return Valid;
        }
        catch (WebException ex)
        {
            throw ex;
        }
    }

On the view.ascx page I have:

<%@ Register TagPrefix="recaptcha" Namespace="Recaptcha" Assembly="Recaptcha" %>

<script src='https://www.google.com/recaptcha/api.js'></script>

<scrip>
var recap = grecaptcha.getResponse();
if (recap.length == 0) {
                $("#verifyhuman").css("display", "block");
            }
</script>

 <div class="g-recaptcha" data-sitekey="<%=ReCaptchaPublicKey%>" id="recaptcha" data-callback="recaptchaCallback"></div>

Answer 1

The simplest implementation:

1. In your cshtml file (at the top)

   @section Scripts
   {
       <script src="https://www.google.com/recaptcha/api.js?render=your site key"></script>
       <script>
           grecaptcha.ready(function () {
               grecaptcha.execute('your site key', { action: 'homepage' }).then(function (token) {
                   document.getElementById("foo").value = token;
               });
           });
       </script>
   }
   

2. In your cshtml, inside the form (just before </form>):

   <input type="hidden" id="foo" name="foo" />
   

3. A function inside your Pagemodel class. See the documentation for the response object:

   public static bool ReCaptchaPassed(string gRecaptchaResponse)
   {
       HttpClient httpClient = new HttpClient();
   
       var res = httpClient.GetAsync($"https://www.google.com/recaptcha/api/siteverify?secret=your secret key no quotes&response={gRecaptchaResponse}").Result;
   
       if (res.StatusCode != HttpStatusCode.OK) 
       {
           return false;
       }
       string JSONres = res.Content.ReadAsStringAsync().Result;
       dynamic JSONdata = JObject.Parse(JSONres);
   
       if (JSONdata.success != "true" || JSONdata.score <= 0.5m)
       {
           return false;
       }
   
       return true;
   }
   

4. Finally, inside your OnPostAsync() handler, at the top:

   if (!ModelState.IsValid) 
   {
       return Page();
   }
   else
   {
       if (!ReCaptchaPassed(Request.Form["foo"]))
       {
           ModelState.AddModelError(string.Empty, "You failed the CAPTCHA.");
           return Page();
       }
   }
   

Answer 2

Edit : I have added a demo project . Check this github repository . https://github.com/NIHAR-SARKAR/GoogleRecaptchav3-example-In-asp.net

From frontend (.aspx page) you need to send ajax request to pass the token to backend server . Using "recaptcha.execute" U can get the response , and pass the token using ajax request .Please check the code block .

 <script src="http://www.google.com/recaptcha/api.js?render=recaptchaSiteKey"></script>
<script>
 grecaptcha.ready(function() {
 grecaptcha.execute('recaptchaSiteKey', {action: 'homepage'}).then(function(token) {

            $.ajax({
                //pass the toket to Webmethod using Ajax
            });
          });
     });
</script>

Reference link: https://developers.google.com/recaptcha/docs/verify https://developers.google.com/recaptcha/docs/display#js_api

Now in the aspx.cs you need to write a "[WebMethod]" to receive the token from Ajax request .

    [WebMethod]
    public static void CaptchaVerify(string token)
    {
            var responseString = RecaptchaVerify(token);
            ResponseToken response = new ResponseToken();
            response = Newtonsoft.Json.JsonConvert.DeserializeObject<ResponseToken>(responseString.Result);

    }

To get the response from google recapcha api u need to use async call using httpClient . you also need to create a class which will contain same properties like the response string . After getting the "responseString" u need to convert the response to ResponseToken object by using Newtonsoft.Json. response = Newtonsoft.Json.JsonConvert.DeserializeObject<ResponseToken>(responseString.Result);

private string apiAddress = "https://www.google.com/recaptcha/api/siteverify";

private string recaptchaSecret = googleRecaptchaSecret;

        public async Task<string> RecaptchaVerify(string recaptchaToken)
        {
            string url = $"{apiAddress}?secret={recaptchaSecret}&response={recaptchaToken}";
            using (var httpClient = new HttpClient())
            {
                try
                {

                    string responseString=  httpClient.GetStringAsync(url).Result;
                    return responseString;

                }
                catch (Exception ex)
                {
                    throw new Exception(ex.Message);
                }
            }
        }


        public class ResponseToken
        {

            public DateTime challenge_ts { get; set; }
            public float score { get; set; }
            public List<string> ErrorCodes { get; set; }
            public bool Success { get; set; }
            public string hostname { get; set; }
        }

Answer 3

The accepted answer on this page is totally wrong!!! Google returns a score between 0 and 1 to indicate whether the submission is likely to be a bot or likely to be a human.

The success property returned only means that the recaptcha token was processed correctly.

It is the score property that should be checked, not the success property

These lines are the probelem

if (JSONdata.success != "true")
    return false;

return true;

The actual score to compare will probably be in a variable that can be adjusted if need be. Google recommends starting with 0.5.

So the code should change to something like:

var recaptchaScore = 0.5m; // this could be in appSettings or whereever/however you are storing your constants

if (JSONdata.success != "true" || JSONdata.score <= recaptchaScore)
    return false;

return true;

Of course you will likely want to add logging etc to this answer but this is the bare logic that is required.

Answer 4

The accepted answer isn't following the Google's spec for sending the response and checking the action. Its Http requests will exhaust the number of sockets also. This is my implementation.

Browser

// Could be called from an event or another piece of code.
function FunctionToCall(term) {

    // Google reCaptcha check
    grecaptcha.ready(function() {
        grecaptcha.execute(reCaptchaSiteKey, {action: "search"}).then(function(token) {

            // You can take the response token Google returns, check it server side using
            // the GoogleReCaptcha class and respond with a pass or fail. If a pass, run a block of code client side.
            // { ... block of code ... }
            
            // Or if you want to secure an endpoint that your sending request too. 
            // Send the response token with the request to your endpoint and check the response token server side and respond with a pass or fail.
            // Use the repsonse to show a message or redirect site, etc

        });
    });

}

Server

using Newtonsoft.Json;
using System;
using System.Collections.Generic;
using System.Net;
using System.Net.Http;
using System.Threading.Tasks;

public class GoogleReCaptcha
{
    public class ReCaptchaResponse
    {
        public bool success { get; set; }
        public double score { get; set; }
        public string action { get; set; }
        public DateTime challenge_ts { get; set; }
        public string hostname { get; set; }
        [JsonProperty("error-codes")]
        public List<string> error_codes { get; set; }
    }

    public static async Task<(ReCaptchaResponse Response, bool HasPassed)> ReCaptchaPassed(string secretKey, string gRecaptchaToken, string expected_action)
    {
        try
        {
            // validate 
            if (string.IsNullOrWhiteSpace(secretKey) || string.IsNullOrWhiteSpace(gRecaptchaToken) || string.IsNullOrWhiteSpace(expected_action))
                return (null, false);

            // we use HttpClientFactory to avoid exhausting number of sockets available
            var httpClient = HttpClientFactory.Create();

            var verifyUrl = "https://www.google.com/recaptcha/api/siteverify";
            var parameters = new Dictionary<string, string>
            {
                {"secret", secretKey},
                {"response", gRecaptchaToken}
                //{"remoteip", "ip" } <= this is optional
            };
            using (HttpContent formContent = new FormUrlEncodedContent(parameters))
            {
                using (var response = await httpClient.PostAsync(verifyUrl, formContent).ConfigureAwait(false))
                {
                    // check HTTP response code
                    if (response.StatusCode != HttpStatusCode.OK)
                        return (null, false);

                    // get reCaptcha response
                    string gRecaptchaJsonresult = await response.Content.ReadAsStringAsync().ConfigureAwait(false);
                    if (string.IsNullOrWhiteSpace(gRecaptchaJsonresult))
                        return (null, false);


                    // check reCaptcha response is successful
                    var recaptcha_response = JsonConvert.DeserializeObject<ReCaptchaResponse>(gRecaptchaJsonresult);
                    if (recaptcha_response == null)
                    {
                        //Logging.Log(new Logging.LogItem { Msg = $"Google RecCaptcha response is null" }, DefaultLogValues);
                        return (recaptcha_response, false);
                    }

                    if (!recaptcha_response.success)
                    {
                        var errors = string.Join(",", recaptcha_response.error_codes);
                        //Logging.Log(new Logging.LogItem { Msg = $"Google RecCaptcha error codes:\n{errors}" }, DefaultLogValues);
                        return (recaptcha_response, false);
                    }

                    // check reCaptcha response action
                    if (recaptcha_response.action.ToUpper() != expected_action.ToUpper())
                    {
                        //Logging.Log(new Logging.LogItem { Msg = $"Google RecCaptcha action doesn't match:\nExpected action: {expected_action} Given action: {recaptcha_response.action}" }, DefaultLogValues);
                        return (recaptcha_response, false);
                    }

                    // response score
                    // anything less than 0.5 is a bot
                    if (recaptcha_response.score < 0.5)
                        return (recaptcha_response, false);
                    else
                        return (recaptcha_response, true);
                }
            }
        }
        catch (Exception ex)
        {
            //Logging.Log(ex, DefaultLogValues);

            // default to false
            return (null, false);
        }
    }
}

You would call it like so..

var reCaptchaTask = GoogleReCaptcha.ReCaptchaPassed(Settings.GoogleReCaptcha.secret_key, SearchReq.gRecaptchaToken, "search");

Make sure to put your keys in a settings file and not in the code.

Answer 5

There are several Recaptcha libraries available for ASP.Net. I chose to use reCAPTCHA.AspNetCore because it provides an HtmlHelper.

Please note that this library only supports one ReCatpcha per page, and it doesn't support Recaptcha v3 passive monitoring on non-form pages.