3
我已經瀏覽了整個互聯網，並通過問題在這裏搜索，一直沒能找到一個解決方案，讓recaptcha驗證。我爲我的表單，Html文件，JS文件進行驗證（bootstrapValidator）和php文件用於發送與phpmailer的郵件。該表單在郵寄時可以發送郵件並清除表單。我確實在表單中插入了驗證碼。 我想弄清楚的是如何讓recaptcha正確地使用表格。現在，當我點擊發送，沒有填寫字段顯示錯誤，而不是在驗證碼上。一旦字段填寫正確，然後錯誤被刪除。點擊發送，它會將信息發送到地址。只是一直沒有能夠得到recaptcha與形式工作，所以當點擊發送和驗證碼未檢查，然後形式將不會被髮送。驗證NoCaptcha ReCaptcha
這只是我嘗試驗證的方法之一，將它放在我的php表單上方date_default_timezone_set（'Etc/UTC'）上方的右上角;沒有運氣
if(isset($_POST['submit']) && !empty($_POST['submit'])):
if(isset($_POST['g-recaptcha-response']) && !empty($_POST['g-recaptcha-response'])):
//your site secret key
$secret = 'your secret key';
//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):
下面是HTML文件：
<form class="form-horizontal" action="" method="post" id="contact_form">
設立預約
<div class="col-md-12">
<div class="allFields">* ALL FIELDS REQUIRED *</div>
</div>
<div id="mainContent" class="col-sm-12">
<!-- Full Name -->
<div class="form-group">
<label for="fullname" class="col-md-4 control-label">Full Name*</label>
<div class="col-md-5 inputGroupContainer">
<div class="input-group">
<span class="input-group-addon"><i class="glyphicon glyphicon-user"></i></span>
<input type="text" placeholder="Full Name" name="fullname" class="form-control">
</div>
</div>
</div>
<!-- Address -->
<div class="form-group">
<label for="address" class="col-md-4 control-label">Address</label>
<div class="col-md-5 inputGroupContainer">
<div class="input-group">
<span class="input-group-addon"><i class="glyphicon glyphicon-road"></i></span>
<input type="text" placeholder="Address" name="address" class="form-control">
</div>
</div>
</div>
<!-- City -->
<div class="form-group">
<label for="city" class="col-md-4 control-label">City</label>
<div class="col-md-5 inputGroupContainer">
<div class="input-group">
<span class="input-group-addon"><i class="glyphicon glyphicon-home"></i></span>
<input type="text" placeholder="City" name="city" class="form-control">
</div>
</div>
</div>
<!-- State -->
<div class="form-group">
<label class="col-md-4 control-label">State</label>
<div class="col-md-5 selectContainer">
<div class="input-group">
<span class="input-group-addon"><i class="glyphicon glyphicon-list"></i></span>
<select name="state" class="form-control selectpicker" >
<option value=" " >Please select your state</option>
<option>Ohio</option>
<option>Pennsylvania</option>
</select>
</div>
</div>
</div>
<!-- Zip Code -->
<div class="form-group">
<label for="zipcode" class="col-md-4 control-label">Zip Code</label>
<div class="col-md-5 inputGroupContainer">
<div class="input-group">
<span class="input-group-addon"><i class="glyphicon glyphicon-globe"></i></span>
<input type="text" placeholder="Zip Code" name="zipcode" class="form-control">
</div>
</div>
</div>
<!-- Phone -->
<div class="form-group">
<label for="phone" class="col-md-4 control-label">Phone #</label>
<div class="col-md-5 inputGroupContainer">
<div class="input-group">
<span class="input-group-addon"><i class="glyphicon glyphicon-earphone"></i></span>
<input type="text" placeholder="(330)222-2222" name="phone" class="form-control">
</div>
</div>
</div>
<!-- Email -->
<div class="form-group">
<label for="email" class="col-md-4 control-label">E-mail</label>
<div class="col-md-5 inputGroupContainer">
<div class="input-group">
<span class="input-group-addon"><i class="glyphicon glyphicon-envelope"></i></span>
<input type="text" placeholder="E-mail Address" name="email" class="form-control">
</div>
</div>
</div>
<!-- Appointment Reason -->
<div class="form-group">
<label class="col-md-4 control-label">Appt Reason</label>
<div class="col-md-5 selectContainer">
<div class="input-group">
<span class="input-group-addon"><i class="glyphicon glyphicon-list"></i></span>
<select name="reason" class="form-control selectpicker" >
<option value=" ">Select Your Appointment Reason</option>
<option>Roofing</option>
<option>Siding</option>
<option>Doors</option>
<option>Windows</option>
<option>Decking</option>
<option>Comfort Rooms</option>
<option>Kitchen</option>
</select>
</div>
</div>
</div>
<!-- Appointment Date -->
<div class="form-group">
<label class="col-md-4 control-label">Appt. Date</label>
<div class="col-md-5 inputGroupContainer">
<div class="input-group date" id="datepicker">
<span class="input-group-addon"><i class="glyphicon glyphicon-calendar"></i></span>
<input type="text" placeholder="Date you would like Appointment" name="apptDate" class="form-control">
</div>
</div>
</div>
<!-- Appointment Time -->
<div class="form-group">
<label class="col-md-4 control-label">Appt. Time</label>
<div class="col-md-5 inputGroupContainer">
<div class="input-group date" id="timepicker">
<span class="input-group-addon"><i class="glyphicon glyphicon-time"></i></span>
<input type="text" placeholder="Time you would like Appointment" name="apptTime" class="form-control">
</div>
</div>
</div>
<!-- Contact Method -->
<div class="form-group">
<label class="col-md-4 control-label">Contact You</label>
<div class="col-md-5 selectContainer">
<div class="input-group">
<span class="input-group-addon"><i class="glyphicon glyphicon-list"></i></span>
<select name="method" class="form-control selectpicker" >
<option value=" ">Select Your Contact Method</option>
<option>Email</option>
<option>Phone</option>
</select>
</div>
</div>
</div>
<!-- Project Description -->
<div class="form-group">
<label for="comments" class="col-md-4 control-label">Project Description</label>
<div class="col-md-5 inputGroupContainer">
<div class="input-group">
<span class="input-group-addon"><i class="glyphicon glyphicon-pencil"></i></span>
<textarea name="comments" placeholder="Project Description" rows="5" class="form-control"></textarea>
</div>
</div>
</div>
<div class="form-group">
<label class="col-md-4 control-label">Captcha</label>
<div class="col-md-5 inputGroupContainer">
<div class="g-recaptcha" data-sitekey="XXXXXXXXXXXXXXXXXXXXXXXXX"></div>
</div>
</div>
<div class="form-group">
<div class="col-md-offset-4 col-md-5" id="captchaMessage"></div>
</div>
<!-- Submit Button -->
<div class="form-group">
<div class="col-md-offset-4 col-md-5">
<button type="submit" name="submit" class="btn btn-primary">Send <span class="glyphicon glyphicon-send"></span></button>
</div>
</div>
</div> <!-- mainContent -->
</fieldset>
</form>
JS文件：
$(document).ready(function() {
$('#contact_form').bootstrapValidator({
// To use feedback icons, ensure that you use Bootstrap v3.1.0 or later
feedbackIcons: {
valid: 'glyphicon glyphicon-ok',
invalid: 'glyphicon glyphicon-remove',
validating: 'glyphicon glyphicon-refresh'
},
submitHandler: function(validator, form, submitButton) {
$.ajax({
type: "POST",
url: "appt.php",
data: $('#contact_form').serialize(),
success: function(){
$('#contact_form').each(function(){
this.reset();
$(contact_form).data('bootstrapValidator').resetForm();
});
},
error: function(){
alert("error");
}
});//close ajax
},
fields: {
fullname: {
validators: {
stringLength: {
min: 2,
},
notEmpty: {
message: 'Please supply your full name'
}
}
},
address: {
validators: {
stringLength: {
min: 8,
},
notEmpty: {
message: 'Please supply your street address'
}
}
},
city: {
validators: {
stringLength: {
min: 4,
},
notEmpty: {
message: 'Please supply your city'
}
}
},
state: {
validators: {
notEmpty: {
message: 'Please select your state'
}
}
},
zipcode: {
validators: {
stringLength: {
min: 5,
},
notEmpty: {
message: 'Please supply your zip code'
},
zipCode: {
country: 'US',
message: 'Please supply a vaild zip code'
}
}
},
phone: {
validators: {
notEmpty: {
message: 'Please supply your phone number'
},
phone: {
country: 'US',
message: 'Please supply a vaild phone number with area code'
}
}
},
email: {
validators: {
notEmpty: {
message: 'Please supply your email address'
},
emailAddress: {
message: 'Please supply a valid email address'
}
}
},
reason: {
validators: {
notEmpty: {
message: 'Please select what your appointment is for'
}
}
},
method: {
validators: {
notEmpty: {
message: 'Please select your preferred contact method'
}
}
},
comments: {
validators: {
stringLength: {
min: 10,
max: 200,
message:'Please enter at least 10 characters and no more than 200'
},
notEmpty: {
message: 'Please supply a description of your project'
}
}
},
}
})
});
PHP文件發送：
<?php
/**
* This example shows settings to use when sending via Google's Gmail servers.
*/
//SMTP needs accurate times, and the PHP time zone MUST be set
//This should be done in your php.ini, but this is how to do it if you don't have access to that
date_default_timezone_set('Etc/UTC');
//Contact Form Data
$fullnameField = $_POST['fullname'];
$addressField = $_POST['address'];
$cityField = $_POST['city'];
$stateField = $_POST['state'];
$zipcodeField = $_POST['zipcode'];
$phoneField = $_POST['phone'];
$emailField = $_POST['email'];
$apptReasonField = $_POST['reason'];
$apptDateField = $_POST['apptDate'];
$apptTimeField = $_POST['apptTime'];
$methodField = $_POST['method'];
$commentsField = $_POST['comments'];
require 'mailer/PHPMailerAutoload.php';
//Create a new PHPMailer instance
$mail = new PHPMailer();
//Tell PHPMailer to use SMTP
$mail->isSMTP();
//Enable SMTP debugging
// 0 = off (for production use)
// 1 = client messages
// 2 = client and server messages
$mail->SMTPDebug = 0;
//Ask for HTML-friendly debug output
$mail->Debugoutput = 'html';
//Set the hostname of the mail server
$mail->Host = 'smtp.aol.com';
// use
// $mail->Host = gethostbyname('smtp.gmail.com');
// if your network does not support SMTP over IPv6
//Set the SMTP port number - 587 for authenticated TLS, a.k.a. RFC4409 SMTP submission
$mail->Port = 587;
//Set the encryption system to use - ssl (deprecated) or tls
$mail->SMTPSecure = 'tls';
//Whether to use SMTP authentication
$mail->SMTPAuth = true;
//Username to use for SMTP authentication - use full email address for gmail
$mail->Username = "xxxxxx";
//Password to use for SMTP authentication
$mail->Password = "xxxxxxxx";
//Set who the message is to be sent from
$mail->setFrom('xxxxxxxx');
//Set who the message is to be sent to
$mail->addAddress('xxxxxxxxxx');
//Set the subject line
$mail->Subject = 'Information For Appointment Wanted';
//Read an HTML message body from an external file, convert referenced images to embedded,
//convert HTML into a basic plain-text alternative body
$mail->Body = <<<EOD
<br><p>Here is the information $fullnameField entered in your Appointment form.</p>
<br><hr><br>
<b>Name:</b> $fullnameField<hr><br>
<b>Address:</b> $addressField<hr><br>
<b>City:</b> $cityField<hr><br>
<b>State:</b> $stateField<hr><br>
<b>Zip Code:</b> $zipcodeField<hr><br>
<b>Phone #:</b> $phoneField<hr><br>
<b>E-mail:</b> $emailField<hr><br>
<b>Appointment Reason:</b> $apptReasonField<hr><br>
<b>Date Wanted For Appointment:</b> $apptDateField<hr><br>
<b>Time Wanted For Appointment:</b> $apptTimeField<hr><br>
<b>Best Way To Contact You:</b> $methodField<hr><br>
<b>Project Description:</b> $commentsField<hr><br>
EOD;
//Replace the plain text body with one created manually
$mail->AltBody = 'This is a plain-text message body';
//send the message, check for errors
if(!$mail->Send())
{
echo "Mailer Error: " . $mail->ErrorInfo;
}else{
echo "Message has been sent";
}
?>
對於一個初學者的問題，它不是太簡陋，但它仍然有點太多閱讀，但提供了一個快速的答案。目前我正在審查，所以這只是一個供參考。 – Xorifelse
@Xorifelse沒問題我非常欣賞它。 – user1236784