How I use captcha without making my users complete the barely readable word
Capthca sucks. For more information on how much captcha can suck see John Willis’ post Top 10 Worst Captchas.
But at the same time it can be really annoying for webmasters to have their forms unprotected with all the spam bots running free out there.
What I wanted was to have the commenting feature protected against spam bots without having the innocent human users ruining their eyes on captcha like images, or complete any mathematical equation or any other additional question fields.
One very important difference between a spam bot and a human using a web browser is that the first can’t run JavaScript code. However, this isn’t a perfect criteria of selection, because there are humans browsing the web using browsers without JavaScript support (Opera Mini for mobile devices for example).
My ideea (and as I did some Google searches, I found out other people had similar ideas) was the followig algorithm:
Does the user have JavaScript enabled?
If yes, he’s ok. Let him comment.
No? He’s a suspect. Read him his rights and give him the ultimate “are you human?” test.
To do this I left the captcha system enabled and in place and wrote 2 extra lines of JavaScript that:
//complete the text field with the correct word from the image:
$('secretword').value='nospam';
//hide the div containing the captcha image and the text field:
$('captcha').style.display='none';
That’s mootools JavaScript, the $ sign stands for document.getElementById(), ‘secretword’ is the id of the text field where the secret word from the image should be completed and ‘captcha’ is the id of the div containing the captcha image and text field.
So… if the user doesn’t have JavaScript, he gets the normal captcha, if he does, the captcha is solved by the first line of JavaScript and its existence is hidden by the second.
To make my life a lot easier I made my captcha output only one word, nospam, so I didn’t have to get the secret word from the server each time.
I was able to get away with this because I doubt anyone is going to make a special spam bot for VileWorks.com so their stupid spam bot brain will never know that the “secret word” is nospam. The same word, over and over again.
If anyone would go through the trouble of adapting their spam bot to my script, I would simply change the word. Or I would go myself through the trouble of setting the captcha back to outputting random letters and get the secret word back from the server each time.
Is this a good solution for future protection against spam for large web sites?
Certainly not. Especially not for larger sites. Even if the words were random letters and the JavaScript was written server-side to complete the form with the correct word each time (think $(‘secretword’).value=’<?php echo $secretword; ?>‘; ), as long as the secret word is in the source code of the page, it can be reached by spam bots.
Is it a good solution for me and a whole lot of other website owners?
Yes. As long as nobody can make a lot of income by any form of spam on your specific website and as long as there aren’t thousands of websites that use this same specific system, nobody’s going to bother to adapt a spam bot to your website.
Spam is only profitable when done massively. It might take a spammer only a 20 minutes to program his spam bot to beat the system I’m talking about, but it would take me even less time to delete his comments, ban his ip and slightly change something in my code so he would have to reprogram his spam bot.
Unless he was some sociopath trying to annoy me, he would never go throught all the trouble.
Bottom line is: the best solutions are specific solutions.
Ever seen those forms asking you to prove that you are human by entering “the result of 8 + 5”? Do you think it’s hard to make an automated solution that reads two numbers and outputs their sum? Of course not. Nobody bothered because they aren’t popular enough to be of any interest.
I agree with Martin here, good solution but not for all cases.
It actually is a good solution. But not THE solution.
It can be fine for small websites.
But if you integrate this system in a very interesting website for somebody out there, they can always create a bot that can intercept exactly what you are doing on that webpage and autofill what Javascript is doing for your human users who have Javascript enabled. Everything is there, in the light of the day (in the code of page).
Server side solutions now are the only way to be nearly 100% protected.
thank you
Hello,
I have an other so so simple captcha. Just ask for “How much is 2 + 2” ! Only human can reply to this !
– Javascript can test it (or seveur if no JS support)
– no image to create
– the answer can be a “hidden field”
Funny that I didn’t see it anwhere !
Yes, Frederic, that works for you because it’s specific to your site. Like my captcha which only says “nospam” works for me.
I have stopped automated comment spam on my site 100% so far by implementing honeypot fields. The way I implemented it was by creating two fields for every form input. For example, for an email input field I first create which is then hidden using the CSS class ‘hp-field’. I then create which is the actual email input field the user will see. I will know if someone is a bot if they fill out and submit the hidden field(s). It has worked wonders for me.
@Justin: the honeypot is a good method too. I’ve read about it, but I wanted to go with the fastest thing to implement I could imagine.
nice stuff!!! very good job; I think I’m going to try it too
Hey Stefan,
Your solution is definitely good. I heard another similar solution where you hide an input field using CSS. That way, only a spam bot would fill it out, because a real viewer in a browser wouldn’t see it. I haven’t tried it myself though.
Yes Devin, I beleive that’s the honeypot Justin was talking about a few comments earlier.
This is an excellent idea I’d not considered, thanks very much!
I think the method proposed here is better than the honeypot method because not all bots complete all the fields. However, I guess you can work with whatever combination of methods works best for you.
I’m off to setup my hidden captcha!
A small update: I didn’t get a chance yet to set it up again on the new version of the site.
Hi,
good idea. I have a very simple “captcha”, spitting out 6 numbers in 2 different colours. The user is asked for entering the white numbers. Easy but more beautiful than ugly captchas.
Christoph
Great article, adding it to my bookmarks!
@Christoph: Doesn’t that then discriminate against colour-blind users?
Thanks for a good idea.
@Frederic Klee: Actually non-humans can answer that, too.
Appear there is a way to avoid the use of captcha with http://keypic.com
Howdy! I know this is somewhat off topic but I was
wondering if you knew where I could find a captcha plugin
for my comment form? I’m using the same blog platform as yours
and I’m having trouble finding one? Thanks a lot!
Hi I have one form in html. i have attached sendmail.php to it to get details in my id. now i have added captcha to that form but it is submiting without entering right captcha number or letters. pls help me how to force to fill right captcha and after filling right captcha form should be submit. so what i have to add in my php script.