Recaptcha の新しいバージョン (V3) に連絡フォームを挿入したいと思います。
さまざまな解決策を探しましたが、コードの一部しか表示されないか、不完全であるか、エラーが発生します。見つかった解決策のほとんどは、非常に単純なものに対して非常に複雑で、コードがわかりません。
Recaptcha の新しいバージョン (V3) に連絡フォームを挿入したいと思います。
さまざまな解決策を探しましたが、コードの一部しか表示されないか、不完全であるか、エラーが発生します。見つかった解決策のほとんどは、非常に単純なものに対して非常に複雑で、コードがわかりません。
このフォーラムや他のフォーラムを検索して、新しいバージョンの ReCaptcha (V3) をフォームに実装しました。次の方法を知る必要がありました。
これらすべてのポイントを示す簡単な解決策が見つかりませんでした。または、Web サイトに連絡先フォームを挿入したいだけの人にとっては複雑すぎました。
最後に、複数のソリューションの一部のコードを取り上げて、単純で再利用可能なコードを使用します。このコードでは、対応するキーを挿入するだけで済みます。
ここにあります。
基本的な JS コード
<script src="https://www.google.com/recaptcha/api.js?render=your reCAPTCHA site key here"></script>
<script>
grecaptcha.ready(function() {
// do request for recaptcha token
// response is promise with passed token
grecaptcha.execute('your reCAPTCHA site key here', {action:'validate_captcha'})
.then(function(token) {
// add token value to form
document.getElementById('g-recaptcha-response').value = token;
});
});
</script>
基本的な HTML コード
<form id="form_id" method="post" action="your_action.php">
<input type="hidden" id="g-recaptcha-response" name="g-recaptcha-response">
<input type="hidden" name="action" value="validate_captcha">
.... your fields
</form>
基本的な PHP コード
if(isset($_POST['g-recaptcha-response'])){
$captcha=$_POST['g-recaptcha-response'];
}
else
$captcha = false;
if(!$captcha){
//Do something with error
}
else{
$secret = 'Your secret key here';
$response = json_decode(file_get_contents("https://www.google.com/recaptcha/api/siteverify?secret=".$secret."&response=".$captcha."&remoteip=".$_SERVER['REMOTE_ADDR']));
if($response->{'success'}==false)
{
//Do something with error
}
}
//... The Captcha is valid you can continue with the rest of your code
//... Add code to filter access using $response . score
if ($response->{'success'}==true && $response->{'score'} <= 0.5) {
//Do something to denied access
}
$response->{'score'} の値を使用してアクセスをフィルタリングする必要があります。0.0 から 1.0 までの値を取ることができます。1.0 はサイトとの最良のユーザー インタラクションを意味し、0.0 は最悪のインタラクション (ボットなど) を意味します。ReCaptcha ドキュメントでいくつかの使用例を見ることができます。
キーを追加するだけで済みます。これ以上の変更は必要ありません。
src="https://www.google.com/recaptcha/api.js?render=your reCAPTCHA site key here"
grecaptcha.execute('your reCAPTCHA site key here'
と
$secret = 'Your secret key here';
明らかに、フォームのアクションも変更する必要があります。この例では:
action = "your_action.php"
最初の回答以降、Google がドキュメントを改善したようです。これが私のやり方です。
フォームでのクライアント側の統合:
このドキュメントはこちら: https://developers.google.com/recaptcha/docs/v3
Google によると、ユーザーの行動を観察できるように、すべてのページに Recaptcha API を含める必要があります。そこで、すべてのページに含まれるフッターの最後にこの行を追加しました (パラメーターは必要ありません)。
<script src="https://www.google.com/recaptcha/api.js"></script>
フォームでは、次のように送信ボタンを使用します。
<button class="g-recaptcha" data-sitekey="PASTE-YOUR-RECAPTCHA-SITE-KEY-HERE" data-callback="onSubmit" data-action="submit">Submit Form</button>
そして、フォームを送信する次の JavaScript 関数を追加します。
function onSubmit() {
var form = document.forms[0]; // change this if you have multiple forms
if (/* possible client-side form validation code here */) {
form.submit();
}
}
サーバー側の検証コード:
このドキュメントはこちら: https://developers.google.com/recaptcha/docs/verify
このために、ヘルパー関数を作成しました。
/**
* Checks if the current script has a valid Google Captcha response token.
* @returns True, if the script has a valid repsonse token, otherwise false.
*/
function isCaptchaValid()
{
$captcha = isset($_POST['g-recaptcha-response']) ? $_POST['g-recaptcha-response'] : false;
if (!$captcha) {
return false;
}
$postdata = http_build_query(
array(
"secret" => "PASTE-YOUR-RECAPTCHA-SECRET-KEY-HERE",
"response" => $captcha,
"remoteip" => $_SERVER["REMOTE_ADDR"]
)
);
$opts = array(
'http' =>
array(
"method" => "POST",
"header" => "Content-Type: application/x-www-form-urlencoded",
"content" => $postdata
)
);
$context = stream_context_create($opts);
$googleApiResponse = file_get_contents("https://www.google.com/recaptcha/api/siteverify", false, $context);
if ($googleApiResponse === false) {
return false;
}
$googleApiResponseObject = json_decode($googleApiResponse);
return $googleApiResponseObject->success;
}
他の回答で行われたように、スコア値を確認する必要はありません。ドキュメントによると、応答オブジェクトにはスコア プロパティさえありません。調べたらありましたが使ってません。
フォームの送信を処理する PHP スクリプトの先頭で、次のように呼び出す必要があります。
if (!isCaptchaValid()) {
die("STOP! You are a bot."); // or do something else
}