Devot:ee 2012 AcademEE Awards Extension of the Year

Snaptcha (Simple Non-obtrusive Automated Public Turing test to tell Computers and Humans Apart) is an invisible captcha and will be the last time you will ever have to think about protecting your forms from spam bots.

Snaptcha will automatically add a hidden field to your forms and will validate it on submission. If it determines that a spambot is attempting to submit the form then it will prevent the form from being submitted and will output an error message. You can control the level of security as well as the error message text.

Reviews

In-depth reviews: 

Snaptcha was chosen as Editor's Pick in October 2013 by devot-ee.

Read more reviews on devot-ee.

Requirements

Snaptcha works with ExpressionEngine version 2.10.0 or above, 3.1.0 or above, and 4.0.0 and above.

For ExpressionEngine 2 and 3, you must download and use the legacy version of the add-on from the main add-on page on devot-ee.

Installation

Download and unzip Snaptcha, then follow the simple steps below:

  1. Upload the snaptcha folder to your add-on directory
  2. Enable the Snaptcha add-on
  3. Open the Snaptcha add-on settings and enter your license number
  4. Disable CAPTCHA if it is enabled in your channel's preferences

That's all you need to do for Snaptcha to work on your forms. There are some more advanced configuration options that you can read about below.

Updating

Download and unzip the latest version of Snaptcha, then follow the steps below:

  1. Overwrite the snaptcha folder in your add-on directory
  2. Open the Snaptcha add-on settings and modify any newly available features

Security Levels

Snaptcha offers three levels of security:

  • High - requires javascript (blocking most spam bots) and only allows a form to be submitted once (preventing multiple unwanted form submissions)
  • Medium - requires javascript (blocking most spam bots) and allows multiple form submissions
  • Low - does not require javascript (relies on spam bots filling in all input fields)

We recommend using the high security level where possible and modifying the error message to suit your chosen security level and users. Please note that if using the high security level you should not use template caching on templates that will use Snaptcha.

Comparison with Honeypot

The Honeypot captcha method is similar to Snaptcha's low security level. It simply adds a hidden input field to the form and "hopes" that spam bots will enter a value into it, thereby giving them away as bots. Snaptcha's medium and high security levels are far more secure than Honeypot, requiring javascript and the latter only allowing single form submissions. This means that the vast majority of spam bots will be blocked.

Settings

Security Level
Select from the security levels described above

Field Name Prefix
The prefix for the hidden snaptcha field (should be a unique value, a random suffix will be used)

Member Registration Validation
Whether to enable validation of member registration forms (see below for details)

Rejected Form Submission Logging
Whether to enable logging of rejected form submissions (see below for details)

Error Message
The message to display if the user is believed to be a spam bot

Template Tags

You can use the following template tag to manually create a Snaptcha field (not required for supported add-ons):

{exp:snaptcha:field}

Creates a Snaptcha field with the security level in the extension settings

{exp:snaptcha:field security_level="1"}

Creates a Snaptcha field with the security level specified (1=low, 2=medium, 3=high)

Using Snaptcha

Snaptcha will automatically add a hidden field to your forms and will validate it on submission. If it determines that a spam bot is attempting to submit the form then it will prevent the form from being submitted and will output the error message.

The following forms are supported:

  • Comment form
  • Safecracker form
  • Channel form (since EE 2.7)
  • Forum submission form
  • Freeform form
  • Zoo Visitor registration form
  • ProForm form
  • DevDemon Forms
  • Member registration form [\[1\]]
  • User Module registration form [\[2\]]
  • FreeMember registration form [\[2\]]
  • Threaded Comments form
  • Google Custom Search form
  • Email Form add-on
  • Solspace Rating form
  • IntoEEtive Stand-Alone Member Register form [\[2\]]
  • Email Module [\[3\]]

[1] If you set Member Registration Validation to "Enabled" and you are using EE's native Member Profile Templates then you must manually append the html code provided to the registration form as the member module does not have a hook that would allow Snaptcha to do this automatically. This method will only work with the medium and low security levels. By default this is found by going to Design > Themes > Member Profile Templates > Default > Registration Form.

[2] If you set Member Registration Validation to "Enabled" and you are using regular templates to generate your registration form then you must manually append a template tag to the form. Add the template tag {exp:snaptcha:field} to the bottom of the registration form when using the User Module, FreeMember or IntoEEtive's Stand-Alone Member Register.

[3] The native Email Module does not have the necessary extension hooks for Snaptcha to support it, however Snaptcha 1.7.1 introduced the methods for making it work. To add support for the Email Module forms you will need to manually add the following blocks of code to mod.email.php in the module's folder:

private function _setup_form($tagdata, $recipients,...)
{

/* -------------------------------------
/*  Add this code block to the very beginning of the _setup_form method
/*  'email_module_form_end' hook
*/
	if (ee()->extensions->active_hook('email_module_form_end') === TRUE)
	{
		$tagdata = ee()->extensions->call('email_module_form_end', $tagdata);
		if (ee()->extensions->end_script === TRUE) return;
	}
/*
/* -------------------------------------*/;

/* -------------------------------------
/*  Add this code block before loading the email library in the send_email method
/*  'email_module_send_email_start' hook
*/
	if (ee()->extensions->active_hook('email_module_send_email_start') === TRUE)
	{
		ee()->extensions->call('email_module_send_email_start');
		if (ee()->extensions->end_script === TRUE) return;
	}
/*
/* -------------------------------------*/

// Send email
ee()->load->library('email');

If you have a situation where you are using the Snaptcha field multiple times in the same template then you should give each tag a unique identifier.

{exp:snaptcha:field id="1"}

{exp:snaptcha:field id="2"}

{exp:snaptcha:field id="3"}

AJAX Forms

If your forms use AJAX to submit data then you must ensure that the Snaptcha field and its corresponding value is submitted as well.

Logging

If you set Rejected Form Submission Logging to "Enabled" then any rejected submissions will be logged to the log.txt file in the Snaptcha folder. The file must be writable so ensure that the permissions are set to at least 666.

Testing Snaptcha

If you want to test or see how Snaptcha works on your site then navigate to one of your forms, open your browser's inspector or use Firebug and delete the input field that Snaptcha inserted. It will usually be towards the bottom of your form's markup and will have an id that begins with the prefix in your extension settings ("snap" by default). After deleting the input field, submit the form and the error message from your extension settings should appear. 

Developers

You can integrate Snaptcha validation into your code and add-ons easily. Use the template tag above or the following code to create a Snaptcha field:

require_once PATH_THIRD.'snaptcha/ext.snaptcha'.EXT;
$Snaptcha = new Snaptcha_ext();
$field = $Snaptcha->snaptcha_field();

You can optionally set the security level to be used:

$security_level = 1;   // 1=low, 2=medium, 3=high
$field = $Snaptcha->snaptcha_field($security_level);

Then use the following code to validate a form submission:

require_once PATH_THIRD.'snaptcha/ext.snaptcha'.EXT;
$Snaptcha = new Snaptcha_ext();
$validated = $Snaptcha->snaptcha_validate();   // returns a boolean (true or false)

If you explicitly set the security level in the Snaptcha field then you should set it to the same value in the validate function:

$security_level = 1;	// 1=low, 2=medium, 3=high
$validated = $Snaptcha->snaptcha_validate($security_level);

FAQ

Do I need to add anything to my forms to make Snaptcha work?
No, all you need to do is enable the Snaptcha extension. The hidden field will automatically be added to your form and the validation done when the form is submitted. The exceptions to this are member registration forms and the native email module.

How can I test to see if Snaptcha is working?
To see Snaptcha working on your site, navigate to one of your forms, open your browser's inspector or use Firebug and delete the input field that Snaptcha inserted. It will usually be towards the bottom of your form's markup and will have an id that begins with the prefix in your extension settings ("snap" by default). After deleting the input field, submit the form and the error message from your extension settings should appear.

Why does form submission fail with DevDemon Forms?
When building your form with ​DevDemon Forms, ensure that you have enabled Snaptcha support under Form Settings > Security.

Does Snaptcha work with modal windows?
Snaptcha works with the majority of modal windows however you may run into issues with those that duplictae or modify the mark-up. Snaptcha is known to work with the jQuery UI Dialog and FancyBox. It does not work with Colorbox.

Does Snaptcha work with Modernizr?
While Snaptcha does work with Modernizr, issues have been reported when a website uses Modernizr combined with some front-end frameworks. Setting Snaptcha's security level to "low" should resolve this issue, however please report this to us so we can investigate further.

Changelog

Version 2.0.3
  • Fixed Javascript error in forum script when user not logged in
Version 2.0.2
  • Made compatible with PHP 7.0.0
Version 2.0.1
  • Fixed bug in installation process
Version 2.0.0
  • Made compatible with ExpressionEngine 3
End of feature development for EE2 version
Version 1.7.6
  • Added compatibility with Expresso Store when registering members after checkout
Version 1.7.5
  • Added _extensions->last_call_ to maintain values returned by previously called extension hooks
Version 1.7.4
  • Fixed static usage method in plugin
Version 1.7.3
  • Fixed channel form (safecracker) deprecation errors
Version 1.7.2
  • Made the embed code that is displayed for the member registration form update dynamically when security level is changed
Version 1.7.1
  • Added Email Module methods for supporting future hooks
  • Improved how the input field is hidden
Version 1.7
  • Added support for Solspace Rating
  • Added field name class to Snaptcha div
  • Improved log messages
  • Improved code efficiency
Version 1.6.8
  • Fixed bug with Email Form template variables
Version 1.6.7
  • Added support for Email Form
Version 1.6.6
  • Fixed window.onload conflict with javascript libraries
Version 1.6.5
  • Added stability measures
  • Fixed bug that caused a horizontal scrollbar to appear with RTL
Version 1.6.4
  • Fixed bug with Freeform validation
  • Added compatibility for member registration validation in EE versions earlier than 2.5.0
Version 1.6.3
  • Fixed bug when editing forms in the CP with Freeform 4
Version 1.6.2
  • Fixed bug with settings not being retrieved
  • Added trim() to license number validation
Version 1.6.1
  • Added support for older versions of EE 2.1.x
Version 1.6
  • Added support for ProForm v1.31+
  • Fixed bug with Zoo Visitor
  • Updated member module hook
  • Added descriptive messages to logging
Version 1.5.2
  • Important bugfixes
Version 1.5.1
  • Added support for FreeMember
  • General bugfixes
Version 1.5
  • Added template tag for Snaptcha field
  • Added ability for developers to integrate Snaptcha validation into code and add-ons
  • Increased security

Notes on upgrading to version 1.5:
If you are using Snaptcha to validate your User Module, Zoo Visitor and FreeMember member registration forms then you must replace the Snaptcha html code with the template tag {ext:snaptcha:field}. This will also allow for a "high" security setting on these forms.

Version 1.4.1
  • Bugfix with Safecracker submission
Version 1.4
  • Added support for User Module
  • Added support for Zoo Visitor
Version 1.3.1
  • Changed expiry time of table rows to 1 hour
  • Minor bugfixes
Version 1.3
  • Added optional logging of rejected form submissions [set file permissions of log.txt to 777]
Version 1.2.1
  • Fixed bug in new forum topic form
Version 1.2
  • Added support for Forum Submission forms
  • Fixed bug with low security level validation
Version 1.1
  • Added support for Member Registration forms
  • Fixed bug in add-on config
Version 1.0
  • Initial release

Support

Get support by creating a new issue here.