2012-08-09 146 views
0

我有captcha在captcha.php中创建一个图像。在我的联系人php页面上,它要求图像&它有一个重新加载,并且一切正常。我似乎无法找到验证它的方法。验证图片验证码。 jquery PHP&javascript

下面是创建验证码图像的代码:

<?php 
session_start(); 

$word_1 = ''; 
$word_2 = ''; 

for ($i = 0; $i < 4; $i++) 
{ 
    $word_1 .= chr(rand(97, 122)); 
} 
for ($i = 0; $i < 4; $i++) 
{ 
    $word_2 .= chr(rand(97, 122)); 
} 

$_SESSION['random_number'] = $word_1.' '.$word_2; 

$dir = '/addons/fonts/'; 

$image = imagecreatetruecolor(165, 50); 

$font = "recaptchaFont.ttf"; // font style 

$color = imagecolorallocate($image, 0, 0, 0);// color 

$white = imagecolorallocate($image, 255, 255, 255); // background color white 

imagefilledrectangle($image, 0,0, 709, 99, $white); 

imagettftext ($image, 22, 0, 5, 30, $color, $dir.$font, $_SESSION['random_number']); 

header("Content-type: image/png"); 

imagepng($image); 

?> 

这是所有在该文件中。

接下来是从我的实际形式的代码(与我们联系页):

<form id="contactForm" method="post" action="<?php echo $_SERVER['PHP_SELF']; ?>"> 
<table> 
<tr> 
    <td><span class="greyText">Enter text shown:</span></td> 
    <td> 
     <div id="captcha-wrap"> 
      <div class="captcha-box"> 
       <img src="captcha.php" alt="" id="captcha" /> 
      </div> 
      <div class="text-box"> 
       <label>Type the two words:</label> 
       <input name="captcha-code" type="text" id="captcha-code"> 
      </div> 
      <div class="captcha-action"> 
       <img src="./images/captcha-refresh.png" alt="" id="captcha-refresh" /> 
      </div> 
     </div> 
     <span id="captchaInfo">*</span> 
    </td> 
</tr> 
<tr> 
    <td colspan="2"> 
      <div class="seperator">&nbsp;</div> 

      <input type="submit" name="submit" class="styleButton" style="float:right;margin-right:10px" value="SUBMIT" /></td> 
</tr> 
</table> 
</form> 

我在表中的姓名,电子邮件等其他行,但我只是删除它,使这个更短。

在联系人页面文件准备功能&,我有这样的代码刷新验证码点击按钮时:

// refresh captcha 
$('img#captcha-refresh').click(function() { 

     change_captcha(); 
}); 

function change_captcha() 
{ 
    document.getElementById('captcha').src='jquery-captcha.php?rnd=' + Math.random(); 
} 

接下来是我对整个表单本身的验证。它适用于一切,但验证码:

$(document).ready(function(){ 
    //global vars 
    var form = $("#contactForm"); 
    var name = $("#name"); 
    var nameInfo = $("#nameInfo"); 
    var telephone = $("#telephone"); 
    var telephoneInfo = $("#telephoneInfo"); 
    var email = $("#email"); 
    var emailInfo = $("#emailInfo"); 
    var message = $("#message"); 
    var messageInfo = $("#messageInfo"); 
    var captcha = $("#captcha-code"); 
    var captchaInfo = $("#captchaInfo"); 

    //On blur 
    name.blur(validateName); 
    telephone.blur(validatePhone); 
    email.blur(validateEmail); 
    message.blur(validateMessage); 
    captcha.blur(validateCaptcha); 
    //On key press 
    name.keyup(validateName); 
    telephone.keyup(validatePhone); 
    message.keyup(validateMessage); 
    captcha.keyup(validateCaptcha); 
    //On Submitting 
    form.submit(function(){ 
     if(validateName() & validateEmail() & validatePhone() & validateMessage() & validateCaptcha()) 
      return true 
     else 
      return false; 
    }); 

    function validateName(){ 
     //if it's NOT valid 
     if(name.val().length < 4){ 
      name.addClass("error"); 
      nameInfo.text("* Name Required"); 
      nameInfo.addClass("error"); 
      return false; 
     } 
     //if it's valid 
     else{ 
      name.removeClass("error"); 
      nameInfo.text("*"); 
      nameInfo.removeClass("error"); 
      return true; 
     } 
    } 
    function validateCaptcha(){ 

     $.post("captchaValidate.php?"+$("#contactForm").serialize(), { 

      }, function(response){ 

      if(response==1) 
      { 
       captcha.removeClass("error"); 
       captchaInfo.text("*"); 
       captchaInfo.removeClass("error"); 
       return true; 
      } 
      else 
      { 
       captchaInfo.text("* Please enter the words you see in the box above. If you are having trouble seeing it, click the refresh button."); 
       captchaInfo.addClass("error"); 
       captchaInfo.css({'float': 'left', 'margin-left': '5px'}); 
       return false; 
      } 

     }); 
    } 
}); 

我又去掉了一些上面的代码使这个短,但我离开validateName功能,所以你可以看到我是如何几乎没有他们的休息。

在其引导到这个页面/代码validateCaptcha代码:

<?php 
session_start(); 

if(@strtolower($_REQUEST['captcha-code']) == strtolower($_SESSION['random_number'])) 
{ 

    echo 1;// YAY! 

} 
else 
{ 
    echo 0; // invalid code 
} 
?> 

任何帮助将非常感激我已经坚持了这么久!我已经尝试了一些东西,但似乎没有任何工作。

回答

3
+0

任何帮助,第二个链接似乎很接近我有什么,但我的代码无法找到$ _SESSION [ 'RANDOM_NUMBER']。如果我试图回应它或任何东西以查看它是什么,它将显示为空白 – Catia 2012-08-09 17:33:29

0

如果你不介意使用简单的数学验证码,这个很容易集成到你自己的代码中。它使用PHP和jQuery,所以它可以在启用或不启用Javascript的情况下运行。我为它编写了一个教程,并提供了一个项目下载,其中包含所有可用的项目文件。

同时使用jQuery和PHP http://www.sinawiwebdesign.com/blog/topics/programming/jquery-and-php-and-catcha-tutorial/

我希望这有助于使一个简单的数学验证码。

0

创建与jQuery验证实例PHP简单CAPCHA如果你有那个

Create capcha code need three files 

capcha.php 
form.php 
check-capcha.php 

capcha.php 

download font arial.ttf addded in fonts folder http://www5.miele.nl/apps/vg/nl/miele/mielea02.nsf/0e87ea0c369c2704c12568ac005c1831/07583f73269e053ac1257274003344e0?OpenDocument 


<?php 

session_start(); 

$string = ''; 

for ($i = 0; $i < 5; $i++) { 
    // this numbers refer to numbers of the ascii table (lower case) 
    $string .= chr(rand(97, 122)); 
} 

$_SESSION['random_code'] = $string; 

$data['code'] = $string; 
$dir = 'fonts/'; 

if(!is_dir($dir)){ 
mkdir($dir); 
} 

$image = imagecreatetruecolor(170, 60); 
$black = imagecolorallocate($image, 0, 0, 0); 
$color = imagecolorallocate($image, 200, 100, 90); // red 
$white = imagecolorallocate($image, 255, 255, 255); 

imagefilledrectangle($image,0,0,399,99,$white); 
imagettftext ($image, 30, 0, 10, 40, $color, $dir."arial.ttf", $_SESSION['random_code']); 

$save= "test.png"; 
    imagepng($image,$save); 
    ob_start(); 
    imagedestroy($image); 
echo json_encode($data); 
?> 

form.php 

<script src="https://code.jquery.com/jquery-1.12.3.min.js"></script> 
<script src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.15.0/jquery.validate.js"></script> 
<script type="application/javascript"> 
$(document).ready(function(e) { 

$('#test').validate({ 
rules:{ 
capcha:{required: true, 
remote: { 
        url: "check-capcha.php", 
        type: "post", 
data:{hiddencapcha:function(){return $('#hidden_capcha').val()}} 
       } 
} 
}, 
messages:{ 
capcha:{ 
remote:"invalid capcha" 
} 
} 
}); 
$.ajax({ 
url: "capcha.php", 
success: function(result) { 
var newd = JSON.parse(result); 

$('input[name=hidden_capcha]').val(newd.code); 


$('#capchas').attr('src',"test.png?"+ new Date().getTime()); 
},error: function(){ alert(result)} 
}); 

$('#generate_capcha').click(function(){ 

$.ajax({ 
url: "capcha.php", 
success: function(result) { 
var newd = JSON.parse(result); 

$('input[name=hidden_capcha]').val(newd.code); 

$('#capchas').attr('src',"test.png?"+ new Date().getTime()); 
},error: function(){ alert(result)} 
}); 
}); 

}); 

</script> 

<form name="test" id="test"> 

<span id="capchas_images"><img id="capchas" src="test.png" /></span> <a href="javascript:void(0)" id="generate_capcha">Refresh</a> 
<input type="text" name="capcha" /> 
<input type="hidden" name="hidden_capcha" id="hidden_capcha" /> 
</form> 

check-capch.php 

<?php 


if($_POST['capcha']==$_POST['hiddencapcha']) 
{ 
echo "true"; 
}else{ 
echo "false"; 
    } 
?> 

http://myphpinformation.blogspot.in/2016/05/create-simple-capcha-in-php-with-jquery-validation.html