Javascript：使用Ajax发送JSON对象？

151

这可能吗？

xmlHttp.send({
    "test" : "1",
    "test2" : "2",
});

可能带有：标头带有content type：application/json？：

xmlHttp.setRequestHeader('Content-Type', 'application/json')

否则我可以使用：

xmlHttp.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded')

然后JSON.stringify将JSON对象发送到参数中，但如果可能的话，以这种方式发送它会很酷。

— 亚当
source

330

使用jQuery：

$.post("test.php", { json_string:JSON.stringify({name:"John", time:"2pm"}) });

没有jQuery：

var xmlhttp = new XMLHttpRequest();   // new HttpRequest instance 
xmlhttp.open("POST", "/json-handler");
xmlhttp.setRequestHeader("Content-Type", "application/json");
xmlhttp.send(JSON.stringify({name:"John Rambo", time:"2pm"}));

— 内森·罗曼诺（Nathan Romano）
source

2

但是，我可以使用content-type：application/x-www-form-urlencoded如果我也使用stringify，那么使用的意义application/json何在？:)

— 亚当

4

@CIRK：有什么关系？内容类型设置是完全任意的，除非服务器特别对待其中一个。只是一天结束时来回流动的数据。

— mellamokb 2011年

17

如果您的帖子正文应为JSON，则很好，例如（{name：“ John”，time：“ 2pm”}）使用内容类型application / json如果您的帖子正文是表单编码数据（name = John＆time = 2pm），则使用application / x-www-form-urlencoded

— Nathan Romano

1

我应该在哪里放置URL？

— 亚伦刘

6

@ShuruiLiu一个URL中所追求的"/json-handler"作为的第二个PARAM open()方法

— 亚历山大无

36

如果您不使用jQuery，请确保：

var json_upload = "json_name=" + JSON.stringify({name:"John Rambo", time:"2pm"});
var xmlhttp = new XMLHttpRequest();   // new HttpRequest instance 
xmlhttp.open("POST", "/file.php");
xmlhttp.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
xmlhttp.send(json_upload);

对于php接收端：

 $_POST['json_name']

— 尚塔努钱德拉
source

不能直接使用？

— rohitsakala '16

8

我认为这不能回答所提出的问题。我相信开发人员希望将JSON内容作为Content-Type：application / json发送给PHP，而不是包装在urlencoded包装器中。

— Fordi

1

这实际上不是发送JSON，而是发送formdata。您也可以直接发送JSON，在这种情况下，您不能使用$ _POST来读取它，而可以使用json_decode（file_get_contents（'php：// input'））来读取它；

— 大卫，

亲爱的朋友，您可以与该页面上使用的全部所需代码共享此POST Ajax吗？还是谢谢你，以及如果你有一个怎样的联系与JSON香草AJAX POST的一些充分的工作例子

— 罗伯特

1

我奋斗了几天，以寻找对我有用的任何东西，就像传递多个ID并返回一个Blob一样。事实证明，如果使用的是.NET CORE（我使用的是2.1），则需要使用[FromBody]，并且只能在需要创建视图模型以保存数据时使用。

总结如下内容，

var params = {
            "IDs": IDs,
            "ID2s": IDs2,
            "id": 1
        };

在我的情况下，我已经对数组进行了json处理并将结果传递给了函数

var IDs = JsonConvert.SerializeObject(Model.Select(s => s.ID).ToArray());

然后调用XMLHttpRequest POST并对对象进行字符串化

var ajax = new XMLHttpRequest();
ajax.open("POST", '@Url.Action("MyAction", "MyController")', true);
ajax.responseType = "blob";
ajax.setRequestHeader("Content-Type", "application/json;charset=UTF-8");           
ajax.onreadystatechange = function () {
    if (this.readyState == 4) {
       var blob = new Blob([this.response], { type: "application/octet-stream" });
       saveAs(blob, "filename.zip");
    }
};

ajax.send(JSON.stringify(params));

然后有一个这样的模型

public class MyModel
{
    public int[] IDs { get; set; }
    public int[] ID2s { get; set; }
    public int id { get; set; }
}

然后像

public async Task<IActionResult> MyAction([FromBody] MyModel model)

如果您要返回文件，请使用此附加组件

<script src="https://cdnjs.cloudflare.com/ajax/libs/FileSaver.js/1.3.3/FileSaver.min.js"></script>

— 戴夫
source

0

在Json.stringfy解决问题的json周围添加

— 用户名
source