I am using Google reCaptcha v3. i am trying to implement it onto my aspx page.When i first load my page i can get a token back. However when i click on a button to process my page it comes back with a "No reCaptcha clients exits". I did do a google search for this and nothing has came up to solve my issue. How can i verify a human or bot interaction?
this is what i have on my aspx page:
<div id="RegistrationForm">
<input type="text" id="FirstName" runat="server" value="" valtype="required" maxlength="150" />
<input type="text" id="LastName" runat="server" value="" valtype="required" maxlength="150" />
<input runat="server" id="Email" type="text" value="" valtype="required;regex:email" maxlength="350"/>
<input type="hidden" id="g-recaptcha-response" name="g-recaptcha-response"/> <br />
<div class="g-recaptcha" data-sitekey="SiteKey" data-callback="submit"></div>
<input id="btnProcessOrder" type="button" name="ProcessOrder" onclick="confirmed = false;capt();" value="Save" />
</div>
this is What i tried
<script src="https://www.google.com/recaptcha/api.js?render=SiteKey"></script>
<script type="text/javascript">
//so when i load the page it gets my token and i can assign the value to g-recaptcha-response
grecaptcha.ready(function() {
grecaptcha.execute('SiteKey', { action: 'homepage' }).then(function (token) {
console.log(token);
document.getElementById('g-recaptcha-response').value = token;
});
});
Then when i try to verify the response as follows i get the error or it just does nothing:
function capt() {
var response = grecaptcha.getResponse();
$.ajax({
type: "POST",
url: 'https://www.google.com/recaptcha/api/siteverify',
data: {"secret" : "SecretKey", "response" : response, "remoteip":"localhost"},
contentType: 'application/x-www-form-urlencoded',
success: function(data) { console.log(data); }
});// i call this function on my button
}
</script>
Most of the code i found is for php and i can not use that.How do i get this to work correctly?. Your response is highly appreciated
According to the above comments:
You create a render function as following
grecaptcha.render('example3', {
'sitekey' : 'your_site_key',
'callback' : verifyCallback,
});
Then to get the response from the captcha you create a variable which will store the data as such:
var verifyCallBack = function(response) {
console.log(response);
};