captcha.php で画像を作成するキャプチャがあります。私の連絡先phpページでは、画像が呼び出され、リロードが行われ、すべてが機能します。私はそれを検証する方法を見つけることができないようです。
キャプチャ画像を作成するコードは次のとおりです。
<?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"> </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
}
?>
これについて何か助けていただければ幸いです。私は長い間立ち往生していました。私はすでにいくつかのことを試しましたが、何もうまくいかないようです。