/ best free open source web resources /

Drag and Drop Ajax Fancy Captcha jQuery Plugin

Ajax Fancy Captcha is a jQuery plugin that helps you protect your web pages from spammers. It is a new intuitive way of completing “verify humanity” tasks. In order to do that you are asked to drag and drop specified item into a circle.

Captcha’s security level is medium, with the emphasis on nice looking and user friendly qualities while still offering reasonable protection from unwanted “guests”. Basic design and its elements are easy to change and customize.

Seems a bit unnecessary to me. If you’re going to require JavaScript to post a form, haven’t you pretty much stopped comment bots right there? Why have the puzzle too?

http://jpscaletti.com JpScaletti

With this “captcha” a comment both has a 20% (1 in 5) chance of success… How is this “medium” security? How is “security” at all?

http://www.typoblog.ch typoman

I like the new way of programming a captcha.
cool!

http://KyleFarris.com Kyle

Yeah, this seems like it would be very easy to work around if you were a comment bot seeing as you have a one in 5 chance of getting it right.

http://KyleFarris.com Kyle

Oh… and there’s only ONE draggable element. I seems like it would be quite easy to simply trigger the “dropped” event for the drag-able element. It’s really pretty and very user friendly (trust me I don’t really like those ‘type out what you see’ things either…), but, again, this just seems to easy to work around.

I love this tools. This can easily differentiate comments from a human being and spams. Less time is needed for comments moderation then. Save our time and we can focus on something else.

http://buycarandsellcar.com buycarandsellcar.com

Thank you. It looks really cool

http://www.onlinehungama.com/ Rakshit

I tried the script, but see a weird behavior. I get the images in the array.. though the image that should be dragged does not appear. Instead the default image of item-none(the book) appears. Can you please help?The script is surely impressive and a visual treat.

Just put the correct icon next to the last icon with aligned in the same line, you will get “passed” even though it is not dropped inside the circle.

http://www.bestcarfinder.com RK

Can’t wait to use it in one of our projects. Thanks

http://www.modernization.co.ke Athman Mohamed Athman Ali

Check out this mash I made to come up with a new concept called FACTCHA… to popularize the Millenium Development Goals. But it can be used for any data… runs off a database. Added encryption/secret-key and secret sessions to make the CAPTCHA more secure to allay fears raised above about how easy it would be to crack. Preparing a mini-site where files can be downloaded and will be available in the same location as the demo below … very soon! :D

Just for more info and for comments on whether what I ahve done makes it more secure, what i tried to do to make FACTCHA work as:

1. Client registers to download script. Is issued with an application key and a secret key. They put this in config.php in the downloaded files as configuration.

2. Client’s user loads form, which has not submit button or location of submit processing PHP file for the form. The FACTCHA calls a local server script captcha/captha.php which in turn does a file_get_contents(“http://someserver.com/captcha.php?site_key=”) where is the one in the config file.

3. someserver.com/captcha.php uses to check into its DB if this is a registered site, if not it returns an error code. If registered, then it calls the Millenium Development Goals database, formulates a and a , encrypts them using the site’s retrieved from database authentication and also generates an and sends it back to client server.

5. client server receives info, decrypts using its from config and sets the appropriate sessions using the access_token passed from server.

6. user drags and drops the correct icon, the data is saved into a hidden element whose names is earlier generated by server. this is to ensure all these elements are unique. The submit button is displayed and the submit processing form is attached to action_tag of the . Also, the fact obtained from database earlier is displayed.

7. On submission, the client captcha/captcha.php checks against the sessions set earlier and only if correct forwards the form for processing.

I was hoping:

1. By making sure the hidden input is randomly named, then it would be harder to have a bot look for it.

2. Even if it does look for it, the names of the sessions storing the data to be compared against are random.

3. Even if the form was submitted by the bot bypassing all the fancy stuff, the sessions which are named randomly have to be checked correctly for the form to be processed.

4. The encryption bit using secret keys for data passing between ajax client and client captcha/captcha.php and between server’s captcha.php and client’s captcha/captcha.php will not allow anyone to read the data directly by just calling up those scripts on the browser.

5. The database could as well have been on the client, but for ease of maintenance i put it on its own centralized server… hence all FACTCHA’s everywhere will have to connect to this server. Maybe statistics could be obtained from it?

I may have missed the boat completely :D but comments are welcome for improvement.

http://www.wozia.pt Wozia

An improved and more secure (much more difficult to hack) version built from us from scratch, based on this concept is called wCaptcha and can be seen at http://wcaptcha.wozia.pt

This is a great captcha, but I have still two questions.
1. I’m controling my fields in javascript, before starting another phpscript to save my fields. But how do I check if the image is dropped?
2. When there’s a error occured on one of the fields, the submit will be canceled. How do I reset the captcha with a new random set of images and no image dropped?

http://startvforum.blogspot.com Star Tv Forum

his is a great captcha, but I have still two questions.
1. I’m controling my fields in javascript, before starting another phpscript to save my fields. But how do I check if the image is dropped?
2. When there’s a error occured on one of the fields, the submit will be canceled. How do I reset the captcha with a new random set of images and no image dropped?

http://desitvtube.blogspot.com Desi Tv Tube

Just for more info and for comments on whether what I ahve done makes it more secure, what i tried to do to make FACTCHA work as:

1. Client registers to download script. Is issued with an application key and a secret key. They put this in config.php in the downloaded files as configuration.

Chad E

One line of code solves the drag-n-drop captcha:

$(‘.ui-droppable’).droppable(‘option’, ‘drop’)()

So it actually makes it easier for automated attacks. I guess it’s only meant to slow down attacks by really dumb people.

Chad E

The wCaptcha by wozia is better, but not by much. At least the source code is obfuscated, but on the other hand, you can simply do it once manually to observe what it is going to do, and then you can write a simple jQuery hack to foil it.

If the keys were randomized for each icon, and stored with the jquery data() method rather than as an attribute, it’d make it a bit tougher, but there’d still be a 20% chance to get it right with automated randomized guessing.

Athman’s solution has the same issue as the other drag-n-drop capcha: it’s not testing to see if the correct item was dropped, it just assumes that it was. So the same simple foil works:

$(’.ui-droppable’).droppable(’option’, ‘drop’)()

http://www.wozia.pt/ Wozia

@Chad I believe you’re not talking about the latest wCaptcha version, 2.0 which even supports mobile devices now.

The older versions had that problem you’re talking about, though.

Basically all the verifications are checked only on server-side, so the script allows you to put anything on it.

It is true, however, that by automated randomized guessing it’d be possible to find a solution. That’s why we implemented the nonce in it (like WordPress does it).