javascript - Ajax 提交表单时收到 400 Bad Request

标签 javascript html ajax

我正在尝试将表单数据发布到我的服务器。我已经编写了以下 ajax 调用,但我不断收到 400 Bad 错误。有什么帮助吗?

$(document).ready(function(){
    // click on button submit
    $("#submit").on('click', function(){
        // send ajax
        $.ajax({
            url: "/compare",
            type : "POST",
            contentType : 'application/json; charset=utf-8',
            data : $('#form').serialize(),
            success : function(result) {
                console.log(result);
            },
            error: function(xhr, resp, text) {
                console.log(xhr, resp, text);
            }
        })
    });
});

以下是我的 HTML 表单:

<form id="form">
    <p>Input the URL of 2 images!</p>
    <input id="img1" name="img1" type="text" placeholder="Image 1 URL">
    <input id="img2" name="img2" type="text" placeholder="Image 2 URL">
<input id="submit" type="submit" value="Compare!">
</form>

最佳答案

由于您尝试将 JSON 发送到服务器,因此您可以使用数据创建一个对象,然后在将其发送到服务器之前对其进行字符串化。

$(document).ready(function(){
    // click on button submit
    $("#submit").on('click', function(){
        // send ajax
        var img1 = $("#img1").val();
        var img2 = $("#img2").val();
        var myData = {img1: img1, img2: img2};
        $.ajax({
            url: "/compare",
            type : "POST",
            contentType : 'application/json; charset=utf-8',
            data : JSON.stringify(myData),
            success : function(result) {
                console.log(result);
            },
            error: function(xhr, resp, text) {
                console.log(xhr, resp, text);
            }
        })
    });
});

关于javascript - Ajax 提交表单时收到 400 Bad Request,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/46776107/

相关文章:

javascript - 调整窗口大小后触发函数

javascript - 计算文本的高度,对内容进行分页

javascript - 使用内部脚本的 SVG 单选按钮逻辑

javascript - react-redux-i18n 切换语言

javascript - Mozilla团队由于内容安全政策而禁用了我的插件-如何正确设置 list ?

ajax - MarkLogic HTTP 服务器 : Set up CORS headers

php - jQuery AJAX 发布到 php 问题

javascript - 如何在仪表外打印谷歌仪表的底部标签?

javascript - angularjs - 表单 ng-submit 不适用于动态生成的表单 html

javascript - XMLHttpRequest - 发送文件?