エラー400不正なリクエストAjax送信SMTPメール

Question

私はこの問題を数週間は抱えています。私は、同じページに留まっている間に提供されたフォームデータを使用してSMTPメールを送信しようとしています。

私は多くの例をオンラインで追ってきましたが、Frankensteinのように私のために働かせることはできません。問題はフォームからデータを取得することだと私は信じています。

HTML

<div id="form-messages"></div> 
      <form method="post" action="" id="main-contact-form" > 
      <div class="row wow fadeInUp" data-wow-duration="1000ms" data-wow-delay="300ms"> 
       <div class="col-sm-6"> 
       <div class="form-group"> 
        <input type="text" id="name" name="name" class="form-control" placeholder="Name" required="required"> 
       </div> 
       </div> 
       <div class="col-sm-6"> 
       <div class="form-group"> 
        <input type="email" id="email" name="email" class="form-control" placeholder="Email Address" required="required"> 
       </div> 
       </div> 
      </div> 
      <div class="form-group"> 
       <input type="text" id="subject" name="subject" class="form-control" placeholder="Subject" required="required"> 
      </div> 
      <div class="form-group"> 
       <textarea name="message" id="message" class="form-control" rows="4" placeholder="Enter your message" required="required"></textarea> 
      </div>       
      <div class="form-group"> 
       <input type="submit" class="btn-submit"> 
      </div> 
      </form> 

はJQuery/Ajaxの

var form = $('#main-contact-form'); 
form.submit(function(event){ 
    event.preventDefault(); 
    var form_status = $('<div class="form_status"></div>'); 
    $.ajax({ 
     url: "http://localhost:8080/adb2/mailer.php", 
     type: "POST", 
     beforeSend: function(){ 
      form.prepend(form_status.html('<p><i class="fa fa-spinner fa-spin"></i> Email is sending...</p>').fadeIn()); 
     } 
    }).done(function(data){ 
     form_status.html('<p class="text-success">Thank you for contacting us. We will contact you as soon as possible!</p>').delay(3000).fadeOut(); 
    }); 
}); 

PHP（mailer.php）送信後

<?php 
    // Only process POST reqeusts. 
    if ($_SERVER["REQUEST_METHOD"] == "POST") { 
     // Get the form fields and remove whitespace. 
     $name = strip_tags(trim($_POST["name"])); 
     $name = str_replace(array("\r","\n"),array(" "," "),$name); 
     $email = filter_var(trim($_POST["email"]), FILTER_SANITIZE_EMAIL); 
     $subject = trim($_POST['subject']); 
     $message = trim($_POST["message"]); 

     // Check that data was sent to the mailer. 
     if (empty($name) OR empty($subject) OR empty($message) OR !filter_var($email, FILTER_VALIDATE_EMAIL)) { 
      // Set a 400 (bad request) response code and exit. 
      http_response_code(400); 
      echo "Oops! There was a problem with your submission. Please complete the form and try again."; 
      exit; 
     } 

     require("phpmailer/PHPMailerAutoload.php"); 

     $mail = new PHPMailer(); 

     $mail->IsSMTP(); 
     $mail->Host = "xxxxxxxxxxxxxxxx"; 
     $mail->SMTPAuth = true; 

     $mail->Username = "xxxxxxxxxxxxxxx"; // SMTP username 
     $mail->Password = "xxxxxxxxxxxxxxx"; // SMTP password 

     $mail->From = $email; 

     $mail->AddAddress("xxxxxxxxxxx", "Website"); 

     $mail->WordWrap = 50; 
     $mail->IsHTML(true); 
     $mail->Subject = $subject; 

     $mail->Body = $message; 
     $mail->AltBody = $message; 

     // Send the email. 
     if ($mail->Send()) { 
      // Set a 200 (okay) response code. 
      http_response_code(200); 
      echo "Thank You! Your message has been sent."; 
     } else { 
      // Set a 500 (internal server error) response code. 
      http_response_code(500); 
      echo "Oops! Something went wrong and we couldn't send your message."; 
     } 

    } else { 
     // Not a POST request, set a 403 (forbidden) response code. 
     http_response_code(403); 
     echo "There was a problem with your submission, please try again."; 
    } 
?> 

フォームの場合、「POST http://localhost:8080/adb2/mailer.php 400（Bad Request）」を返します。

誰かが正しい方向に私を指すことができたら、私は本当にそれを感謝します！読んでくれてありがとう！

Answer 1

もう少し掘り下げた後にそれを解説します。私は "formData"という名前の変数を追加し、フォームをシリアライズしました。その後、私はそれをAjax呼び出しに渡しました。現在は動作しています。以下は固定JQuery/Ajaxです。

var form = $('#main-contact-form'); 
var formMessages = $('#form-messages'); 
form.submit(function(event){ 
    event.preventDefault(); 
    var formData = $(form).serialize(); 
    var form_status = $('<div class="form_status"></div>'); 
    $.ajax({ 
     url: "http://localhost:8080/adb2/mailer.php", 
     type: "POST", 
     data: formData, 
     beforeSend: function(){ 
      form.prepend(form_status.html('<p><i class="fa fa-spinner fa-spin"></i> Email is sending...</p>').fadeIn()); 

     } 
    }).done(function(response){ 
     form_status.html('<p class="text-success">Thank you for contacting us. We will contact you as soon as possible!</p>').delay(3000).fadeOut(); 
     // Make sure that the formMessages div has the 'success' class. 
     $(formMessages).removeClass('error'); 
     $(formMessages).addClass('success'); 

     // Set the message text. 
     $(formMessages).text(response); 

     // Clear the form. 
     $('#name').val(''); 
     $('#email').val(''); 
     $('#subject').val(''); 
     $('#message').val(''); 
    }).fail(function(response) { 
     // Make sure that the formMessages div has the 'error' class. 
     $(formMessages).removeClass('success'); 
     $(formMessages).addClass('error'); 
    }); 
});