我在我的网站上使用 Google 重新验证码。当代码正确时，验证码就会起作用。页面刷新并向下滚动到正确的位。
如果代码输入不正确，页面就会“中断”。它不会向下滚动到正确的部分，并且验证码会停止页面加载的其余部分。
我用于重新验证的代码是标准 php 代码 - https://developers.google.com/recaptcha/docs/php?csw=1
网站在这里 - 如果您去下订单，填写表格，并使用正确和错误的代码进行尝试，这应该会让您更好地了解我的意思。
如果您需要网站上的任何代码，请直接说出来。
我将整个订单页面部分放在下面，因为大多数代码在页面运行时不会显示。
网站 - mk18.web44.net
谢谢
编辑后的代码:
<section id="order" class="section mtcon">
<!-- heading -->
<div class="row">
<h2 class="mtcon-title">Place an Order</h2>
<div class="span8 short-dec">
<div id="mainContent">
<div class="ordercontent">
<?php
$date = date('d-m-Y H:m:s',time());
if ($_POST)
{
require_once('recaptchalib.php');
$privatekey = "KEY";
$resp = recaptcha_check_answer ($privatekey,
$_SERVER["REMOTE_ADDR"],
$_POST["recaptcha_challenge_field"],
$_POST["recaptcha_response_field"]);
if (!$resp->is_valid)
{
$error= "<p class='highlighted'><img src='images/recaptcha_logo.gif' width='96' height='56' alt='reCAPTCHA logo' style='float: left; margin: 0 5px 0 0;' /><br / <strong>SORRY</strong> - The reCAPTCHA words were not entered correctly. <br /><a href='javascript:history.back(1);'>Please return to the form</a> and try again.</p>";
}
$path = "enquirydata/";
$filename = 'orderdata.txt';
$thefile = fopen($path.$filename, 'append');
while(list($key, $value) = each ($_POST))
{
fwrite($thefile, $value."|");
}
fwrite($thefile, "\r\n");
fclose($thefile);
$toMail = 'MAIL'; // your email address
// $toMail = 'MAIL'; // For TESTING ONLY
$ccMail = 'MAIL'; // carbon copy - leave empty if you don't use it
$bccMail = 'MAIL'; // blind carbon copy
$mailSub = 'MK18 - order for '.$_POST['advert']; // the subject of the email
$thanksPage = $_SERVER['#order']; // the URL of the thank you page.
if(strstr($_POST['Email_Address'], '@'))
{
if(isset($_POST['Email_Address'])){
$mailBody = "Many thanks for your order.\r\n";
$mailBody .= "\r\n";
$mailBody .= "Order Details: \r\n";
$mailBody .= "\r\n";
foreach ($_POST as $field => $input) {
if(strtolower($field) != 'submit' && strtolower($field) != 'reset' && strtolower($field) != 'recaptcha_challenge_field' && strtolower($field) != 'recaptcha_response_field'){
$mailBody .= ucfirst ($field) ." : ". trim(strip_tags($input)) . " \r\n";
}
}
//===============================================================
$mailBody .= "\r\n";
$mailBody .= "\r\n";
$mailBody .= "If payment is not yet complete, please use Stripe or post a cheque, along with a copy of the above details, to the address provided on the web site.\r\n";
$mailBody .= "\r\n";
$mailBody .= "Thanks again for your purchase.\r\n";
$mailBody .= "MK18\r\n";
$mailBody .= "www.mk18.co.uk\r\n";
$mailBody .= "\r\n";
//===============================================================
$usrMail = $_POST['Email_Address'];
$headers = "From:$usrMail\r\n";
$headers .= "cc:$ccMail\r\n";
$headers .= "bcc:$bccMail\r\n";
$headers .= "Content-type: text/plain\r\n";
$sendRem = mail($toMail, $mailSub, $mailBody, $headers);
}
?>
<h1>Thank you for your order!</h1>
<?php
$item=$_POST['advert'];
if($_POST['design_service']=="I would like the MK18 Design Service")
{
$item=$_POST['advert']." with Design Service";
}
?>
<p><strong>Order Summary:</strong></p>
<div class="formfield"><div class="formlabelwide"><?php echo $_POST['advert']; ?></div>£<input type="text" value="<?php echo number_format($_POST['ad_charge'],2); ?>" size="7" readonly class="plaintextbox" /></div>
<div class="formfield"><div class="formlabelwide">Design Service</div>£<input type="text" value="<?php echo number_format($_POST['design_charge'],2); ?>" size="7" readonly class="plaintextbox" /></div>
<div class="formfield"><div class="formlabelwide">VAT</div>£<input type="text" value="<?php echo number_format($_POST['vat'],2); ?>" size="7" readonly class="plaintextbox" /></div>
<div class="formfield"><div class="formlabelwide">Credit Card Fee</div>£<input type="text" value="<?php echo number_format($_POST['card_fee'],2); ?>" size="7" readonly class="plaintextbox" /></div>
<div class="formfield"><div class="formlabelwide">Grand Total</div>£<input type="text" value="<?php echo number_format($_POST['grand_total'],2); ?>" size="7" readonly class="plaintextbox" /></div>
<p> </p>
<?php
if($_POST['payment_method']=="PayPal")
{
?>
<form action="charge.php" method="POST" >
<input type="hidden" name="stripeToken2" value="<?php echo($_POST['grand_total'])*100 ?>" />
<input type="hidden" name="stripeToken3" value="<?php echo $_POST['Email_Address'] ?>" />
<script
src="https://checkout.stripe.com/v2/checkout.js" class="stripe-button"
data-key="KEY"
data-amount="<?php echo($_POST['grand_total'])*100 ?>"
data-name="<?php echo $item; ?>"
data-description=""
data-image="/128x128.png">
</script>
</form>
<FORM><INPUT Type="button" VALUE="Cancel Order" onclick="javascript:window.location.href='http://www.mk18.web44.net'" /></FORM>
<?php
}
else if($_POST['payment_method']=="Cardless")
{
?>
<?php
// Include the library
include_once 'lib/GoCardless.php';
// Uncomment this and change your keys over to go live - but make
// sure you test in sandbox first!
//GoCardless::$environment = 'production';
// Set config vars
$account_details = array(
'app_id' => 'KEY',
'app_secret' => 'KEY',
'merchant_id' => 'KEY',
'access_token' => 'KEY'
);
// Initialize GoCardless
GoCardless::set_account_details($account_details);
// The parameters for the payment
$subscription_details = array(
'amount' => ($_POST['grand_total']), // I want this to display the amount inside the variable grand_total
);
// Generate the url
//$subscription_url = GoCardless::new_subscription_url($subscription_details);
$subscription_url = GoCardless::new_bill_url($subscription_details);
// Display the link
echo '<a href="'.$subscription_url.'"><img src="https://s3-eu-west-1.amazonaws.com/gocardless/images/public/buttons/updated/pay-with-gc-small.png" width="200" height="32"></a>';
?>
<FORM><INPUT Type="button" VALUE="Cancel Order" onclick="javascript:window.location.href='http://www.mk18.web44.net'" /></FORM>
<?php
}
else
{
echo "<strong>Please make your payment directly to MK18</strong>";
}
?>
<div class="spacer"></div>
<?php
}
}
else
{
?>
<form enctype="multipart/form-data" action='#order' method="post" onsubmit="return validate()" id="orderform" name="first-form">
<div class="enquiryform">
<div class="formfield"><label for="advert" class="formlabel">Advert</label><select name="advert" id="advert" onchange="calculate('');">
<option value="">Please select the advert required</option>
<option value="Back Cover Display Advert (Full Page)">Back Cover Display Advert (216mm x 154mm)</option>
<option value="Inside Front Cover Display Advert (Full Page) - 1 issue">Inside Front Cover Display Advert (Full Page - 136mm x 190mm) - 1 issue</option>
<option value="Inside Front Cover Display Advert (Full Page) - 2 issues">Inside Front Cover Display Advert (Full Page - 136mm x 190mm) - 2 issues</option>
<option value="Inside Front Cover Display Advert (Full Page) - 3 issues">Inside Front Cover Display Advert (Full Page - 136mm x 190mm) - 3 issues</option>
<option value="Inside Front Cover Display Advert (Half Page) - 1 issue">Inside Front Cover Display Advert (Half Page - 136mm x 93mm) - 1 issue</option>
<option value="Inside Front Cover Display Advert (Half Page) - 2 issues">Inside Front Cover Display Advert (Half Page - 136mm x 93mm) - 2 issues</option>
<option value="Inside Front Cover Display Advert (Half Page) - 3 issues">Inside Front Cover Display Advert (Half Page - 136mm x 93mm) - 3 issues</option>
<option value="Inside Back Cover Display Advert (Full Page) - 1 issue">Inside Back Cover Display Advert (Full Page - 136mm x 190mm) - 1 issue</option>
<option value="Inside Back Cover Display Advert (Full Page) - 2 issues">Inside Back Cover Display Advert (Full Page - 136mm x 190mm) - 2 issues</option>
<option value="Inside Back Cover Display Advert (Full Page) - 3 issues">Inside Back Cover Display Advert (Full Page - 136mm x 190mm) - 3 issues</option>
<option value="Inside Back Cover Display Advert (Half Page) - 1 issue">Inside Back Cover Display Advert (Half Page - 136mm x 93mm) - 1 issue</option>
<option value="Inside Back Cover Display Advert (Half Page) - 2 issues">Inside Back Cover Display Advert (Half Page - 136mm x 93mm) - 2 issues</option>
<option value="Inside Back Cover Display Advert (Half Page) - 3 issues">Inside Back Cover Display Advert (Half Page - 136mm x 93mm) - 3 issues</option>
<option value="Full Page Display Advert (136mm x 190mm) - 1 issue">Full Page Display Advert (136mm x 190mm) - 1 issue</option>
<option value="Full Page Display Advert (136mm x 190mm) - 2 issues">Full Page Display Advert (136mm x 190mm) - 2 issues</option>
<option value="Full Page Display Advert (136mm x 190mm) - 3 issues">Full Page Display Advert (136mm x 190mm) - 3 issues</option>
<option value="Full Page Display Advert (136mm x 190mm) - 6 issues">Full Page Display Advert (136mm x 190mm) - 6 issues</option>
<option value="Half Page Display Advert (136mm x 93mm) - 1 Issue">Half Page Display Advert (136mm x 93mm) - 1 Issue</option>
<option value="Half Page Display Advert (136mm x 93mm) - 2 Issues">Half Page Display Advert (136mm x 93mm) - 2 Issues</option>
<option value="Half Page Display Advert (136mm x 93mm) - 3 Issues">Half Page Display Advert (136mm x 93mm) - 3 Issues</option>
<option value="Half Page Display Advert (136mm x 93mm) - 6 Issues">Half Page Display Advert (136mm x 93mm) - 6 Issues</option>
<option value="Quarter Page Display Advert (66mm x 93mm) - 1 issue">Quarter Page Display Advert (66mm x 93mm) - 1 issue</option>
<option value="Quarter Page Display Advert (66mm x 93mm) - 2 issues">Quarter Page Display Advert (66mm x 93mm) - 2 issues</option>
<option value="Quarter Page Display Advert (66mm x 93mm) - 3 issues">Quarter Page Display Advert (66mm x 93mm) - 3 issues</option>
<option value="Quarter Page Display Advert (66mm x 93mm) - 6 issues">Quarter Page Display Advert (66mm x 93mm) - 6 issues</option>
<option value="Eighth Page Display Advert (66mm x 44.5mm) - 2 issues">Eighth Page Display Advert (66mm x 44.5mm) - 2 issues</option>
<option value="Eighth Page Display Advert (66mm x 44.5mm) - 3 issues">Eighth Page Display Advert (66mm x 44.5mm) - 3 issues</option>
</select>
<input type="hidden" name="ad_charge" id="ad_charge" value="" />
</div>
<div class="formfield"><div class="formlabel">Design Service <a href="#order" class="help"><img alt="Help" src="img/help.png">
<span>
Design Service (£20): If you don't already have an advert or image, then why not use our expertise to produce a design to help your business stand out from the rest. Our professional design service will produce an advert to your specifications. This also includes any changes to your advert during the course of your advertising package.
</span>
</a></div><input type="checkbox" value="I would like the MK18 Design Service" name="design_service" id="design_service" class="checkbox" onclick="calculate('orderform');" /><label for="design_service">I would like the MK18 Design Service (£20+vat)</label>
<input type="hidden" name="design_charge" id="design_charge" value="" />
</div>
<div class="formfield"><div class="formlabel">Premium Page <a href="#order" class="help"><img border="0" alt="Help" src="img/help.png">
<span>
<p> If you would like to book a Premium page , please contact MK18 on 01280 860458 to check availability.</p>
</span>
</a></div><input type="checkbox" value="I would like a Premium Page" name="premium_page" id="premium_page" class="checkbox" onclick="calculate('orderform');" /><label for="premium_page">I would like to book a Premium Page</label>
<input type="hidden" name="premium_charge" id="premium_charge" value="" />
</div>
<div class="formfield"><label for="sub_total" class="formlabel">Sub-total</label><input type="text" name="sub_total" id="sub_total" value="0" size="7" readonly class="plaintextbox" /></div>
<div class="formfield"><label for="vat" class="formlabel">Vat</label>
<input type="text" name="vat" id="vat" value="0" size="7" readonly class="plaintextbox" /></div>
<div class="formfield"><label for="total" class="formlabel">Total</label>
<input type="text" name="total" id="total" value="0" size="7" readonly class="plaintextbox" /></div>
<div class="formfield"><label for="payment_method" class="formlabel">Payment Method</label><select name="payment_method" id="payment_method" onchange="calculate('');">
<option value="">Please select your payment method</option>
<option value="PayPal">Credit Card (via Stripe)</option>
<option value="Cardless">I will make a BACS payment direct to your bank account (via GoCardless)</option>
<option value="Bank Transfer">I will send payment by cheque prior to the copy deadline date</option>
</select><br />
Please note: if paying by Credit Card there is a Stripe fee of 2.4% + £0.24
</div>
<div class="formfield">
<label for="card_fee" class="formlabel">Stripe / GoCardless Fee</label>
<input type="text" name="card_fee" id="card_fee" value="0" size="7" readonly class="plaintextbox" /></div>
<div class="formfield"><label for="grand_total" class="formlabel">Grand Total</label><input type="text" name="grand_total" id="grand_total" value="0" size="7" readonly class="plaintextbox" /></div>
<div class="formfield"><label for="start_issue" class="formlabel">Issue to start</label><input type="text" name="start_issue" id="start_issue" size="30" /></div>
<div class="formfield"><label for="artwork" class="formlabel">Artwork / Copy</label><select name="artwork" id="artwork">
<option value="">Please select your artwork / copy status</option>
<option value="Already_supplied">I have already supplied my artwork / copy</option>
<option value="To_be_supplied">I will supply new artwork / copy</option>
<option value="To_be_supplied">I would like to use the MK18 Design Service at a cost of £20 plus VAT</option>
</select>
</div>
<div class="formfield"><label for="Name" class="formlabel">Name</label><input type="text" name="Name" id="Name" size="50" /></div>
<div class="formfield"><label for="Email_Address" class="formlabel">Email</label><input type="text" name="Email_Address" id="Email_Address" size="50" /></div>
<div class="formfield"><label for="phone" class="formlabel">Phone</label><input type="text" name="phone" id="phone" size="50" /></div>
<div class="formfield"><label for="address1" class="formlabel">Address Line 1</label><input name="address1" id="address1" type="text" size="50" /></div>
<div class="formfield"><label for="address2" class="formlabel">Address Line 2</label><input name="address2" id="address2" type="text" size="50" /></div>
<div class="formfield"><label for="city" class="formlabel">City/Town</label><input type="text" name="city" id="city" size="50" /></div>
<div class="formfield"><label for="county" class="formlabel">County/Province</label><input type="text" name="county" id="county" size="50" /></div>
<div class="formfield"><label for="postalcode" class="formlabel">Postal Code</label><input type="text" name="postalcode" id="postalcode" size="20" /></div>
<div class="formfield"><label for="notes" class="formlabel">Special notes</label><textarea rows="3" name="notes" id="notes" cols="50"></textarea></div>
<div class="formfield">
<div class="formlabel" style="width: 180px; font-weight: normal; font-size: 10px;">This "Captcha" device helps prevent automated programs and spammers from abusing this contact form. Please complete the game. If you would like a fidderent game, please click the reload button (<img src="img/reload.png" width="12" height="14" alt="reload button" style="margin: 0 1px; vertical-align: middle;" />) which is just below the game:</div>
<script type="text/javascript">
var RecaptchaOptions = {
theme : 'white'
};
</script>
<div style="float: right; width: 330px; text-align: left;">
<?php
require_once('recaptchalib.php');
$publickey = "6Lf9RucSAAAAAH9rHa-efXtHt9MNRtB3bc_JVfgE"; // you got this from the signup page
echo recaptcha_get_html($publickey);
?>
<?php
if (isset($error)) echo $error;
?>
</div>
<div class="separator"></div>
</div>
<div class="formfield" style="text-align: center;"><input type="submit" name="submit" id="submit" value="Place Order" class="button" /></div>
<div class="spacer"></div>
<div class="paypalcenter" id="secureordering">
<img src="img/PaymentMethods/mastercard.png" width="53" height="35" alt="We accept Mastercard" style="margin: 0;" />
<img src="img/PaymentMethods/maestro.png" width="53" height="35" alt="We accept Maestro" style="margin: 0;" />
<img src="img/PaymentMethods/visa.png" width="53" height="35" alt="We accept Visa" style="margin: 0;" />
<img src="img/PaymentMethods/delta.png" width="53" height="35" alt="We accept Visa Delta" style="margin: 0;" />
<img src="img/PaymentMethods/solo.png" width="53" height="35" alt="We accept Solo" style="margin: 0;" />
<img src="img/PaymentMethods/americanexpress.png" width="53" height="35" alt="We accept American Express" style="margin: 0;" />
<img src="img/PaymentMethods/stripe.png" width="53" height="35" alt="Secure online payments by PayPal" style="margin: 0;" />
<img src="img/PaymentMethods/gocard.png" width="53" height="35" alt="Secure online payments by PayPal" style="margin: 0;" /><br />
<span class="smaller">Secure Online Ordering</span>
</div><!-- /secure ordering -->
<div class="separator"></div>
</div><!-- /enquiryform -->
</form>
<?php
}
?>
</div>
<!-- Oli EDIT Pasted .ordercontent into #mainContent -->
<!-- Oli EDIT End pasted .ordercontnet -->
<!-- menu begins -->
<!-- menu ends -->
<div class="separator"></div>
<hr />
<h3 class="titles2">Your Privacy</h3>
<p class="titles2 c4">MK18 are committed to protecting your privacy and we comply with the Data Protection laws applicable to the UK.</p>
<p class="titles2 c4">Unless otherwise advised, only MK18 will have access to the information you submit.</p>
<p class="titles2 c4">Your details will not be passed or sold to other companies for marketing or mailing purposes.</p>
<p class="titles2 c4">We do use the information we collect about you to process your requests and to provide you a more personalised service.</p>
<p class="titles2 c4">We monitor web site traffic patterns and usage to help us determine which aspects are of most importance to you and to develop the web site design and its layout.</p>
<p class="titles2 c4">We may also use the information we collect, occasionally, to tell you about our progress and changes to the MK18 web site. If you would rather not receive this information, please indicate your wishes when submitting on-line forms or you may send an e-mail to <a href="mailto:info@mk18.co.uk">info@mk18.co.uk</a>.</p>
<hr />
<!-- end #mainContent --></div>
<!-- This clearing element should immediately follow the #mainContent div in order to force the #container div to contain all child floats --><br class="clearfloat" />
<!-- end #footer --></div>
</div>
</section>
最佳答案
我还没有去过你的网站来测试它，但我怀疑如果 reCAPTCHA 不正确，你不想die()，因为这只会在此时终止脚本。您可能最好将错误消息存储在变量中，然后将其输出到表单中？
那么，您目前所处的位置:
if (!$resp->is_valid)
{
die ("<p class='highlighted'><img src='images/recaptcha_logo.gif' width='96' height='56' alt='reCAPTCHA logo' style='float: left; margin: 0 5px 0 0;' /><br /><strong>SORRY</strong> - The reCAPTCHA words were not entered correctly. <br /><a href='javascript:history.back(1);'>Please return to the form</a> and try again.</p>");
}
您可能需要的是:
if (!$resp->is_valid)
{
$error= "<p class='highlighted'><img src='images/recaptcha_logo.gif' width='96' height='56' alt='reCAPTCHA logo' style='float: left; margin: 0 5px 0 0;' /><br / <strong>SORRY</strong> - The reCAPTCHA words were not entered correctly. <br /><a href='javascript:history.back(1);'>Please return to the form</a> and try again.</p>";
}
然后在哪里显示表单:
<?php
if (isset($error)) echo $error;
?>
让用户知道他们的验证码有误。
因此最终的代码可能遵循以下结构:
<section id="order" class="section mtcon">
<!-- heading -->
<div class="row">
<h2 class="mtcon-title">Place an Order</h2>
<div class="span8 short-dec">
<div id="mainContent">
<div class="ordercontent">
<?php
$date = date('d-m-Y H:m:s',time());
if ($_POST)
{
require_once('recaptchalib.php');
$privatekey = "KEY";
$resp = recaptcha_check_answer ($privatekey,
$_SERVER["REMOTE_ADDR"],
$_POST["recaptcha_challenge_field"],
$_POST["recaptcha_response_field"]);
if (!$resp->is_valid)
{
// CAPTCHA is invalid, store an error message and stop processing the $_POST
$error= "<p class='highlighted'><img src='images/recaptcha_logo.gif' width='96' height='56' alt='reCAPTCHA logo' style='float: left; margin: 0 5px 0 0;' /><br / <strong>SORRY</strong> - The reCAPTCHA words were not entered correctly. <br /><a href='javascript:history.back(1);'>Please return to the form</a> and try again.</p>";
}
else
{
// <snipped> This is where you process the form, send the email etc., as before
}
}
// First visit to the page or there was an error with the CAPTCHA
// NOTE: We can't use the else anymore as we might want to process the top section AND this section
if (!$_POST || isset($error))
{
// <snipped> the original form
}
?>
</div>
<!-- ... and the rest of the page ... -->
关于javascript - Recaptcha 导致部分页面加载，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/19140012/