From 375a47ba249e46dd3d653dd8ce7ccb971ab64860 Mon Sep 17 00:00:00 2001
From: Stewart Sims <stewart@ssims.co.uk>
Date: Wed, 11 Oct 2023 10:36:58 +0100
Subject: [PATCH 1/2] Request reCAPTCHA token from api only when user submits
 form, avoiding token timeout

---
 README.md           | 13 +++++++++++
 src/RecaptchaV3.php | 54 +++++++++++++++++++++++++++++++--------------
 2 files changed, 51 insertions(+), 16 deletions(-)

diff --git a/README.md b/README.md
index 3f25eac..0bc3dfa 100755
--- a/README.md
+++ b/README.md
@@ -53,6 +53,19 @@ Recaptcha v3 works best when it is loaded on every page to get the most context
 
 ```
 
+Please note if the user is on the page for too long, when they submit the form, there will be a timeout and the reCAPTCHA will not validate.
+
+To get around this please use the following code:
+```
+<form id="my-form" method="post" action="/register">
+	{!! RecaptchaV3::field('register') !!}
+    {!! RecaptchaV3::field('register', 'g-recaptcha-response', true, 'my-form') !!}
+    <input type="submit" value="Register"></input>
+</form>
+```
+
+In this case the request to get the reCAPTCHA token will be made when the user submits the form, avoiding the timeout.
+
 #### Validation
 
 Add the `recaptchav3` validator to the rules array. The rule accepts two parameters: The `action` name and the minimum required `score` (defaults to 0.5).
diff --git a/src/RecaptchaV3.php b/src/RecaptchaV3.php
index 7a27def..7d0e594 100644
--- a/src/RecaptchaV3.php
+++ b/src/RecaptchaV3.php
@@ -111,22 +111,44 @@ public function initJs()
     }
 
 
-    /**
-     * @param $action
-     */
-    public function field($action, $name = 'g-recaptcha-response')
-    {
-        $fieldId = uniqid($name . '-', false);
-        $html = '<input type="hidden" name="' . $name . '" id="' . $fieldId . '">';
-        $html .= "<script>
-  grecaptcha.ready(function() {
-      grecaptcha.execute('" . $this->sitekey . "', {action: '" . $action . "'}).then(function(token) {
-         document.getElementById('" . $fieldId . "').value = token;
-      });
-  });
-  </script>";
-        return $html;
-    }
+	/**
+	* Create the field for recaptcha response, if the $requestOnSubmit is false the token is requested on the page
+	* load can cause error if the user take more than 2 minutes to submit the form because the token
+	* have a 2minutes timeout, the other option its a better approach
+	* @param $action
+	* @param $name
+	* @param $requestOnSubmit boolean if true the script will only call the api on form submit
+	* @param $formId the form id is required if the $requestOnSubmit is true
+	* @param $functionName for default the value is onClickRecaptcha and the onclick="onClickRecaptcha(event)" shoud be added on submit button
+	* @return string
+	*/
+	public function field($action, $name = 'g-recaptcha-response', $requestOnSubmit=false, $formId=null, $functionName="onClickRecaptcha")
+	{
+		$fieldId = uniqid($name . '-', false);
+		$html = '<input type="hidden" name="' . $name . '" id="' . $fieldId . '">';
+		if ($requestOnSubmit == false){
+			$html .= "<script>
+			  grecaptcha.ready(function() {
+				  grecaptcha.execute('" . $this->sitekey . "', {action: '" . $action . "'}).then(function(token) {
+					 document.getElementById('" . $fieldId . "').value = token;
+				  });
+			  });
+			  </script>";
+		}else{
+			$html .= "<script>
+			function " . $functionName . "(e) {
+				e.preventDefault();
+				grecaptcha.ready(function() {
+				  grecaptcha.execute('" . $this->sitekey . "', {action: '" . $action . "'}).then(function(token) {
+					 document.getElementById('" . $fieldId . "').value = token;
+					 document.getElementById('" . $formId . "').submit();
+				  });
+				});
+			}
+		</script>";
+		}
+		return $html;
+	}
 
 
 }

From 1d4c6c954bf9b6961bc60def7ce9a0dfed5857b3 Mon Sep 17 00:00:00 2001
From: Stewart Sims <stewart@ssims.co.uk>
Date: Wed, 11 Oct 2023 10:38:37 +0100
Subject: [PATCH 2/2] Update README.md

---
 README.md | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/README.md b/README.md
index 0bc3dfa..606cb5d 100755
--- a/README.md
+++ b/README.md
@@ -58,7 +58,7 @@ Please note if the user is on the page for too long, when they submit the form,
 To get around this please use the following code:
 ```
 <form id="my-form" method="post" action="/register">
-	{!! RecaptchaV3::field('register') !!}
+    {!! RecaptchaV3::field('register') !!}
     {!! RecaptchaV3::field('register', 'g-recaptcha-response', true, 'my-form') !!}
     <input type="submit" value="Register"></input>
 </form>