jQuery Ajax Post 更改对象结构

Posted 2023-03-27

【中文标题】jQuery Ajax Post 更改对象结构

【英文标题】：jQuery Ajax Post changes object structure

【发布时间】：2018-01-08 17:22:39

【问题描述】：

今天，我第一次使用 Ajax，遇到了一个奇怪的问题。在使用 jQuery 发出 Ajax 'POST' 请求时，它会创建一些奇怪的语法。我在其他问题中没有找到答案，实际上，我也不知道我应该寻找什么。

对于 Postman，我使用它作为我的“POST”请求的主体：

    "name": "[e-mail]",
    "automaticDelete": false,
    "cc": 
        "ccFolder": false,
        "smartDelete": false,
        "deletionDays": 182
    ,
    "filters": [
    
        "id": 0,
        "active": false
    
    ]  

当我使用GET 获取对象（没有 Ajax）时，它会返回这个。但是，当我将 POST 与 Ajax 一起使用并通过与其他对象相同的 GET 方法获取它时，我会收到以下信息：

    "name": "[e-mail]",
    "automaticDelete": "false",
    "cc[ccFolder]": "false",
    "cc[smartDelete]": "false",
    "cc[deletionDays]": "182",
    "id": 4

我的 jQuery 代码如下所示：

var emailAccount = 
        "name": emailAddress.val(),
        "automaticDelete": false,
        "cc": 
            "ccFolder": false,
            "smartDelete": false,
            "deletionDays": 182
        ,
        "filters": []
    ;

    $.ajax(
        type: 'POST',
        url: basicUrl + 'emails',
        data: emailAccount,
        success: function() 
        ...
        ,
        error: function() 
        ...
        
    );

到目前为止我已经尝试过：

使用dataType: "json" 使用contentType: 'application/json'（导致来自 json-server 的 500 错误）

所以我的问题是：这是什么？

"cc[ccFolder]": "false",
"cc[smartDelete]": "false",
"cc[deletionDays]": "182"

为什么 Ajax 会这样创建它？

我这样访问代码：

function getData(path, followUp, id) 
    var dataRequest = new XMLHttpRequest();
    dataRequest.open('GET', basicUrl + path);

    dataRequest.onload = function() 
        var receivedData = JSON.parse(dataRequest.responseText)
        gotEmails(receivedData)
    ;

    dataRequest.send();


function gotEmails(data) 
    for (i = 0; i < data.length; i++) 
        var userEmailAccount = 
            id: data[i].id,
            name: data[i].name,
            automaticDelete: data[i].automaticDelete,
            cc: data[i].cc,
            filters: []
        ;

        if (data[i].filters != 'undefined') 
            var filterQuery = queryBuilder("filters?", data[i].filters);
            getData(filterQuery, 9, data[i].id);
        
    

【问题讨论】：

您能分享一下您是如何访问响应的吗？在上面的代码中没有看到。

我已经编辑了这个问题。我认为这是相关的代码。使用我直接在 JSON 中和通过 Postman 创建的所有数据，它运行良好。

看起来它完全按照文档所说的那样做。 jQuery 不会为您将对象转换为 json。使用 $.param 方法将对象转换为参数字符串。

但是这是什么？它看起来像一本字典。我不经常使用 JSON，但我希望它采用“普通”对象语法。

看... js 对象不是字符串格式。 XHR 只能发送字符串格式的东西，因此 js 对象不能作为对象发送。您必须将它们转换为字符串。一些库会尝试为您执行此操作，例如，angular.js 会将对象转换为 json 字符串，而 jquery 会将对象转换为参数字符串。您当然可以通过自己将其字符串化来覆盖默认情况下发生的情况。

【参考方案1】：

我找到了一个可行的解决方案：

var xmlhttp = new XMLHttpRequest();   // new HttpRequest instance 
xmlhttp.open("POST", basicUrl + 'emails');
xmlhttp.setRequestHeader("Content-Type", "application/json");
xmlhttp.send(JSON.stringify(emailAccount));

而不是使用ajax。