Jquery/AjaxフォームPOSTがAPIに空を返します

Question

Jquery & Ajaxを使用していくつかの問題が発生しました.Flask-RestPlus & Pythonを使用してフォームをAPIに送信します。私がCURLからAPIを実行したり、予想通りに動作したりすると、Jquery/Ajaxを使用して同じエンドポイントにフォームを送信しようとすると、フォーム提出のデータが得られません。ここで

は、私は、ブラウザ内のコードを検査するとき、それはフォームデータを送信しているように見えますが、私は私のpython関数から私のコンソールでそれを印刷するとき、私はできるHTML/jQueryの

<form name="login" id="login"> 
<input type="text" name="email" id="email"> 
<input type="password" name="password" id="password"> 
<button type="submit">Submit</button> 
</form> 

</body> 
<script> 
$("#login").submit(function(e) { 

    var url = "/auth/login_user"; // 

    $.ajax({ 
      type: "POST", 
      url: url, 
      data: $("#login").serializeArray(), // I've tried serializeArray() & serialize() 
      success: function(data) 
      { 
       alert(data); 
      } 
     }); 

    e.preventDefault(); 
}); 
</script> 

です私はNone型を得ていると伝えます。

ご協力いただければ幸いです。私は、各フォーム要素の値を取得するためにJquery.val（）を使用することができますが、この問題を解決する正しい方法のようには見えません。

Answer 1

この問題を抱えている人は、Flask-RestPlus/Flaskがajax POSTを実行する方法と思われます。何が起こっていたのかはっきりしていませんが、このJqueryライブラリを使用してこの問題を回避する方法を見つけました。 https://github.com/marioizquierdo/jquery.serializeJSON

などのように私のコード..

<script> 
$("#login").submit(function(e) { 

    var url = "/auth/login_user"; 
    var form_data = $('#login').serializeJSON(); 

    console.log(form_data) 

    $.ajax({ 
      type: "POST", 
      url: url, 
      contentType: 'application/JSON', 
      data: JSON.stringify(form_data), 
      success: function(data) 
      { 
       alert(data); // 
      } 
     }); 

    e.preventDefault(); 
}); 
</script>