MatthiasGi
Grüner Idealist
Hallo allerseits!
Ich verzweifle gerade an einem Form mit Kreis-Captcha.
Mein Formular sieht so aus:
Wie ihr sehen könnt, wird statt einem normalen Submit-Button ein Kreiscaptcha angegeben, hier die captcha.php:
Nun wird in einem iframe names iframe mit CSS-Eigenschaft display: none versteckt die work.php aufgerufen, die das ganze verarbeitet. (Mit Hilfe von jQuery).
Hier der Schnipsel:
Ich weiß, relativ unaufgeräumt
Nun habe ich wie oben zu sehen, die x und y-Koordinaten des Klicks auslesen lassen, doch es erscheint immer x: 0| y: 0. Irgend was habe ich übersehen, und komme nicht drauf.
Irgend jemand eine Idee?
Danke schonmal im Voraus,
Matthias
Ich verzweifle gerade an einem Form mit Kreis-Captcha.
Mein Formular sieht so aus:
HTML:
<form class="expose contact" action="work.php?action=contact" target="iframe" method="post">
<div id="inputs">
<table border="0">
<tr class="anrede">
<td class="label"><label for="anrede">Anrede:</label></td>
<td class="input">
<select id="anrede" size="1" name="anrede">
<option selected="selected" value="nothing">Bitte auswählen...</option>
<option>Frau</option>
<option>Herr</option>
</select>
</td>
<td class="error"></td>
</tr>
<tr class="vorname">
<td class="label"><label for="vorname">Vorname:</label></td>
<td class="input"><input id="vorname" type="text" name="vorname" maxlength="20" /></td>
<td class="error"></td>
</tr>
<tr class="nachname">
<td class="label"><label for="nachname">Nachname:</label></td>
<td class="input"><input id="nachname" type="text" name="nachname" maxlength="25" /></td>
<td class="error"></td>
</tr>
<tr class="email">
<td class="label"><label for="email">Email-Adresse:</label></td>
<td class="input"><input id="email" type="text" name="email" /></td>
<td class="error"></td>
</tr>
<tr class="betreff">
<td class="label"><label for="betreff">Betreff:</label></td>
<td class="input"><input id="betreff" type="betreff" name="betreff" /></td>
<td class="error"></td>
</tr>
<tr class="text">
<td class="label"><label for="text">Text:</label></td>
<td class="input"><textarea id="text" name="text" rows="10"></textarea></td>
<td class="error"></td>
</tr>
<tr class="send">
<td class="send" colspan="2">
<input type="image" src="img/captcha.php" onclick="$(this).fadeOut(\'slow\', function(){ $(\'img.loading_gif\').fadeIn(\'slow\', function() { return true; }); });" style="cursor: crosshair;" name="captcha" id="captcha" value="Absenden" />
<img src="img/loading.gif" class="loading_gif" height="32" width="32" style="display: none;" />
</td>
<td class="error"></td>
</tr>
</table>
</div>
</form>Wie ihr sehen könnt, wird statt einem normalen Submit-Button ein Kreiscaptcha angegeben, hier die captcha.php:
PHP:
<?php
session_start();
mt_srand((double)microtime()*1000000);
$image = imagecreatetruecolor(200, 60);
imagefilledrectangle($image, 0, 0, 200 - 1, 60 - 1, $background = imagecolorallocate($image, 255, 255, 255));
imagerectangle($image, 0, 0, 200 - 1, 60 - 1, imagecolorallocate($image, 0, 200, 0));
$color = array();
$color[] = imagecolorallocatealpha($image, 0, 0, 0, 90);
$color[] = imagecolorallocatealpha($image, 128, 0, 0, 90);
$color[] = imagecolorallocatealpha($image, 255, 0, 0, 80);
$color[] = imagecolorallocatealpha($image, 0, 255, 0, 70);
$color[] = imagecolorallocatealpha($image, 0, 0, 255, 90);
$color[] = imagecolorallocatealpha($image, 255, 153, 0, 70);
$color[] = imagecolorallocatealpha($image, 153, 0, 255, 90);
$color[] = imagecolorallocatealpha($image, 0, 255, 255, 70);
shuffle($color);
$target_circle = mt_rand(1, 5);
for($i=1; $i <= 5; $i++){
$diameter = mt_rand(30,50);
$radius = ($diameter / 2)+2;
$x = mt_rand($radius,200-$radius);
$y = mt_rand($radius,60-$radius);
$start = 0;
$end = 360;
if($target_circle == $i){
$start = mt_rand(0,360);
$end = $start-45;
$_SESSION['circle_x'] = $x;
$_SESSION['circle_y'] = $y;
$_SESSION['circle_r'] = $radius;
}
imagesetthickness($image, 2);
imagearc($image, $x, $y, $diameter, $diameter, $start, $end, $color[$i]);
}
header('Content-type: image/png');
imagepng($image);
imagedestroy($image);
?>Nun wird in einem iframe names iframe mit CSS-Eigenschaft display: none versteckt die work.php aufgerufen, die das ganze verarbeitet. (Mit Hilfe von jQuery).
Hier der Schnipsel:
PHP:
function _javascript($javascript, $die = 0) {
echo '<script type="text/javascript">'.$javascript.'</script>';
if ($die == 1) die('</body>');
}
function _action_contact() {
sleep(2);
if ($_POST['anrede'] == "nothing") _javascript('top.jQuery("<p>Bitte eine Anrede angeben!</p>").appendTo("tr.anrede td.error"); top.jQuery("tr.anrede td.error").fadeIn("slow");');
if ($_POST['vorname'] == "") {
_javascript('top.jQuery("<p>Bitte Vornamen angeben!</p>").appendTo("tr.vorname td.error"); top.jQuery("tr.vorname td.error").fadeIn("slow");');
} elseif (strlen($_POST['vorname']) < 3 || strlen($_POST['vorname']) > 20) {
_javascript('top.jQuery("<p>Ihr Vorname ist zu lang oder zu kurz!</p>").appendTo("tr.vorname td.error"); top.jQuery("tr.vorname td.error").fadeIn("slow");');
}
if ($_POST['nachname'] == "") {
_javascript('top.jQuery("<p>Bitte Nachnamen angeben!</p>").appendTo("tr.nachname td.error"); top.jQuery("tr.nachname td.error").fadeIn("slow");');
} elseif (strlen($_POST['nachname']) < 3 || strlen($_POST['nachname']) > 25) {
_javascript('top.jQuery("<p>Ihr Nachnamen ist zu lang oder zu kurz!</p>").appendTo("tr.nachname td.error"); top.jQuery("tr.nachname td.error").fadeIn("slow");');
}
if(!checkAddress($_POST['email'])) _javascript('top.jQuery("<p>Ihre Email-Adresse ist ungültig!</p>").appendTo("tr.email td.error"); top.jQuery("tr.email td.error").fadeIn("slow");');
if($_POST['betreff'] == "") _javascript('top.jQuery("<p>Bitte geben Sie einen Betreff an!</p>").appendTo("tr.betreff td.error"); top.jQuery("tr.betreff td.error").fadeIn("slow");');
if(strlen($_POST['text']) < 20) _javascript('top.jQuery("<p>Ihr Text ist zu kurz!</p>").appendTo("tr.text td.error"); top.jQuery("tr.text td.error").fadeIn("slow");');
if(isset($_POST['captcha_x']) && isset($_POST['captcha_y'])) {
if(!empty($_SESSION['circle_x']) && !empty($_SESSION['circle_y']) && !empty($_SESSION['circle_r'])){
_javascript('alert("x: '.$_POST['captcha_x'].'| y: '.$_POST['captcha_y'].'");');
$dx = $_POST['captcha_x'] - $_SESSION['circle_x'];
$dy = $_POST['captcha_y'] - $_SESSION['circle_y'];
$r1 = sqrt($dx * $dx + $dy * $dy);
if ($r1 < $_SESSION['circle_r']) {
_javascript('top.jQuery("<p>Bitte in den geöffneten Kreis klicken!</p>").appendTo("tr.send td.error"); top.jQuery("tr.send td.error").fadeIn("slow");');
} else {
_javascript('alert("Test!");');
}
}
}
}
function checkAddress($Address) {
if(!preg_match("/^[A-Z0-9._%+-ÄÖÜäöü]+@[A-Z0-9.-ÄÖÜäöü]+\.[A-Z]{2,6}$/i", $Address)) return false;
if(($Connection = @fsockopen($DomainPart, 80, $ErrorNumber, $ErrorString, 5)) === false) return false;
fclose($Connection);
return true;
}Ich weiß, relativ unaufgeräumt
Nun habe ich wie oben zu sehen, die x und y-Koordinaten des Klicks auslesen lassen, doch es erscheint immer x: 0| y: 0. Irgend was habe ich übersehen, und komme nicht drauf.
Irgend jemand eine Idee?
Danke schonmal im Voraus,
Matthias
