how to trigger reCaptcha with the submit button

4,456 views
Skip to first unread message

David Allen

unread,
Mar 25, 2013, 2:51:37 PM3/25/13
to reca...@googlegroups.com
How to trigger reCaptcha with the submit button?

The code is simple, with the reCaptcha code and the submit button in side-by-side cells of a one-row table (here the key has been replaced with a placeholder]:

  </table>
  <table width="567" border="0" align="center" cellpadding="0" cellspacing="0">
    <tr align="left" valign="middle"">
      <td>
        <script type="text/javascript"
  </script>
        <noscript id="recaptcha_area">
        height="300" width="500" frameborder="0"></iframe>
          
          <textarea name="recaptcha_challenge_field" rows="3" cols="40">
    </textarea>
          <input type="hidden" name="recaptcha_response_field"
        value="manual_challenge">
          </noscript>

</td>
<td><input type="submit" name="button" id="button" value="Submit" /></td>
      </tr>
  </table>

FYI, CSS added, but not likely relevant:
#recaptcha_area #recaptcha_response_field {
    position: static !important;
}

What is the means to trigger the reCaptcha machinery, when the submit button is clicked?  FormMail, properly configured for reCaptcha according to the instructions, is the 'action' in the form, a bit above this code.  FormMail does successfully capture input and send email.

Yes, an additional issue is - in the case of failed entry into reCaptcha - re-population of the page, for another try.

Thanks in advance for your help,  David Allen

Clon Takos

unread,
Apr 1, 2013, 10:31:43 AM4/1/13
to reca...@googlegroups.com
I think what you want is this https://developers.google.com/recaptcha/docs/verify how to verify the response with Javascript

David Allen

unread,
Apr 4, 2013, 11:09:35 PM4/4/13
to reca...@googlegroups.com
Thanks so much, Clon.  I do appreciate it.

You led me to re-check my copying of the reCaptcha Perl code into FormMail.  Lo and behold, I had not copied in one & ... of course, it would not work without that.

Now, the setup does invoke reCaptcha, as it should.

With a following problem, however.  reCaptcha does block, if its text is not filled appropriately.  However, in that event, the reCaptcha script inserted into FormMail also fails to put up its error notice (instead there is a generic 'serve error' message, seen when the script earlier would fail generally).  This is an HTML error notice, where I followed instructions and put into the Perl code in FormMail, for reCaptcha - see code below.

Hopefully, some one here can say why this is failing.  Below, I paste the relevant script, from the Perl that is inserted into FormMail.  Though I have an inkling the problem lies with how the script interacts with the page.

     elsif ($error eq 'captcha_failed') {
             print <<"(END ERROR HTML)";
Content-type: text/html
 
<html>
 <head>
  <title>Error: Captcha Check Failed</title>
 </head>
 <body bgcolor=#FFFFFF text=#000000>
 <center>
  <table border=0 width=600 bgcolor=#9C9C9C>
    <tr><th><font size=2>Error: Captcha Check Failed</font></th></tr%gt;
   </table>
  <table border=0 width=600 bgcolor=#CFCFCF>
    <tr><td>The Captcha response of the form you submitted did not match the challenge.
     Please check the form and make sure that your response matches the challenge in the captcha image.
     You can use the browser back button to return to the form.
     </center%gt;
    </td></tr>
   </table>
  </center>
 </body>
</html>
(END ERROR HTML)

Again, thanks, David
Reply all
Reply to author
Forward
0 new messages