Как я могу получить мою recaptcha для проверки с моей формой?
Я знаю, что подобные вопросы задавались, но мне не удалось решить мою проблему, поэтому я прихожу к вам, хорошие люди, в надежде решить эту проблему раз и навсегда. Я упомяну, что я начинающий / средний веб-разработчик, изучая эти языки по мере продвижения. Тем не менее, я изо всех сил пытаюсь выяснить, как я могу вписать мою reCaptcha в мою существующую проверку формы. Вот весь мой код:
<?php
// grab recaptcha library
require_once "recaptchalib.php";
$msg = '';
if(isset($_POST['submit'])) {
// emails
$emailto1 = "person1"; // residential
$emailto2 = "person2"; // commercial
$emailto3 = "person3"; // general
// variables
$firstname = htmlentities($_POST['first_name'], ENT_QUOTES);
$lastname = htmlentities($_POST['last_name'], ENT_QUOTES);
$email = htmlentities($_POST['email'], ENT_QUOTES);
$phone = htmlentities($_POST['phone'], ENT_QUOTES);
$message = htmlentities($_POST['message'], ENT_QUOTES);
$response = $_POST["g-recaptcha-response"];
// get email
switch($_POST['category']){
case 'residential':
$to = $emailto1;
break;
case 'commercial':
$to = $emailto2;
break;
case 'general':
default:
$to = $emailto3;
break;
} // end switch
$headers .= "From: noreply@radiatesystems.com"."\r\n";
$body = "Name: $firstname $lastname\r\n" .
"Email: $email\r\n" .
"Phone: $phone\r\n" .
"Message:\r\n" . $message;
// if submitted check response
if ($_POST["g-recaptcha-response"]) {
$response = $reCaptcha->verifyResponse(
$_SERVER["REMOTE_ADDR"],
$_POST["g-recaptcha-response"]
);
}
// send mail
if(mail($to,'New Contact Form Request',$body,$headers, $recaptcha)){
$msg = '<div class="msggood">Thank you. Your message has been sent.</div>';
}else{
$msg = '<div class="msgerror">Please try again.</div>';
}
} // end if post
?>
<html>
<title>Contact Us</title>
<head>
<meta charset="UTF-8">
<meta name="description" content="Contact Radiate Comfort Systems.">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://www.w3schools.com/w3css/4/w3.css">
<link href="https://fonts.googleapis.com/css?family=Montserrat|Open+Sans:300" rel="stylesheet">
<link rel="icon" type="image/png" href="Images/favicon.png" />
<script src='https://www.google.com/recaptcha/api.js'></script>
<style>
body {
background-image: url("Images/background1.png");
background-color: #cccccc;
background-repeat: no-repeat;
background-size: cover;
background-position: center center;
background-attachment: fixed;
}
p {
font-family: 'Open Sans', sans-serif;
}
a:link {
text-decoration: none;
}
</style>
<style type="text/css">
.heading,
.error {display: block; width: 100%;}
.break {height: 60px;}
.msggood {width: 96%; margin: auto; background:#95fd9d; border:2px solid #00610e; color:#00610e; padding:2em;}
.msgerror {width: 96%; margin: auto; background:#fbacad; border:2px solid #900204; color:#900204; padding:2em;}
</style>
<script src="//ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
</head>
<body>
<!-- Navbar (sit on top) -->
<div class="w3-bar w3-wide w3-padding">
<a href="index.html"><img src="Images/Primary_Horizontal.png" alt="Company Logo" width="250px"/> </a>
<!-- Float links to the right. Hide them on small screens -->
<div class="w3-right w3-black w3-opacity-min">
<a href="residential.html" class="w3-bar-item w3-text-white w3-hover-none w3-hover-text-red w3-button">Residential</a>
<a href="commercial.html" class="w3-bar-item w3-text-white w3-hover-none w3-hover-text-red w3-button">Commercial</a>
<a href="about.html" class="w3-bar-item w3-text-white w3-hover-none w3-hover-text-red w3-button">About</a>
<a href="contact.php" class="w3-bar-item w3-text-white w3-hover-none w3-hover-text-red w3-button">Contact</a>
<a href="dealers-reps.html" class="w3-bar-item w3-text-white w3-hover-none w3-hover-text-red w3-button"><strong>Login</strong></a>
</div>
</div>
<div class="w3-half w3-content w3-padding">
<br/><br/>
<iframe src="https://www.google.com/maps/embed?pb=!1m14!1m8!1m3!1d12924.6337091224!2d-90.808029!3d35.918622!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x0%3A0x31fba25c7063047f!2sRadiate+Comfort+Systems!5e0!3m2!1sen!2sus!4v1510867308786" width="600" height="450" frameborder="0" style="border:0" allowfullscreen class="w3-border "></iframe>
</div>
<form class="w3-half" method="post" onSubmit="return validate();">
<?= (isset($msg))?$msg:''; ?>
<div class="w3-content w3-card-4 w3-light-grey w3-text-blue w3-padding w3-row-padding">
<h2 class="w3-center ">Contact Us</h2>
<div class="heading">First Name<span class="w3-text-red">*</span></div>
<input type="text" name="first_name" id="first-name" class="required w3-input w3-border">
<span class="error" id="fname"></span>
<div class="heading">Last Name<span class="w3-text-red">*</span></div>
<input type="text" name="last_name" id="last-name" class="required w3-input w3-border">
<span class="error" id="lname"></span>
<div class="heading">Email<span class="w3-text-red">*</span></div>
<input type="email" name="email" id="email" class="required w3-input w3-border">
<span class="error" id="eml"></span>
<div class="heading">Confirm Email<span class="w3-text-red">*</span></div>
<input type="email" name="confirm" id="confirm" class="required w3-input w3-border">
<span class="error" id="confeml"></span>
<div class="heading">Phone</div>
<input type="text" class="w3-input w3-border" name="phone" id="phone">
<span class="error " id="phn"></span>
<div class="heading">Message<span class="w3-text-red">*</span></div>
<textarea name="message" id="message" class="required w3-input w3-border"></textarea>
<span class="error" id="msge"></span>
<div class="heading">Category<span class="w3-text-red">*</span>:</div>
<select class="w3-select" name="category" id="category">
<option value="">--Choose One--</option>
<option value="residential">Residential</option>
<option value="commercial">Commercial</option>
<option value="general">General Question</option>
</select>
<span class="error" id="cat"></span>
<!-- RECAPTCHA INSERT HERE -->
<div class="g-recaptcha" id="rcaptcha" data-sitekey="my-key"></div>
<!-- END RECAPTCHA -->
<button class="w3-button w3-block w3-section w3-blue w3-hover-red w3-ripple w3-padding" type="submit" name="submit">Send Message!</button>
</div>
</form>
<script type="text/javascript">
function validate(){
valid = true;
$('.required').each(function(){
if($(this).val() == ''){
alert("Please fill in all required fields.");
$('.required').css('border-color','#990000');
$(this).focus();
valid = false;
return false;
}
});
if($('#email').val() != $('#confirm').val()){
alert('Email addresses do not match. Please try again.');
$('#email').focus();
$('#email, #confirm').css('border-color','#990000');
valid = false;
return false;
}
if( $('#email').val() ) {
var div = $('#email');
var email = $('#email').val();
var filter = /^([a-zA-Z0-9_\.\-])+\@(([a-zA-Z0-9\-])+\.)+([a-zA-Z0-9]{2,4})+$/;
if(email != ''){
if (!filter.test(email)) {
alert('Please provide a valid email address');
div.css('border-color','#990000');
div.focus();
valid = false;
return false;
}
}else{
$('#eml').html('Fill in your email address please.');
div.focus();
valid = false;
return false;
}
}
if( $('#first-name').val() ){
if($(this).val() == ''){
$('#fname').html('Fill in your first name please.');
$(this).focus();
valid = false;
return false;
}
}
if( $('#last-name').val() ){
if($(this).val() == ''){
$('#lname').html('Fill in your last name please.');
$(this).focus();
valid = false;
return false;
}
}
if( $('#message').val() ){
if($(this).val() == ''){
$('#msge').html('Fill in a message please.');
$(this).focus();
valid = false;
return false;
}
}
if (grecaptcha.getResponse() == ""){
alert("You can't proceed!");
} else {
alert("Thank you");
}
return valid;
}
</script>
</body>
</html>