CAPTCHA tag (for forms)

Using the captcha module you can easily secure forms with an (image-)CAPTCHA. The tag shipped along with the module fully integrates with existing form elements.

Using the module you only have to configure a Front controller action that delivers the CAPTCHA image and integrate the <form:captcha /> tag into the desired form using <form:addtaglib />.

Besides this module an alternative implementation is available to protect forms. Details can be read about under ReCaptcha. It supports Google's CAPTCHA concept and both protects your pages from being requested by bots and helps to improve the OCR software used to digitize books.

1. Configuration of the front controller action

CAPTCHA image delivery is done via a Front controller action realisiert. Each action is described by a separate configuration. You may want to use /config/modules/captcha/biz/actions/EXAMPLE_actionconfig.ini from the apf-configpack-* release as a template.

The front controller expects the configuration file under

Code
/APF/config/modules/captcha/biz/{CONTEXT}/{ENVIRONMENT}_actionconfig.ini

where {CONTEXT} and {ENVIRONMENT} have to be replaced by values according to your project. Details on the definition of configurations within the APF can be taken from Configuration.

2. Inclusion of the tag

Using the tag it must be added prior to use within the desired form. This can be done with the <form:addtaglib /> tag. Afterwards, the tag is known within the current form and can be used with the prefix and name it has been registered. with. The following code box contains a use case that contains the main configuration attributes of the tag:

APF template
<html:form name="MyForm" action="post"> ... <form:addtaglib class="APF\modules\captcha\pres\taglib\SimpleCaptchaTag" prefix="form" name="captcha" /> <form:captcha name="captcha" /> <form:addvalidator class="APF\modules\captcha\pres\validator\CaptchaValidator" control="captcha" button="send" /> ... <form:button name="send" /> </html:form>
Please note to apply a validator to the CAPTCHA field. For this reason, you can use the CaptchaValidator shipped with the APF. To add another portion of input security you may want to add a form filter. Therefore, you can use the APF\modules\captcha\pres\filter\CaptchaFilter class:
APF template
<html:form name="MeinFormular" action="post"> ... <form:addtaglib class="APF\modules\captcha\pres\taglib\SimpleCaptchaTag" prefix="form" name="captcha" /> <form:captcha name="captcha" /> <form:addvalidator class="APF\modules\captcha\pres\validator\CaptchaValidator" control="captcha" button="send" /> <form:addfilter class="APF\modules\captcha\pres\filter\CaptchaFilter" control="captcha" button="send" /> ... <form:button name="send" /> </html:form>

As output of the tag an image tag is generated besides a text field to enter the result of the test. The following list provides an overview of the available attributes as well as their meaning and usage:

  • image_style: CSS styles of the captcha image
  • image_class: CSS classes of the captcha image
  • image_id: HTML ID of the captcha image
  • text_style: CSS styles of the text field
  • text_class: CSS classes of the text field
  • text_id: HTML-ID of the text field
  • validate: Activation of the validation
  • button: Name of the button of the form
  • clearonerror: This optional attribute indicates, that the content of the field is cleared on wrong user input. If the field contains an other value than "true" or is not present, the field is prefilled as usual.
  • clearonformerror: This optional attribute indicates, that the content of the field is be cleared in case the form contains any validation error. If the field contains an other value than "true" or is not present, the field is pre-filled as usual.
  • disable_inline: If this optional attribute is set to true the inline CSS styles are disabled. In case the attribute contains another value or is not present, styles are applied, that make the CAPTCHA image and the text field being displayed within one line.

3. Functionality of the tag

By means of directly integrating the captcha tag into a form, the tag can influence the form's validation. If the captcha string was correctly filled in the text field provided, the form's state is set to valid. If not, the tag lib implementation marks the form as invalid and the user cannot finally submit the form. To ensure, that the form cannot be sent on wrong captcha string input, the form must be checked having the isSent() and isValid() event in the corresponding controller.

For security reasons, the captcha image is regenerated with each request.

Comments

Do you want to add a comment to the article above, or do you want to post additional hints? So please click here. Comments already posted can be found below.
There are no comments belonging to this article.