Question

我已经实现了一个Java代码段代码如下：

          //some logic above

            JSONObject json = new JSONObject();

            try {

                    json.put("name", "myname");

                    json.put("address","myaddress");


                  List<NameValuePair> nameValuePairs = new ArrayList<NameValuePair>();

                  nameValuePairs = Utils.addEmpName(nameValuePairs);

                  nameValuePairs = Utils.addEmpAddress(nameValuePairs);


                  nameValuePairs.add(new BasicNameValuePair(

                            "myjsondata",

                            jsondata.toString());

                  ....

               httpPost.setEntity(new UrlEncodedFormEntity(nameValuePairs));
           }

它向我的服务器发出POST请求并发送JSON数据。

我的问题是如何在Javascript中执行相同的操作。我知道如何构造JSON数据但是就nameValuePairs而言，有人能告诉我如何通过javascript将它们作为我的JSON主体发送吗？

我的Javascript代码目前在Javascript中看起来像这样

var data= { "name":"myname", "address" : "myaddress" };            
var xhr = new XMLHttpRequest();

xhr.open("POST",my_url,true);
xhr.setRequestHeader("Content-type", "application/json;charset=UTF-8");
xhr.send(JSON.stringify(data));

我需要帮助编写nameValuePairs部分才能构建json body

Answer 1

几乎所有现代JavaScript框架（如jQuery或prototype）都有非常简单的方法来向/从服务器发送/接收json（类似）对象

更新：

jQuery的：

var d = { "aa":"bbbbb", "xxx":"yyyy" };
$.ajax({ 
  url:'http:yourserver.com/your_action',
  data:d
});

原型：

var d = { "aa":"bbbbb", "xxx":"yyyy" };
new Ajax.Request( 'http:yourserver.com/your_action', { parameters:d } );

您可以自定义成功发送时的操作，失败等操作。请参阅http://api.jquery.com/jQuery.ajax/和http://api.prototypejs.org/ajax/Ajax/Request/

Answer 2

您应该使用JQuery而不是手动处理XHR请求。

您可以使用$.ajax()或$.post()功能。

$.post( my_url, { "name":"myname", "address" : "myaddress" });

已编辑：要传递自定义HTTP标头，请使用$ .ajax（）而不是$ .post（）。虽然您引用的标头使用标准头和JQuery应检测并自动将其添加到上述请求中。无论如何，您可以使用以下代码片段来实现相同的使用$ .ajax（）。

$.ajax({
    url: my_url,
    type: 'post',
    data: { "name":"myname", "address" : "myaddress" },
    headers: {
        "Content-type": "application/json;charset=UTF-8"
    },
    dataType: 'json',
    success: function (data) {
        console.info(data);
    }
});

使用Javascript POST Json数据

2 个答案: