Q&A
reCAPTCHAまわりの構築する上で参考にしている情報も示すと良いかも。
自作のメールフォームに、
スパム防止のためにreCAPTCHA v3を入れてみたのですが、
うまく機能しません。
お詳しい方、ご教示いただくと大変助かります。
構造は、
index.phpでメールフォームに入力
→confirm.phpに遷移して内容確認できたら送信ボタンクリック
→「送信しました」の画面に切り替わる仕組みです。
インターネットの情報を頼りに丸一日かけて試みたのですが、
知識がまだ浅く、うまくいきません。
特にわからない箇所は、最後に分けて添付しました。
こちらをどのように組み込めばいいか教えていただきたいです。
初歩的なご質問で恐縮ですが、お力をお貸しください。
php
1【index.php】 2 3<?php 4 define('SITE_KEY', 'サイトキー'); 5?> 6<!DOCTYPE html> 7<html lang="ja"> 8 <head> 9 <title>タイトル１</title> 10中略 11 <!-- reCAPTCHA v3 --> 12 <script src="https://www.google.com/recaptcha/api.js?render=<?php echo SITE_KEY; ?>"></script> 13 <script> 14 grecaptcha.ready(function() { 15 grecaptcha.execute('<?php echo SITE_KEY; ?>', {action:'homepage'}).then(function(token) { 16 var recaptchaResponse = document.getElementById('recaptchaResponse'); 17 recaptchaResponse.value = token; 18 }); 19 }); 20 </script> 21 </head> 22 23 <body> 24 <header> 25中略 26 </header> 27 <main> 28中略 29 <section class="contact_form py-5"> 30 <div class="container" id="target_point"> 31 <h1 class="bolder pb-3">以下のフォームにご記入いただき、<span class="inlineblock">「送信ボタン」をクリックしてください。</h1> 32 <p class="small text-dimgray text-center">※必要な場合をのぞいて、こちらから何度もメール<span class="inlineblock">することはございませんので、ご安心ください。<span class="inlineblock"></span></p> 33 </div> 34 <div class="contact_form_wrapper px-3"> 35 <form action="confirm.php" method="post"> 36 <div class="form_flex"> 37 <div class="form_titles"> 38 <label for="name">お名前<span class="required">必須</span></label> 39 </div> 40 <div> 41 <input type="text" id="name" class="flex-1" name="name" placeholder="山田太郎" required/> 42 </div> 43 </div> 44 45 <div class="form_flex"> 46 <div class="form_titles"> 47 <label for="job">ご職業 <span class="required">必須</span></label> 48 </div> 49 <div class="job_checkboxes"> 50中略 51 </div> 52 </div> 53 54 <div class="form_flex"> 55 <div class="form_titles"> 56 <label for="mail">メールアドレス<span class="required">必須</span></label> 57 </div> 58 <div> 59 <input id="mail" class="flex-1" type="email" name="mail" placeholder="example@mail.jp" required/> 60 </div> 61 </div> 62 63 <div class="form_flex"> 64 <div class="form_titles"> 65 <label for="comment">その他</label> 66 </div> 67 <div> 68 <textarea id="comment" class="flex-1" type="textarea" rows="5" name="message" placeholder="疑問点などがございましたらご記入ください"></textarea> 69 </div> 70 </div> 71 72 <div class="btn_wrapper"> 73 <div class="submit"> 74 <input type="submit" name="confirm" value="入力内容を確認する" /> 75 </div> 76 <div class="reset"> 77 <input type="reset" value="リセット" /> 78 </div> 79 </div> 80 <input type="hidden" name="recaptchaResponse" id="recaptchaResponse"> 81 </form> 82 </div> 83 </section> 84 85 86 </main> 87中略 88 </body> 89</html> 90
PHP
1【confirm.php】 2 3<?php 4 $page_flag = 0; 5 6 if( !empty($_POST['confirm']) ) { 7 8 $page_flag = 1; 9 10 if (isset($_POST['job']) || is_array($_POST['job'])) { 11 $your_job = implode("、", $_POST["job"]); 12 } 13 14 15 } elseif( !empty($_POST['submit']) ) { 16 17 $page_flag = 2; 18 19 // 変数とタイムゾーンを初期化 20 $header = null; 21 $auto_reply_subject = null; 22 $auto_reply_text = null; 23 24 $admin_reply_subject = null; 25 $admin_reply_text = null; 26 27 date_default_timezone_set('Asia/Tokyo'); 28 29 30 /*--------- 自動メール送信 ---------*/ 31 // ヘッダー情報を設定 32 $header = "MIME-Version: 1.0\n"; 33 $header .= "From: TEST <noreply@test.com>\n"; 34 $header .= "Reply-To: TEST <noreply@test.com>\n"; 35 36 // 件名を設定 37 $auto_reply_subject = '【自動返信テスト】お問い合わせありがとうございます。'; 38 // 本文を設定 39 $auto_reply_text = "この度は、お問い合わせ頂き誠にありがとうございます。\n下記の内容でお問い合わせを受け付けました。\n\n"; 40 $auto_reply_text .= "お問い合わせ日時：" . date("Y-m-d H:i") . "\n"; 41 $auto_reply_text .= "お名前：" . $_POST['name'] . "\n"; 42 $auto_reply_text .= "メールアドレス：" . $_POST['mail'] . "\n"; 43 $auto_reply_text .= "ご職業：" . $_POST['job'] . "\n\n"; 44 $auto_reply_text .= "その他：" . $_POST['message'] . "\n\n"; 45 $auto_reply_text .= "２営業日中に担当より返信させていただきますので、しばらくお待ちください。\n"; 46 $auto_reply_text .= "〇〇◯事務局"; 47 48 // メール送信 49 mb_send_mail( $_POST['mail'], $auto_reply_subject, $auto_reply_text, $header); 50 51 52 /*--------- 運営側にお知らせ ---------*/ 53 // 運営側へ送るメールの件名 54 $admin_reply_subject = "お問い合わせを受け付けました"; 55 56 // 本文を設定 57 $admin_reply_text = "下記の内容でお問い合わせがありました。\n\n"; 58 $admin_reply_text .= "お問い合わせ日時：" . date("Y-m-d H:i") . "\n"; 59 $admin_reply_text .= "お名前：" . $_POST['name'] . "\n"; 60 $admin_reply_text .= "メールアドレス：" . $_POST['mail'] . "\n"; 61 $admin_reply_text .= "ご職業：" . $_POST['job'] . "\n\n"; 62 $admin_reply_text .= "その他：" . $_POST['message'] . "\n\n"; 63 64 // 運営側へメール送信 65 mb_send_mail( 'XXXXX@gmail.com', $admin_reply_subject, $admin_reply_text, $header); 66 67 } 68?> 69 70 71 72 <!DOCTYPE html> 73 <html lang="ja"> 74 <head> 75中略 76 <title>確認ページ</title> 77 </head> 78 <body> 79 <main> 80 <section class="contact_form"> 81 82 <?php if( $page_flag === 1 ): ?> 83 84 <div class="container"> 85 <h1 class="bolder pb-3">以下の内容でよろしければ、下の<span class="inlineblock">「送信する」をクリックしてください。</span></h1> 86 </div> 87 <div class="contact_form_wrapper px-3"> 88 <form class="confirm_form" action="" method="post"> 89中略 90 <div class="btn_wrapper"> 91 <p class="submit"> 92 <input type="submit" name="submit" value="送信する" /> 93 </p> 94 <p class="goback"> 95 <button type="button" onclick=history.back() name="goback" value="もどる" />もどる</button> 96 </p> 97 </div> 98 <input type="hidden" name="name" value="<?php echo $_POST['name']; ?>"> 99 <input type="hidden" name="job" value="<?php echo $your_job; ?>"> 100 <input type="hidden" name="mail" value="<?php echo $_POST['mail']; ?>"> 101 <input type="hidden" name="message" value="<?php echo $_POST['message']; ?>"> 102 <input type="hidden" name="recaptchaResponse" id="recaptchaResponse"> 103 </form> 104 </div> 105 106 <?php elseif( $page_flag === 2 ): ?> 107 108 <div class="mail_done"> 109 <div class="container"> 110 <h1 class="bolder pb-3">送信完了しました。</h1> 111 <p class="small text-dimgray text-center">２営業日以内に担当よりご連絡させて頂きますので、しばらくお待ちください。<span class="inlineblock"></span></p> 112 <a class="to_top" href="index.php">トップページにもどる</a> 113 </div> 114 </div> 115 116 <?php else: ?> 117 <?php endif; ?> 118 119 </section> 120 121 122中略 123 124 </body> 125</html> 126
php
1 2 3if (isset($_POST['recaptchaResponse']) && !empty($_POST['recaptchaResponse'])){ 4 $secret = '<?php echo SECRET_KEY; ?>'; 5 $verifyResponse = file_get_contents('https://www.google.com/recaptcha/api/siteverify?secret='.$secret.'&response='.$_POST['recaptchaResponse']); 6 $reCAPTCHA = json_decode($verifyResponse); 7 if ($reCAPTCHA->success){ 8 9 } 10 else 11 { 12 // NG 13 } 14} 15else 16{ 17 // ERROR 18}
ありがとうございます。
今回参考にした主なサイトは、以下です。
https://developers.google.com/recaptcha/docs/v3
https://knowledge.moshimore.jp/entry/recaptcha_introduction
「うまく機能しません」では伝わらないので、より具体的に。一部をぼかしたスクショなども有効ですよ。
ありがとうございます。
表現が曖昧でした。
「全く反映されません」が正しいです。
画面にrecaptchaマークも出ません。
Web ブラウザの開発者ツールで、JavaScript のエラーが出ていたりしないですか？
いま出先でして、明日確認してご報告します、ありがとうございます。
画像を追加しました。
Uncaught Error: Invalid site key or not loaded in api.js: "サイトキー"
とエラーが出ています。記載のサイトキーに間違いは無いので、apj.jsがロードされていないということでしょうか。
あなたの回答
tips
プレビュー
