Ajax＆Google reCaptcha

Question

私はreCaptchaを私のウェブサイトの退院フォームに追加しようとしています。私はそれを行う方法についてのビデオチュートリアルに従ってきましたが、私はajaxを使用してPHPファイルを呼び出すフォームで実際にフォームを送信しないように、フォームに適合させるのに苦労しています。私は以前の質問で示唆したいくつかを試しましたが、意図した結果を得ず、代わりに「私はロボットが好きではありません」と表示して登録ページに表示します。あなたが何かを考えることができるなら、いくつかのヒント/示唆は素晴らしいでしょう。

<div class="g-recaptcha" data-sitekey="6LcXMg0UAAAAABmlDlOGa6onxqqzERZ483XOJbFm"></div> 

Javascriptを

function Register(){ 
     var Forename = $("#txtForename").val(); 
     var Surname = $("#txtSurname").val(); 
     var Password = $("#txtPassword").val(); 
     var PasswordR = $("#txtPasswordR").val(); 
     var response = $("#g-recaptcha").val(); 
      $.post('functions/php/fncregister.php', {Forename: Forename, Surname: Surname, Password: Password, PasswordR: PasswordR, response: response}, function(data) { 
       var returnValue = JSON.parse(data); 
       if (returnValue['data'] == 0){ 
        $('#mdlInfo').html('<p>Your account has been created under the username: <strong><span id="spnUsername">'+returnValue['username']+'</span></strong>. You <strong>must</strong> remember this as you will require it to log into your account.</p><p>Your account has also been added to a moderation que. <strong>You must wait until a member of staff activates your account!</strong></p>'); 
        $("#mdlRegister").modal("show"); 
       } 
       else if (returnValue['data'] == 1){ 
        $('#divError').html('<p class="text-center text-danger bg-danger" id="pUPInc">Passwords did not match!</p>'); 
       } 
       else if (returnValue['data'] == 3){ 
        $('#divError').html('<p class="text-center text-danger bg-danger" id="pUPInc">An error occured when adding your details to the Database!</p>'); 
       } 
       else if (returnValue['data'] == 4){ 
        $('#divError').html('<p class="text-center text-danger bg-danger" id="pUPInc">I don\'t like Robots!</p>'); 
       } 
      }); 
    } 

PHPここ

<?php 
//Retrieves variables from Javascript. 
$Forename = $_POST["Forename"]; 
$Surname = $_POST["Surname"]; 
$Password = $_POST["Password"]; 
$PasswordR = $_POST["PasswordR"]; 

//reCaptcha 
$Url = "https://www.google.com/recaptcha/api/siteverify"; 
$SecretKey = "---KEY---"; 
$Response = file_get_contents($Url."?secret=".$SecretKey."&response=".$_POST['response']."remoteip=".$_SERVER['REMOTE_ADDR']); 
$Robot = json_decode($response); 

$data = 0; 

if(isset($Robot->success) AND $Robot->success==true){ 
    //OTHER CODE 
} 

else{ 
    //This code always runs (though this is only meant to happen if reCaptcha detects a robot. 
    $data = 4; 
     echo json_encode(["data"=>"$data"]); 
?> 

Answer 1

私はそれが動作するようになったが、私はどうやったのか、非常にわかりません。

最初に、Javascriptに新しい変数 "Response"を追加し、ドキュメントに記載されている関数を使用して、ユーザーがロボットでないことを証明したときに返されるキーの値を取得しました。

function Register(){ 
    var Forename = $("#txtForename").val(); 
    var Surname = $("#txtSurname").val(); 
    var Password = $("#txtPassword").val(); 
    var PasswordR = $("#txtPasswordR").val(); 
    var Response = grecaptcha.getResponse(); 
     $.post('functions/php/fncregister.php', {Forename: Forename, Surname: Surname, Password: Password, PasswordR: PasswordR, Response: Response}, function(data) { 
      var returnValue = JSON.parse(data); 
      if (returnValue['data'] == 0){ 
       $('#mdlInfo').html('<p>Your account has been created under the username: <strong><span id="spnUsername">'+returnValue['username']+'</span></strong>. You <strong>must</strong> remember this as you will require it to log into your account.</p><p>Your account has also been added to a moderation que. <strong>You must wait until a member of staff activates your account!</strong></p>'); 
       $("#mdlRegister").modal("show"); 
      } 
      else if (returnValue['data'] == 1){ 
       $('#divError').html('<p class="text-center text-danger bg-danger" id="pUPInc">Passwords did not match!</p>'); 
      } 
      else if (returnValue['data'] == 3){ 
       $('#divError').html('<p class="text-center text-danger bg-danger" id="pUPInc">An error occured when adding your details to the Database!</p>'); 
      } 
      else if (returnValue['data'] == 4){ 
       $('#divError').html('<p class="text-center text-danger bg-danger" id="pUPInc">I don\'t like Robots!</p>'); 
      } 
     }); 
} 

を私のPHPファイルで、それはマニュアルに従って、オプションだと私はURLのポストからユーザーのIPアドレスを削除：それはそうのように、PHPファイルに渡されるように、私は、あまりにも私のAJAX呼び出しにこの変数を追加しました（しかしそれを行う利点のために確信していない）。成功した場合、Googleはその後、私のコードでは真であるので、アカウントを生成する上に進むとアイテム「成功」、その後の要求についての情報を返し、：

$Url = "https://www.google.com/recaptcha/api/siteverify"; 
$SecretKey = "---KEY---"; 
$Response = file_get_contents($Url."?secret=".$SecretKey."&response=".$_POST['Response']); 
$Robot = json_decode($Response); 

$data = 0; 

if(isset($Robot->success) AND $Robot->success==true){ 

私が最後にPOSTを使用しますが、使用しませんでした代わりにGETしてください。私は秘密鍵を隠すことになるので、いくつかのセキュリティ上の利点があると確信していますので、私はまもなくそれを調べます。

@WEBjujuと私の仲間 "Bridge Troll"の助けを借りて感謝します。私はどちらかがなければそれをすることができなかった。

Answer 2

が、それはあなたの変数のケースを見ることが重要である：それはそれを修正しない場合

$Response = file_get_contents($Url."?secret=".$SecretKey."&response=".$_POST['response']."remoteip=".$_SERVER['REMOTE_ADDR']); 
// because variables are case sensitive... 
$Robot = json_decode($Response); // it is $Response, not $response 

を、あなたの質問をこのpの出力に更新してくださいroduces：

$Response = file_get_contents($Url."?secret=".$SecretKey."&response=".$_POST['response']."remoteip=".$_SERVER['REMOTE_ADDR']); 
die('Response file: <pre>'.$Response); 
$Robot = json_decode($Response); 

も（URLENCODEしてくださいしてみてください）Googleに送信しているのvars：

$Response = file_get_contents($Url."?secret=".urlencode($SecretKey)."&response=".urlencode($_POST['response'])."remoteip=".urlencode($_SERVER['REMOTE_ADDR'])); 

が、はるかに、あなたはここで

$Robot = json_decode($Response); // and NOT $response 

はスクリーンショット見せている必要がありますどのようにajax呼び出しからの出力を得るにはあなたのPHP処理でdie（）があると言った：

BEST SOLUTION

Review this guide on how to install Google reCAPTCHA with PHP