Merge pull request #6 from maliming/dev

Support reCAPTCHA v3 programmatically.

Author: maliming

README.md

@@ -39,6 +39,28 @@ services.AddreCAPTCHAV3(x =>
 <recaptcha-script-v3-js action="login" callback="callback" />
 ```
 
+```
+@addTagHelper *, Owl.reCAPTCHA
+
+<form method="POST" id="recaptchaForm">
+    <input id="token" name="token" type="text" />
+    <input id="submitBtn" type="submit" value="submit" />
+</form>
+
+<script>
+    document.getElementById("submitBtn").onclick = function(e) {
+        e.preventDefault();
+        grecaptcha.reExecute(function(token) {
+            document.getElementById("token").value = token;
+            document.getElementById("recaptchaForm").submit();
+        })
+    };
+</script>
+
+<recaptcha-script-v3 />
+<recaptcha-script-v3-js action="login" execute="false" />
+```
+
 ### v3 razor page model
 
 ```
@@ -158,7 +180,7 @@ services.AddreCAPTCHAV2(x =>
 public class V2_CheckboxModel : PageModel
 {
 	private readonly IreCAPTCHASiteVerifyV2 _siteVerify;
-	
+
 	public V2_CheckboxModel(IreCAPTCHASiteVerifyV2 siteVerify)
 	{
 		_siteVerify = siteVerify;
@@ -184,4 +206,4 @@ public class V2_CheckboxModel : PageModel
         */
 	}
 }
-```
+```

demo/reCAPTCHA.Demo/Pages/Index.cshtml

@@ -14,6 +14,11 @@
 </div>
 
 
+<div>
+    <a href="/V3_Programmatically">V3 Programmatically Demo</a>
+</div>
+
+
 <div>
     <a href="/V2_Invisible">V2_Invisible Demo</a>
 </div>

demo/reCAPTCHA.Demo/Pages/V3_Programmatically.cshtml

@@ -0,0 +1,28 @@
+@page
+@using Microsoft.Extensions.Options
+@using Owl.reCAPTCHA
+@model reCAPTCHA.Demo.Pages.V3_ProgrammaticallyModel
+@inject IOptions<reCAPTCHAOptions> Options
+@{
+    ViewData["Title"] = "V3";
+}
+
+<pre>@Model.Result</pre>
+
+<form method="POST" id="recaptchaForm">
+    <input id="token" name="token" type="text" />
+    <input id="submitBtn" type="submit" value="submit" />
+</form>
+
+<script>
+    document.getElementById("submitBtn").onclick = function(e) {
+        e.preventDefault();
+        grecaptcha.reExecute(function(token) {
+            document.getElementById("token").value = token;
+            document.getElementById("recaptchaForm").submit();
+        })
+    };
+</script>
+
+<recaptcha-script-v3 />
+<recaptcha-script-v3-js action="login" execute="false" />

demo/reCAPTCHA.Demo/Pages/V3_Programmatically.cshtml.cs

@@ -0,0 +1,31 @@
+using System.Threading.Tasks;
+using Microsoft.AspNetCore.Mvc.RazorPages;
+using Newtonsoft.Json;
+using Owl.reCAPTCHA;
+using Owl.reCAPTCHA.v3;
+
+namespace reCAPTCHA.Demo.Pages
+{
+    public class V3_ProgrammaticallyModel : PageModel
+    {
+        private readonly IreCAPTCHASiteVerifyV3 _siteVerify;
+
+        public string Result { get; set; }
+
+        public V3_ProgrammaticallyModel(IreCAPTCHASiteVerifyV3 siteVerify)
+        {
+            _siteVerify = siteVerify;
+        }
+
+        public async Task OnPostAsync(string token)
+        {
+            var response = await _siteVerify.Verify(new reCAPTCHASiteVerifyRequest
+            {
+                Response = token,
+                RemoteIp = HttpContext.Connection.RemoteIpAddress.ToString()
+            });
+
+            Result = JsonConvert.SerializeObject(response, Formatting.Indented);
+        }
+    }
+}

demo/reCAPTCHA.Demo/Properties/launchSettings.json

@@ -1,21 +1,6 @@
 {
-  "iisSettings": {
-    "windowsAuthentication": false, 
-    "anonymousAuthentication": true, 
-    "iisExpress": {
-      "applicationUrl": "http://localhost:3558",
-      "sslPort": 44369
-    }
-  },
   "profiles": {
-    "IIS Express": {
-      "commandName": "IISExpress",
-      "launchBrowser": true,
-      "environmentVariables": {
-        "ASPNETCORE_ENVIRONMENT": "Development"
-      }
-    },
-    "reCAPTCHA.Tests": {
+    "reCAPTCHA.Demo": {
       "commandName": "Project",
       "launchBrowser": true,
       "applicationUrl": "https://localhost:5001;http://localhost:5000",

demo/reCAPTCHA.Demo/Startup.cs

@@ -60,4 +60,4 @@ public void Configure(IApplicationBuilder app, IWebHostEnvironment env)
             app.UseEndpoints(endpoints => { endpoints.MapRazorPages(); });
         }
     }
-}
+}

src/Owl.reCAPTCHA/Owl.reCAPTCHA.csproj

@@ -16,6 +16,7 @@
     <GeneratePackageOnBuild>true</GeneratePackageOnBuild>
     <!-- including PDB files in NuGet for source link because symbolsource.org does not support portable PDBs -->
     <AllowedOutputExtensionsInPackageBuildOutputFolder>$(AllowedOutputExtensionsInPackageBuildOutputFolder);.pdb</AllowedOutputExtensionsInPackageBuildOutputFolder>
+    <PackageVersion>0.3.1</PackageVersion>
   </PropertyGroup>
 
   <ItemGroup>

src/Owl.reCAPTCHA/v3/TagHelpers/reCAPTCHAV3ScriptJsTagHelper.cs

@@ -10,38 +10,51 @@ public class reCAPTCHAV3ScriptJsTagHelper : TagHelper
 
         public string Callback { get; set; }
 
+        public bool Execute { get; set; }
+
         private readonly reCAPTCHAOptions _options;
 
         public reCAPTCHAV3ScriptJsTagHelper(IOptionsSnapshot<reCAPTCHAOptions> optionsAccessor)
         {
             _options = optionsAccessor.Get(reCAPTCHAConsts.V3);
+            Execute = true;
         }
 
         public override void Process(TagHelperContext context, TagHelperOutput output)
         {
             /*
-            grecaptcha.ready(function() {
-                grecaptcha.reExecute = function(){
-                    grecaptcha.execute('_reCAPTCHA_site_key_', {action: 'homepage'}).then(function(token) {
-                   ...
-                })();
-                }
+            myCallback is a user-defined method name or `(function(t){alert(t)})` when Execute = true
+            grecaptcha.ready(function () {
+                grecaptcha.reExecute = function () {
+                    grecaptcha.execute('6LccrsMUAAAAANSAh_MCplqdS9AJVPihyzmbPqWa', {
+                        action: 'login'
+                    }).then(function (token) {
+                        myCallback(token)
+                    })
+                };
+                grecaptcha.reExecute()
             });
-            */
 
+            myCallback is a user-defined function when Execute = false
+            grecaptcha.ready(function () {
+                grecaptcha.reExecute = function (callback) {
+                    grecaptcha.execute('6LccrsMUAAAAANSAh_MCplqdS9AJVPihyzmbPqWa', {
+                        action: 'login'
+                    }).then(myCallback)
+                };
+            });
+             */
             output.TagName = "script";
             output.TagMode = TagMode.StartTagAndEndTag;
 
-            var script = "grecaptcha.ready(function(){ " +
-                         "grecaptcha.reExecute = function(){" +
-                             "grecaptcha.execute('" + _options.SiteKey + "'" + (string.IsNullOrWhiteSpace(Action) ? "" : ",{action:'" + Action + "'}") + ")" +
-                                 ".then(function(token){" +
-                                    Callback + "(token)" +
-                                 "})" +
-                            "};" +
-                           "grecaptcha.reExecute()" +
-                         "});";
+            var script =
+                "grecaptcha.ready(function(){ " +
+                     "grecaptcha.reExecute = function(" + (Execute ? "" : "callback") + "){" +
+                        "grecaptcha.execute('" + _options.SiteKey + "'" + (string.IsNullOrWhiteSpace(Action) ? "" : ",{action:'" + Action + "'}") + ")" +
+                            (Execute ? (".then(function(token){" + Callback + "(token)" + "})") : ".then(callback)") + "};" +
+                            (Execute ? "grecaptcha.reExecute()" :"") +
+                "});";
             output.Content.SetHtmlContent(script);
         }
     }
-}
+}