AlexC
AlexC

Reputation: 9661

Pure JavaScript/jQuery/HTML captcha

can somebody sent me a link, or to provide me an example with pure Javascript/jQuery captcha. Because I can see a lots of examples with PHP/C# ... back end. But I need just Javascript .

Thanks !!

Upvotes: 3

Views: 36395

Answers (8)

Pravin Sharma
Pravin Sharma

Reputation: 1156

Hi AlexC you can validate your google recaptcha at client side also 100% work for me to verify your google recaptcha just see below code
This code at the html body:

 <div class="g-recaptcha" id="rcaptcha" style="margin-left: 90px;" data-sitekey="my_key"></div>
 <span id="captcha" style="margin-left:100px;color:red" />

This code put at head section on call get_action(this) method form button:

function get_action(form) {

    var v = grecaptcha.getResponse();
    if(v.length == 0)
    {
        document.getElementById('captcha').innerHTML="You can't leave Captcha Code empty";
        return false;
    }
    if(v.length != 0)
    {
        document.getElementById('captcha').innerHTML="Captcha completed";
        return true; 
    }
}

Upvotes: 0

HoaPhan
HoaPhan

Reputation: 1936

Check out: http://www.google.com/recaptcha/intro/

Demo here: http://www.google.com/recaptcha/api2/demo OR http://www.finalwebsites.com/demos/custom-captcha-image-script/

===========================IN SHORT====================

Add the code snippet to the page for the captcha to occur:

<script src='https://www.google.com/recaptcha/api.js'></script>
<div class="g-recaptcha" data-sitekey="YOUR_KEY_1"></div>

whenever user complete the challenge, a textArea named g-recaptcha-response with value is populated, you will collect that value and send below request to validate it: https://www.google.com/recaptcha/api/siteverify?secret=YOUR_KEY_2&response=TOKEN&remoteip=IPADDRESS

Getting the IP using js may be troublesome: http://www.ipify.org/

Upvotes: 2

Laith
Laith

Reputation: 17

I wrote a tutorial on making a simple math captcha using PHP and jQuery, so it works with or without Javascript enabled. This should be very easy to integrate into your own scripts, or you can use it as is. You can download the project, extract the zip file, and it works out of the box. I hope you find this useful.

Making a Simple Math Captcha using both jQuery and PHP http://www.sinawiwebdesign.com/blog/topics/programming/jquery-and-php-and-catcha-tutorial/

Upvotes: -2

patryk
patryk

Reputation: 11

I'm working on an alternative captcha right now. If you'll use only client-side part of it, you'll have what you want assuming you want something just to show in the browser. It's not exactly pure javascript, since it still uses api to get a picture, and looks cool enough :D

http://photocaptcha.cu.cc

It would involve including one script on your side, but it doesn't make much much sense if you don't validate the answers ;)

Upvotes: 1

cocacola09
cocacola09

Reputation: 648

There is a tutorial on jQuery with captcha located here; http://www.tutorialcadet.com/jquery-advanced-ajax-validation-with-captcha/

Upvotes: 0

Ashit Vora
Ashit Vora

Reputation: 2922

Do you want to add CAPTCHA just because it sounds geeky? Don't use it unless it is really needed.

Upvotes: -4

Topera
Topera

Reputation: 12389

I think this is not a good idea, because if validation is made in client (js), somebody can make a script to read the correct answer.


EDIT

Anyway, if you want a useless captcha, you can play with this:

See in jsfiddle.

HTML

Pseudo-Human check.

<br/>How much is: <input type="text" id="a"/>
<br/>Answer:<input type="text" id="b"/>

<br/>
<input type="button" id="c" value="Go!"/>

JS

$(document).ready(function() {
    var n1 = Math.round(Math.random() * 10 + 1);
    var n2 = Math.round(Math.random() * 10 + 1);
    $("#a").val(n1 + " + " + n2);
    $("#c").click(function() {
        if (eval($("#a").val()) == $("#b").val()) {
            alert("Ok! You are human!");
        } else {
            alert("error");
        }
    });
});

EDIT 2:

My "captcha" hack:

// captcha hack
$(document).ready(function() {
     $("#b").val(eval($("#a").val()));
});

See in jsfiddle.

Upvotes: 12

DGM
DGM

Reputation: 26979

That doesn't make sense... without a backend check, the captcha is useless. bots don't use javascript anyway. All you'd be accomplishing is to annoy your users.

Upvotes: 3

Related Questions