如何制作reCAPTCHA?

时间:2017-03-20 16:02:40

标签: javascript php jquery ajax html5

我正在制作表单,我使用AJAX发送它,但我也有一个google reCAPTCHA,我不知道如何使它成为必需。

我不想在没有检查reCAPTCHA的情况下发送表单,如果没有检查,那么我想显示相关信息。我尝试了很多东西,但我仍然不知道错误。

我的HTML代码:



        <div class="form">
        <div id="form-messages"></div>
      	<form id="formularz" method="post" action="mailer.php">
            <div class="line">
            	<input id="name" name="name" type="text" placeholder="Imię"/>
            	<input id="email" name="email" type="email" placeholder="E-mail" required/>
            </div>
            <div class="line2">
          	<input id="temat" name="temat" type="text" placeholder="Temat" />
          	<textarea id="wiadomosc" name="message" placeholder="Wiadomość" required></textarea>
            </div>
            <div class="line3">
          	<div class="g-recaptcha captcha" data-sitekey="6Lcu9xgUAAAAAPbwLwKWILHGxu-X0cPjAhRtYM2R"></div>
          	<input id="submit" name="submit" type="submit" value="Wyślij">
              <div style="clear:both;"></div>
            </div>
      	</form>
     </div>
&#13;
&#13;
&#13;

我的js代码:

&#13;
&#13;
$(function() {
	var form = $('#formularz');
  var formMessages = $('#form-messages');

	$(form).submit(function(e) {
		e.preventDefault();

		var formData = $(form).serialize();

		$.ajax({
			type: 'POST',
			url: $(form).attr('action'),
			data: formData
		})
		.done(function() {
			$(formMessages).removeClass('error');
			$(formMessages).addClass('success');

      $(formMessages).text('Dziękujemy, wiadomość została wysłana.');

			$('#name').val('');
			$('#email').val('');
			$('#temat').val('');
			$('#wiadomosc').val('');
		})
		.fail(function() {
			$(formMessages).removeClass('success');
			$(formMessages).addClass('error');

			$(formMessages).text('Oops! Wiadomość nie mogła zostać wysłana.');
		});
	});
});
&#13;
&#13;
&#13;

和PHP代码:

&#13;
&#13;
if ($_SERVER["REQUEST_METHOD"] == "POST") {
        $name = strip_tags(trim($_POST["name"]));
				$name = str_replace(array("\r","\n"),array(" "," "),$name);
        $email = filter_var(trim($_POST["email"]), FILTER_SANITIZE_EMAIL);
        $message = trim($_POST["message"]);

        $recipient = "karol_guzikowski@wp.pl";

        $subject = "Nowa wiadomość od $name";

        $email_content = "Od: $name\n";
        $email_content .= "Email: $email\n\n";
        $email_content .= "Wiadomość:\n$message\n";

        $email_headers = "Od: $name <$email>";

		$wszystko_OK=true;

		$sekret = "6Lcu9xgUAAAAAPbwLwKWILHGxu-X0cPjAhRtYM2R";

		$sprawdz = file_get_contents('https://www.google.com/recaptcha/api/siteverify?secret='.$sekret.'&response='.$_POST['g-recaptcha-response']);

		$odpowiedz = json_decode($sprawdz);

		if (!$odpowiedz->success){
			$wszystko_OK=false;
			http_response_code(600);
			echo "Proszę zaznaczyć reCAPTCHE";
		}

		if($wszystko_OK==true){
			mail($recipient, $subject, $email_content, $email_headers);
		}
}
&#13;
&#13;
&#13;

2 个答案:

答案 0 :(得分:0)

&#13;
&#13;
$(function() {
  var form = $('#formularz');
  var formMessages = $('#form-messages');

  $(form).submit(function(e) {
    e.preventDefault();
    //Recaptcha Validation
    if (!$('#g-recaptcha-response').val().trim().length) {
      alert("Recaptcha is required")
      return false;
    }
    var formData = $(form).serialize();

    $.ajax({
        type: 'POST',
        url: $(form).attr('action'),
        data: formData
      })
      .done(function() {
        $(formMessages).removeClass('error');
        $(formMessages).addClass('success');

        $(formMessages).text('Dziękujemy, wiadomość została wysłana.');

        $('#name').val('');
        $('#email').val('');
        $('#temat').val('');
        $('#wiadomosc').val('');
      })
      .fail(function() {
        $(formMessages).removeClass('success');
        $(formMessages).addClass('error');

        $(formMessages).text('Oops! Wiadomość nie mogła zostać wysłana.');
      });
  });
});
&#13;
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="form">
  <div id="form-messages"></div>
  <form id="formularz" method="post" action="mailer.php">
    <div class="line">
      <input id="name" name="name" type="text" placeholder="Imię" />
      <input id="email" name="email" type="email" placeholder="E-mail" required/>
    </div>
    <div class="line2">
      <input id="temat" name="temat" type="text" placeholder="Temat" />
      <textarea id="wiadomosc" name="message" placeholder="Wiadomość" required></textarea>
    </div>
    <div class="line3">
      <div class="g-recaptcha captcha" data-sitekey="6Lcu9xgUAAAAAPbwLwKWILHGxu-X0cPjAhRtYM2R"></div>
      <input id="submit" name="submit" type="submit" value="Wyślij">
      <div style="clear:both;"></div>
    </div>
  </form>
</div>
&#13;
&#13;
&#13;

答案 1 :(得分:0)

希望这对你有用。

<form class="p-b-lg" id="enquiry-form" method="post" action="">
    <div class="form-group">
        <input class="form-control form-control-lg" placeholder="Email" name="email1" type="email">
    </div>
    <div class="form-group">
        <input class="form-control form-control-lg" placeholder="Contact Phone" name="number" type="number" required>
    </div>
    <div class="form-group">
        <div class="g-recaptcha" id="rcaptcha" data-sitekey="sitekey goes here"></div>
        <span id="captcha" style="margin-left:100px;color:red" />
    </div>
    <div class="form-group">
        <button class="btn btn-lg btn-secondary-outline team-btn contact-btn" type="submit" name="submit">Send</button>
    </div>
</form>


<?php     
if(isset($_POST['submit'])){
if(isset($_POST['g-recaptcha-response']) && !empty($_POST['g-recaptcha-response'])) {
//your site secret key
$secret = 'secret key goes here';
//get verify response data
$verifyResponse = file_get_contents('https://www.google.com/recaptcha/api/siteverify?secret='.$secret.'&response='.$_POST['g-recaptcha-response']);
$responseData = json_decode($verifyResponse);
if($responseData->success) {
$email1 = $_POST['email1'];
$contact_phone = $_POST['contact_phone'];
<?php } 
}
else { ?>
<script>alert("Please fill captcha.");</script>
<?php }
}
?>
相关问题