将 reCAPTCHA v3 添加到帝国CMS 的 PHP表单并使用Ajax提交
首先,你需要在你的CMS中的表单页面添加reCAPTCHA元素,并确保你已经在reCAPTCHA管理后台获取了站点的密钥。
<form id="your-form">
<!-- 其他表单字段 -->
<div class="g-recaptcha" data-sitekey="你的site_key"></div>
<button type="submit">提交</button>
</form>
<script src="https://www.google.com/recaptcha/api.js?render=你的site_key"></script>
<script>
grecaptcha.ready(function() {
document.getElementById('your-form').addEventListener('submit', function(event) {
event.preventDefault();
grecaptcha.execute('你的site_key', {action: 'submit_form'}).then(function(token) {
// 使用AJAX提交表单和reCAPTCHA token
var xhr = new XMLHttpRequest();
xhr.open('POST', 'path/to/your/php/script.php', true);
xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
xhr.onload = function() {
if (this.status == 200) {
// 处理响应
console.log(this.responseText);
}
};
xhr.send('recaptcha_token=' + token + '&' + new FormData(document.getElementById('your-form')));
});
});
});
</script>
然后,在你的PHP脚本中,你需要验证reCAPTCHA响应:
<?php
$recaptcha_token = $_POST['recaptcha_token'];
$response = file_get_contents("https://www.google.com/recaptcha/api/siteverify?secret=你的secret_key&response=" . $recaptcha_token);
$response = json_decode($response);
if ($response->success) {
// 验证成功,处理表单数据
// 例如:保存数据到数据库
echo "表单数据验证成功,可以进行后续处理";
} else {
// 验证失败
echo "表单数据验证失败";
}
?>
确保替换你的site_key
和你的secret_key
为实际的reCAPTCHA密钥。这个例子展示了如何在提交表单时使用AJAX和reCAPTCHA进行验证,避免了页面刷新。
评论已关闭