Я пытаюсь внедрить ReCaptcha V3 на моем сайте. Но я выдернул несколько оставленных волосков, так как Google, похоже, вообще не заботится о документах ...
И все примеры, которые я вижу, - это простые примеры, а не то, что вы бы использовали в продукт. Мои вызовы:
- Когда я нажимаю «Отправить» 1 раз, токен почему-то не передается моему PHP, почему бы и нет?
- 2 и далее я всегда вернуть тот же "challenge_ts", почему? Маркер каждый раз отличается ...
- Наконец, просто хотел проверить, правильно ли мое предположение, что после успеха / неудачи с результатом вы не выполните JavaScript (так как это можно изменить), но только PHP код?
Вот мой индекс. html код:
<head>
<script src="https://www.google.com/recaptcha/api.js?render=xxx"></script>
</head>
<body data-spy="scroll" data-target=".fixed-top">
<!-- contact form demo container -->
<div style="max-width: 768px; margin: auto;">
<!-- contact form -->
<div class="card">
<h2 class="card-header">Contact Form</h2>
<div class="card-body">
<form id="myform" class="contact_form" method="post" action="mail.php">
<!-- form fields -->
<div class="row">
<div class="col-md-6 form-group">
<input id="name" name="name" type="text" class="form-control" placeholder="Name">
</div>
<!-- form message prompt -->
<div class="row">
<div class="col-12">
<div class="contact_msg" style="display: none">
<p>Your message was sent.</p>
</div>
</div>
</div>
<div class="col-12">
<input type="submit" value="Submit Form" class="btn btn-success" name="post">
</div>
<!-- hidden reCaptcha token input -->
<input type="hidden" id="token" name="token">
</div>
</form>
</div>
</div>
</div>
<!-- References for the opitional jQuery function to enhance end-user prompts -->
<script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
<script>
$('#myform').submit(function() {
grecaptcha.ready(function() {
grecaptcha.execute('xxx', {action: 'homepage'}).then(function(token) {
// console.log(token);
document.getElementById("token").value = token;
console.log(token);
});
});
});
</script>
<script src="form.js"></script>
</body>
</html>
А вот моя форма. js код:
(function ($) {
'use strict';
var message = $('.contact_msg');
$('.contact_form').submit(function (e) {
e.preventDefault();
// FIRST TIME NOT GRABBING DATA
var token = $('#token').val();
console.log(token);
$.ajax({
type: 'POST',
url: 'form.php',
data: { token:token}
})
.done(done_func)
.fail(fail_func);
});
// Success function
function done_func(response) {
message.fadeIn()
message.html(response);
setTimeout(function () {
message.fadeOut();
}, 50000);
// form.find('input:not([type="submit"]), textarea').val('');
}
// fail function
function fail_func(data) {
message.fadeIn()
message.html(data.responseText);
setTimeout(function () {
message.fadeOut();
}, 20000);
}
})(jQuery);
А вот и моя форма. php код:
<?php
if ($_SERVER["REQUEST_METHOD"] == "POST") {
// print_r("code:".$_POST['token']);
# BEGIN Setting reCaptcha v3 validation data
$url = "https://www.google.com/recaptcha/api/siteverify";
$data = [
'secret' => "xxx",
'response' => $_POST['token'],
'remoteip' => $_SERVER['REMOTE_ADDR']
];
$options = array(
'http' => array(
'header' => "Content-type: application/x-www-form-urlencoded\r\n",
'method' => 'POST',
'content' => http_build_query($data)
)
);
# Creates and returns stream context with options supplied in options preset
$context = stream_context_create($options);
# file_get_contents() is the preferred way to read the contents of a file into a string
$response = file_get_contents($url, false, $context);
# Takes a JSON encoded string and converts it into a PHP variable
$res = json_decode($response, true);
# END setting reCaptcha v3 validation data
print_r($response);
# Post form OR output alert and bypass post if false. NOTE: score conditional is optional, since the successful score default is set at >= 0.5 by Google. Some developers want to be able to control score result conditions, so I included that in this example.
if ($res['success'] == true && $res['score'] >= 0.5) {
// ONLY EXECUTE PHP CODE? NOT LET JAVASCRIPT DECIDE NEXT STEPS?
http_response_code(200);
echo '<p class="alert alert-success">Success!</p>';
} else {
echo '<div class="alert alert-danger">
Error! The security token has expired or you are a bot.
</div>';
}}
Тестовый сайт: https://www.citydiscovery.com.au/login/index.html
Ps, что делает "действие" при выполнении функция grecaptcha? Это имеет какое-то назначение?