Jquery / Ajax表单POST将空提交给我的API [重复]

Question

这个问题在这里已有答案：

• jQuery posting JSON 3回答
• Submit a form using jQuery 22回答

我在使用Jquery和Ajax向我的API提交表单时遇到了一些问题，该表由Flask-RestPlus和Python提供支持。当我从CURL运行我的API或使用swagger它按预期工作时，但是当我尝试使用Jquery / Ajax将表单提交到同一端点时，我没有从表单提交中获取任何数据。

这是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>

当我检查浏览器中的代码时，看起来它正在发送表单数据，但是当我从我的python函数在我的控制台中打印它时，我可以告诉我得到一个None类型。

任何帮助将非常感激。我知道我可以使用Jquery.val（）来获取每个表单元素的值，但它似乎不是解决此问题的正确方法。

Answer 1

对于有这个问题的任何人..这似乎是Flask-RestPlus / Flask在ajax POST中采用的方式。不确定到底发生了什么，但我确实通过使用这个Jquery lib找到了解决方法; 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>