使用带有var append的$ .ajax数据发送recaptcha响应

时间:2016-01-09 20:10:41

标签: javascript php jquery ajax

我有一张带有$ .ajax的表单帖子进行验证。它使用一个变量用于"数据:"在POST上,将信息附加到变量中的-in值,然后在服务器端php上检索它们。工作得很好,但我试图将我的reCaptcha响应添加到数据流,以使其到PHP端。我尝试了很多场景,但到目前为止还没有运气。如果有人有想法 - 这会很棒!这是一个java片段:

$(document).ready(function() {
            $("#submit_btn").click(function() { 

                //var reCaptcha = grecaptcha.getResponse();
                //alert(reCaptcha); // --> captcha response:

                var proceed = true;
                //simple validation at client's end
                //loop through each field and we simply change border color to red for invalid fields       
                $("#contact_form input[required=true], #contact_form textarea[required=true]").each(function(){
                    $(this).css('border-color',''); 
                    if(!$.trim($(this).val())){ //if this field is empty 
                        $(this).css('border-color','red'); //change border color to red   
                        proceed = false; //set do not proceed flag
                    }
                    //check invalid email
                    var email_reg = /^([\w-\.]+@([\w-]+\.)+[\w-]{2,4})?$/; 
                    if($(this).attr("type")=="email" && !email_reg.test($.trim($(this).val()))){
                        $(this).css('border-color','red'); //change border color to red   
                        proceed = false; //set do not proceed flag              
                    }   
                });

                if(proceed) //everything looks good! proceed...
                {
                   //data to be sent to server 
                   var reCaptcha = grecaptcha.getResponse();         
                    var m_data = new FormData();    
                    m_data.append( 'user_name', $('input[name=name]').val());
                    m_data.append( 'user_email', $('input[name=email]').val());
                    m_data.append( 'country_code', $('input[name=phone1]').val());
                    m_data.append( 'phone_number', $('input[name=phone2]').val());
                    m_data.append( 'subject', $('select[name=subject]').val());
                    m_data.append( 'msg', $('textarea[name=message]').val());
                    m_data.append( 'file_attach', $('input[name=file_attach]')[0].files[0]);
                    m_data.append( 'recaptcha', $(reCaptcha).val());


                    //instead of $.post() we are using $.ajax()
                    //that's because $.ajax() has more options and flexibly.
                    $.ajax({
                      url: 'contact_me.php',
                      data: m_data,
                      processData: false,
                      contentType: false,
                      type: 'POST',
                      dataType:'json',
                      success: function(response){
                         //load json data from server and output message     
                        if(response.type == 'error'){ //load json data from server and output message     
                            output = '<div class="error">'+response.text+'</div>';
                        }else{
                            output = '<div class="success">'+response.text+'</div>';
                        }
                        $("#contact_form #contact_results").hide().html(output).slideDown();
                      }
                    });


                }
            });

这是PHP:

//check if its an ajax request, exit if not
if(!isset($_SERVER['HTTP_X_REQUESTED_WITH']) AND strtolower($_SERVER['HTTP_X_REQUESTED_WITH']) != 'xmlhttprequest') {
    $output = json_encode(array( //create JSON data
        'type'=>'error',
        'text' => 'Sorry Request must be Ajax POST'
    ));
    die($output); //exit script outputting json data
}


//Sanitize input data using PHP filter_var().
$user_name      = filter_var($_POST["user_name"], FILTER_SANITIZE_STRING);
$user_email     = filter_var($_POST["user_email"], FILTER_SANITIZE_EMAIL);
$country_code   = filter_var($_POST["country_code"], FILTER_SANITIZE_NUMBER_INT);
$phone_number   = filter_var($_POST["phone_number"], FILTER_SANITIZE_NUMBER_INT);
$subject        = filter_var($_POST["subject"], FILTER_SANITIZE_STRING);
$message        = filter_var($_POST["msg"], FILTER_SANITIZE_STRING);
$captcha        = filter_var($_POST["recaptcha"], FILTER_SANITIZE_STRING);




if(strlen($user_name)<4){ // If length is less than 4 it will output JSON error.
    $output = json_encode(array('type'=>'error', 'text' => $captcha));
    die($output);
}

我需要以某种方式做到这一点是让响应进入PHP以添加到我的密钥和休息以继续验证reCaptcha。我发生的是我试图将reCaptcha响应捆绑到

m_data.append( 'recaptcha', $(reCaptcha).val());

然后选择:

$captcha = filter_var($_POST["recaptcha"], FILTER_SANITIZE_STRING);

然后看看它是否会在我的错误字段中显示名称太短:

if(strlen($user_name)<4){ // If length is less than 4 it will output JSON error.
    $output = json_encode(array('type'=>'error', 'text' => $captcha));
    die($output);
}

请帮忙!

1 个答案:

答案 0 :(得分:0)

我能够做一个非常肮脏的小工作。

我接受了reCaptcha公共响应并将其发布到0px隐藏表单框中,然后使用Ajax帖子将其移动到PHP端。

不是很优雅的方式 - 但它的工作原理!仍在寻找基于代码的更好的解决方案;但直到那个出现;这将是必须的。