web-dev-qa-db-ja.com

ASP.NETでreCaptcha V3を実装する方法

ASP.NETでreCaptcha V3の完全な実装デモを持っている人はいますか?

この記事を見つけました: Google Recaptcha v3のサンプルデモ

現時点では、次のコードでreCaptcha V2を使用しています。

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

View.ascxページには次のものがあります。

<%@ 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>
6
Tig7r

もっとも単純な:

a)cshtml(上部)

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

b)フォーム内のcshtml(/ form>の直前:

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

c)Pagemodelクラス内の関数:

        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")
                return false;

            return true;
        }

最後に、最初のOnPostAsync内:

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

編集:デモプロジェクトを追加しました。このgithubリポジトリを確認してください。 https://github.com/NIHAR-SARKAR/GoogleRecaptchav3-example-In-asp.net

フロントエンド(.aspxページ)からajaxリクエストを送信して、トークンをバックエンドサーバーに渡す必要があります。 「recaptcha.execute」を使用すると、Uが応答を取得し、ajax要求を使用してトークンを渡すことができます。コードブロックを確認してください。

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

参照リンク: https://developers.google.com/recaptcha/docs/verifyhttps://developers.google.com/recaptcha/docs/display#js_api

Aspx.csで、「[WebMethod]」を記述して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);

    }
_

Google recapcha APIから応答を取得するには、httpClientを使用して非同期呼び出しを使用する必要があります。また、応答文字列のような同じプロパティを含むクラスを作成する必要があります。 「responseString」を取得したら、Newtonsoft.Jsonを使用して応答をResponseTokenオブジェクトに変換する必要があります。 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; }
        }
_
8
Nihar Sarkar