0

Why is google recaptcha box appearing in the top of the fields, It should be appearing between the inputs and the Confirm button. Take a look at this SS right here: https://i.stack.imgur.com/93G69.png .

<?php
$public_key="";
$private_key="";
$url="https://www.google.com/recaptcha/api/siteverify";
if(array_key_exists('submit_form',$_POST))
{
$response_key=$_POST['g-recaptcha-response'];
$response=file_get_contents($url.'?secret='.$private_key.'&response'.$response_key.'&remoteip='.$_SERVER['REMOTE_ADDR']);
$response=json_decode($response);
}
?>
<!DOCTYPE html>
<html>
<head>
<title>Authentification</title>
</head>
<body>
<form method="post" action="auth.php">
<center>
<fieldset style="width:300px;">
<legend align='center'><h1>Connexion</h1></legend>
<table>
<tr>
<td><b>Email: </b></td>
<td><input type="email" name="email" required=""></td>
</tr>
<tr>
<td><b>Mot de passe: </b></td>
<td><input type="password" name="password" required=""></td>
<tr>
<div class="g-recaptcha" data-sitekey="<?php print $public_key; ?>"></div>
<script src="https://www.google.com/recaptcha/api.js"></script>
<td><input type="submit" name="submit_form" value="Se Connecter"></td>
<td><a href="ajout.php"><button type="button">S'inscrire</button></a></td>
</tr>
</table>
</fieldset>
</center>
</form>
</body>
</html>

1 Answers1

0

You should put td before the div tag

Please try the following:

<?php
$public_key="";
$private_key="";
$url="https://www.google.com/recaptcha/api/siteverify";
if(array_key_exists('submit_form',$_POST))
{
$response_key=$_POST['g-recaptcha-response'];
$response=file_get_contents($url.'?secret='.$private_key.'&response'.$response_key.'&remoteip='.$_SERVER['REMOTE_ADDR']);
$response=json_decode($response);
}
?>


<!DOCTYPE html>
<html>
<head>
<title>Authentification</title>
</head>
<body>
<form method="post" action="auth.php">
<center>
<fieldset style="width:300px;">
<legend align='center'><h1>Connexion</h1></legend>
<table>
<tr>
<td><b>Email: </b></td>
<td><input type="email" name="email" required=""></td>
</tr>
<tr>
<td><b>Mot de passe: </b></td>
<td><input type="password" name="password" required=""></td>
<tr>
<td colspan=2>
<div class="g-recaptcha" data-sitekey="<?php print $public_key; ?>"></div>
<script src="https://www.google.com/recaptcha/api.js"></script>
<tr><td>
<input type="submit" name="submit_form" value="Se Connecter"></td>
<td><a href="ajout.php"><button type="button">S'inscrire</button></a></td>
</tr>
</table>
</fieldset>
</center>
</form>
</body>
</html>
Ken Lee
  • 6,985
  • 3
  • 10
  • 29
  • how to make the captcha Required? Like the user is obliged to Bypass it in order to connect, I tried required="" and it didnt work –  Nov 29 '20 at 00:20
  • Please add the server side part in your "auth.php". Please this https://developers.google.com/recaptcha/old/docs/php (Server Side (How to test if the user entered the right answer) – Ken Lee Nov 29 '20 at 00:23
  • How? I already got my recaptcha from there btw, so i think it is already added –  Nov 29 '20 at 00:25
  • Please follow the above link in both your client (html part) and the server (php part) and it will work. The html part will show the recptcha, and so the user must enter the correct captcha , if he/she does not enter correctly, the 2nd part (server php part) will detects it and you should then reject the login – Ken Lee Nov 29 '20 at 00:30
  • Thx, but I already tested it and it worked fine, when i completed the challenge correctly it got bypassed, and when i made mistakes on purpose it refreshed the challenge image, so I dont think that's my question, i want to Oblige the user to check that recaptcha box before he press Connect –  Nov 29 '20 at 00:34
  • You may use data-callback or better use grecaptcha.getResponse(); . Please see this link (previously answered) https://stackoverflow.com/questions/28674946/how-to-check-in-js-that-user-has-checked-the-checkbox-in-google-recaptcha – Ken Lee Nov 29 '20 at 00:39