How to create a reCAPTCHA anti-spam web form on your centrally hosted website
Intended for:
Users who want to create a reCAPTCHA anti-spam web form on their centrally hosted website.
Scenario/Use case:
The Central Web Service utilizes reCAPTCHA to prevent misuse of its web submission form. This article provides instructions on how to create a reCAPTCHA anti-spam web form on your centrally hosted website.
Instructions:
Note: Before you can use the Central Web Service's reCAPTCHA scripts, you need to submit a Service Desk General Request to add your website to the list of websites ("referers") that are allowed to use Fermilab's central web CGI scripts. If your website is not on this list, your form will not work.
How to use reCAPTCHA version 1
NOTE: Support for reCAPTCHA version 1 and fnalformmail script (http://www.fnal.gov/cgi-bin/formmail/fnalformmail.pl) ended on Nov. 15, 2016, please see the section below on how to use reCAPTCHA version 2 and a new form-to-email script (http://tools.fnal.gov/cgi-bin/recaptcha2.pl).
reCAPTCHA version 1 requires web users to look at a graphical representation of letters and then type the letters. If you are using the central web services form-to-email script, you can add the CAPTCHA to your form using these instructions. There is only a single line of HTML code you need to add to your web form to show the CAPTCHA picture inside your form.
A sample web form using a CAPTCHA:
When composing a webform, you only need to insert the following line just above the SUBMIT button of the form.
<p><script></script></p>
You may also want to include some instructions telling your users how to use the CAPTCHA form. This is optional, but recommended.
<p><b>Type the two words shown below into the box below: <i>(required)</i></b></p>
<p><script></script></p>
A complete sample would look like this: see attached file HTMLSample3.txt.
Basic Usage
These are the basic directions on how to use the reCAPTCHA interface.
- Click on
icon above to change words if they are too difficult to recognize.
- Toggle between the
icon for audio and the
icon for text.
- Click on the
icon above for more information.
How to use reCAPTCHA version 2
The Central Web Service has rolled out a new version of reCAPTCHA (reCAPTCHA version 2). This new reCAPTCHA allows for faster user experiences: In most cases, users don't need to enter numbers or letters read from distorted text. For more information, see https://www.google.com/recaptcha/intro/index.html.
To use reCAPTCHA version 2, web form authors will need to update their HTML code that currently invokes fnalformmail. The following shows a sample web form that uses reCAPTCHA version 2.
The HTML code for the above form is shown below.
See attached file HTMLSample2.txt
To create the same form in a WordPress site, select the "text" tab above the edit window in WordPress and insert the following code:
See attached file HTMLSample1.txt
Addendum: Working with pages secured with https
If the webform page is secured with https, change the form method="POST" action line like this:
<form method="POST" action="https://tools.fnal.gov/cgi-bin/recaptcha2.pl" >
The reason for this is referer header is not sent by browsers if an unsecured HTTP request is used and the referring page was received with a secure protocol (HTTPS).
FNALFORMMAIL and Recaptcha V2 are derived from Matt Wright's FORMMAIL, for more information see http://www.scriptarchive.com/readme/formmail.html
See Also: