【问题标题】:Getting 400 bad request error in Jquery Ajax POST在 Jquery Ajax POST 中获取 400 错误请求错误
【发布时间】:2013-04-07 16:18:41
【问题描述】:

我正在尝试使用 Jquery 发送 Ajax POST 请求,但出现 400 bad request 错误。

这是我的代码:

$.ajax({
  type: 'POST',
  url: "http://localhost:8080/project/server/rest/subjects",
  data: {
    "subject:title":"Test Name",
    "subject:description":"Creating test subject to check POST method API",
    "sub:tags": ["facebook:work", "facebook:likes"],
    "sampleSize" : 10,
    "values": ["science", "machine-learning"]
  },
  error: function(e) {
    console.log(e);
  }
});

它说:无法从请求中构建资源。 我错过了什么?

【问题讨论】:

  • 初步检查:你的浏览器指向localhost:8080,对吧?
  • 可能不是导致您的问题的原因,但看起来 ["facebook:work, facebook:likes"] 应该是 ["facebook:work", "facebook:likes"]
  • 你可能在使用 Java 和 Jersey 吗?
  • 我在后端使用的是 JAVA 而不是 Jersey..Sling servlet。

标签: jquery ajax post http-status-code-400


【解决方案1】:

最后,我弄错了,原因是我需要对发送的 JSON 数据进行字符串化。我必须在 XHR 对象中设置内容类型和数据类型。 所以正确的版本在这里:

$.ajax({
  type: 'POST',
  url: "http://localhost:8080/project/server/rest/subjects",
  data: JSON.stringify({
    "subject:title":"Test Name",
    "subject:description":"Creating test subject to check POST method API",
    "sub:tags": ["facebook:work", "facebook:likes"],
    "sampleSize" : 10,
    "values": ["science", "machine-learning"]
  }),
  error: function(e) {
    console.log(e);
  },
  dataType: "json",
  contentType: "application/json"
});

也许它会帮助别人。

【讨论】:

  • 如果我一开始就发现这个问题,我可以为自己节省一个小时的沮丧调试。谢谢;)
  • 正如托马斯·爱迪生曾经说过的那样,“你没有失败,你已经学会了 N 种行不通的方法”所以很高兴你没有早点找到它并试图自己解决问题。
  • 这对我有帮助。为什么需要这一步?
  • 我有exactly the same problem,这是唯一提到JSON.stringify() 的地方。为什么需要它?
  • 4 年后,您的回答只是帮助了一个将头发扯掉 2 小时的人。非常感谢。
【解决方案2】:

是的。您需要stringify JSON 数据或发生400 bad request 错误,因为它无法识别数据。

400 Bad Request

错误请求。您的浏览器发送了此服务器无法发送的请求 明白。

另外,您还需要添加 content typedatatype。如果不是,您将遇到415 错误,上面写着Unsupported Media Type

415 不支持的媒体类型

试试这个。

var newData =   {
                  "subject:title":"Test Name",
                  "subject:description":"Creating test subject to check POST method API",
                  "sub:tags": ["facebook:work", "facebook:likes"],
                  "sampleSize" : 10,
                  "values": ["science", "machine-learning"]
                  };

var dataJson = JSON.stringify(newData);

$.ajax({
  type: 'POST',
  url: "http://localhost:8080/project/server/rest/subjects",
  data: dataJson,
  error: function(e) {
    console.log(e);
  },
  dataType: "json",
  contentType: "application/json"
});

通过这种方式,您可以轻松修改所需的数据。它不会让您感到困惑,因为它是在 ajax 块之外定义的。

【讨论】:

  • var dataJson = JSON.stringify(newData);这对我有用谢谢@Dhulith De Costa
【解决方案3】:

以防其他人遇到这种情况。我的网站在桌面浏览器上运行良好,但在 Android 设备上出现 400 错误。

原来是防伪令牌。

$.ajax({
        url: "/Cart/AddProduct/",
        data: {
            __RequestVerificationToken: $("[name='__RequestVerificationToken']").val(),
            productId: $(this).data("productcode")
        },

问题在于 .Net 控制器设置不正确。

我需要将属性添加到控制器:

    [AllowAnonymous]
    [IgnoreAntiforgeryToken]
    [DisableCors]
    [HttpPost]
    public async Task<JsonResult> AddProduct(int productId)
    {

代码需要审查,但现在至少我知道是什么原因造成的。 400 错误根本没有帮助。

【讨论】:

    【解决方案4】:

    这个问题有点老了......但万一有人遇到错误400,它也可能来自需要将csrfToken作为参数发布到发布请求。

    您必须在模板中从工艺中获取名称和值:

    <script type="text/javascript">
        window.csrfTokenName = "{{ craft.config.csrfTokenName|e('js') }}";
        window.csrfTokenValue = "{{ craft.request.csrfToken|e('js') }}";
    </script>
    

    并在您的请求中传递它们

    data: window.csrfTokenName+"="+window.csrfTokenValue
    

    【讨论】:

    • 这里没有人提到Craft CMS?
    【解决方案5】:

    您需要使用以下函数从“数据”对象构建查询

    function buildQuery(obj) {
            var Result= '';
            if(typeof(obj)== 'object') {
                jQuery.each(obj, function(key, value) {
                    Result+= (Result) ? '&' : '';
                    if(typeof(value)== 'object' && value.length) {
                        for(var i=0; i<value.length; i++) {
                            Result+= [key+'[]', encodeURIComponent(value[i])].join('=');
                        }
                    } else {
                        Result+= [key, encodeURIComponent(value)].join('=');
                    }
                });
            }
            return Result;
        }
    

    然后继续

    var data= {
    "subject:title":"Test Name",
    "subject:description":"Creating test subject to check POST method API",
    "sub:tags": ["facebook:work, facebook:likes"],
    "sampleSize" : 10,
    "values": ["science", "machine-learning"]
    }
    
    $.ajax({
      type: 'POST',
      url: "http://localhost:8080/project/server/rest/subjects",
      data: buildQuery(data),
      error: function(e) {
        console.log(e);
      }
    });
    

    【讨论】:

    • 您没有“必须”这样做,jQuery 会尝试为您完成。不过,如果你自己构建它,你可以保证它是你想要的格式。
    • 我认为我不需要使用这种方式构建对象。 Jquery 为我完成了这项繁重的工作。此外,每当通过 POST 方法发送数据时,它总是被编码,因此我们不需要在要发送的数据上使用 encodeURIComponent。
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2014-08-02
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多