【reCAPTCHA V3】の実装と検証について
解決したいこと
WordPressにて【Contact Form 7】のプラグインを使用した「お問い合わせ」ページに【reCAPTCHA V3】の実装を試みたのですが、
Google reCAPTCHAの簡易コンソール画面で確認したところ、
「注: ライブ トラフィックがまだ十分にないサイトでは、スコアが正確でない可能性があります。詳しくは、Google のデベロッパー サイトをご覧ください。」と表示が出ました。
まず、調べてみたのですが「ライブ トラフィックがまだ十分にないサイト」の意味がわかりません。どういう状況を差すのでしょうか？
PHP等のコードに誤りがあるということでしょうか？
又、「リクエスト」と「スコア」も【reCAPTCHA V3】を設置してから２日ぐらいはちゃんと動作しているように見受けられたのですが、それ以降は何も動作していないように見えます。
これはトークンの期限切れ？というやつでしょうか・・・それとも何かソースコードが不十分ということなのでしょうか？
今回は「【reCAPTCHA V3】を実装するプラグインを使わずにPHPで」との指示でして、PHPでちゃんと動作するように実装して検証までしたいと考えております。
下記に[page-content.php]及び[Contact Form 7]に記載したソースコードを貼り付けていますので、どこに問題があるか解決策のご教授をしていただけたら幸いです。
また、検証の仕方も、調べてもイマイチわからず、おすすめの記事が載っているサイトがありましたらご教示いただけたら幸いです。
発生している問題・エラー
該当するソースコード
お問い合わせ[page-contact.php]は下記の通りです。
※'サイトキー'と'シークレットキー'は実際にはちゃんと取得したものを貼り付けてあります。
<?php
// サイトキーを入力
$key = 'サイトキー';
// シークレット キーを入力
$secretKey = 'シークレットキー';
if (isset($_POST['your-company']) && isset($_POST['your-name']))
{
$Response = file_get_contents('https://www.google.com/recaptcha/api/siteverify?secret='.$secretKey.'&response='.$_POST['g-recaptcha-response']);
$result = json_decode($Response);
if ($result->success)
{
$message = 'success';
$status = 'success';
}
else
{
$message = $result->{'error-codes'}[0];
$status = 'danger';
}
}
?>
<?php get_header(); ?>
<main>
<section id="contact">
<div class="breadcrumbBox">
<ul class="breadcrumb">
<li class="">HOME</li>
<li class="">お問い合わせ</li>
</ul>
</div>
<div class="boxTtl">
<h2 class="">お問い合わせ</h2>
</div>
</section>
<section id="contactBox">
<div class="contactTxtBox">
<p class="contactTxtTop">お気軽にお問い合わせください。</p>
<p class="contactTxtBottom">お電話でのお問い合わせ<br>
TEL 000-0000-0000</p>
</div>
<?php echo do_shortcode('[contact-form-7 id="99" title="コンタクトフォーム 1"]'); ?>
</section>
</main>
<?php get_footer(); ?>
<script src="https://www.google.com/recaptcha/api.js?render=<?php echo $key ?>"></script>
<script>
grecaptcha.ready(function() {
grecaptcha.execute('<?php echo $key ?>', {action:'wpcf7_submit'}).then(function(token) {
var reCAPTCHA = document.getElementById('recaptcha');
reCAPTCHA.value = token;
});
});
</script>
下記は[Contact Form 7]プラグイン内に記述した、ソースコードです。
<div class="form">
<div class="formItem cf fi">
<p class="formItemLabel cf">会社名<span class="must">必須</span></p>
<labe>[text* your-company class:formItemInput]</label>
</div>
<div class="formItem cf fi">
<p class="formItemLabel">お名前<span class="must">必須</span></p>
<labe>[text* your-name class:formItemInput]</label>
</div>
<div class="formItem cf fi">
<p class="formItemLabel">フリガナ<span class="must">必須</span></p>
<label>[text* your-kana class:formItemInput]</label>
</div>
<div class="formItem cf fi">
<p class="formItemLabel">メールアドレス<span class="must">必須</span></p>
<label>[email* your-email class:formItemInput]</label>
</div>
<div class="formItem cf fi">
<p class="formItemLabel">お電話番号<span class="must">必須</span></p>
<label>[tel* your-tel class:formItemInput]</label>
</div>
<div class="formItem cf fi">
<p class="formItemLabel">ご住所</p>
<label>[text your-address class:formItemInput]</label>
</div>
<div class="formItem cf fi">
<p class="formItemLabel isMsg">お問い合わせ内容<span class="must">必須</span></p>
<label>[textarea* your-message class:formItemTextarea]</label>
</div>
<div class="wpBtn">
<input type="hidden" name="recaptchaResponse" id="recaptchaResponse" />
[confirm class:formBtn class:fi "確認する"][back "修正する"][submit class:formBtn class:fi "送信する"]
</div>
</div>
以下のソースコードは今回の件とは全く関係ないかと思いますが、
念のため[function.php]も記載いたします。
<?php
function wpcf7_validate_spam_message( $result, $tag ) {
$value = str_replace(array(PHP_EOL,' '), '', esc_attr($_POST['your-message']));
if (!empty($value)) {
if (preg_match('/^[!-~]+$/', $value)) {
$result['valid'] = false;
$result['reason'] = array('your-message' => '日本語で入力してください');
}
}
return $result;
}
add_filter( 'wpcf7_validate', 'wpcf7_validate_spam_message', 10, 2 );
?>
※とある案件のために、現在個人で製作したサイトで試運転を試みております。（Googleコンソールには登録しておりません。）
