如何通过 ajax 将 JSON 数据传递给 RESTful Web 服务以及如何获取 JSON 数据？答案

【问题标题】：how to pass JSON data to restful web services through ajax and also how to get JSON data?如何通过 ajax 将 JSON 数据传递给 RESTful Web 服务以及如何获取 JSON 数据？
【发布时间】：2013-10-24 04:49:57
【问题描述】：

您好，我是 JSON 新手。我的问题是如何通过 ajax 将 JSON 数据传递给 RESTful Web 服务？

请帮帮我。

我尝试了以下代码，但我不确定

我的索引页面

<script type="text/javascript">

 $(document).ready(function(){  

     var uname = document.getElementById("uname").value();
     var password = document.getElementById("pwd").value();


     $('#ok').click(function(){  
         $.ajax({  
             url:'http://localhost:8090/LoginAuthRWS/rest/orders',  
             type:'post',  
             dataType: 'Jsondemo',


             success: function(data) {  
                 $('#name').val(data.name);  
                 $('#email').val(data.email);  

                 var JSONObject= {
                         "uname":uname,
                         "password":password
                         };
             }  
         });  
     });  
}); 

</script>

【问题讨论】：

标签： jquery ajax json rest

【解决方案1】：

var JSONObject= {"uname":uname, "password":password };
var jsonData = JSON.parse( JSONObject );    

var request = $.ajax({
  url: "rest/orders",
  type: "POST",
  data: jsonData,
  dataType: "json"
});

【讨论】：

谢谢你帮助 Arvind
使用 JSON.stringify 返回一个表示 javascript 对象的 json 字符串。 JSON.parse 将字符串转换为 javascript 对象
你错过了 contentType: 'application/json'
另外，JSON.parse 是不必要的，因为您的 jsonObject 目前是一个对象而不是字符串（JSON.parse 接受 json 样式字符串并返回 json 样式对象）。

【解决方案2】：

您的代码有问题：

.value 是属性而不是函数
你想通过json使用data of $.ajax
没有Jsondemo这样的数据类型，你必须使用JSON
如果响应 data 不是 JSON，您可以使用 $.parseJSON 将其转换为 JSON

完整代码

$(document).ready(function(){  
    $('#ok').click(function(){  
        var uname = document.getElementById("uname").value;
        var password = document.getElementById("pwd").value;
        var JSONObject= {
             "uname":uname,
             "password":password
             };

        $.ajax({  
            url:'http://localhost:8090/LoginAuthRWS/rest/orders',  
            type:'post',
            data :  JSONObject,      
            dataType: 'JSON',
            success: function(data) { 
                     var jsonData = $.parseJSON(data); //if data is not json
                     $('#name').val(jsonData.name);  
                     $('#email').val(jsonData.email);  
                }  
        });  
    });  
});

【讨论】：

你错过了 contentType: 'application/json'

【解决方案3】：

你想做这样的事情：

$('#ok').click(function(){  
         $.ajax({  
             url:'http://localhost:8090/LoginAuthRWS/rest/orders',  
             type:'post',  
             dataType: 'json',
             data: { name: "John", location: "Boston" }

             success: function(data) {  
                 response = $.parseJSON(data);
                 $('#name').val(response.name);  
                 $('#email').val(response.email);      
             }  
         });  
});

需要注意的几点：

dataType 应该几乎总是xml 或json。如果您不提供任何内容，有时 JQuery 可以正确猜测。但它必须是真实的。
由于您正在发布帖子，因此您需要将数据发送到 REST 端点。这就是我在data 中所拥有的。请注意，数据类型与dataType 中的值匹配。另请注意，您可以使用 $.post 方法使用 JQuery 进行更简单的发布。
成功回调的data 参数需要首先解析为JSON（假设这是返回的内容），因为它是PlainObject 类型，如here 所述。这就是$.parseJSON 所做的。完成此操作后，您可以根据需要导航 JSON 树以执行您需要执行的操作。不过，您可能无需这样做就可以逃脱。

希望对您有所帮助。

【讨论】：

【解决方案4】：

将值传递给 Web 服务 Ajax 具有 data 属性。

<script type="text/javascript">

$(document).ready(function(){  

 var uname = document.getElementById("uname").value;
 var password = document.getElementById("pwd").value;


 $('#ok').click(function(){  
     $.ajax({  
         url:'http://localhost:8090/LoginAuthRWS/rest/orders',  
         type:'post',  
         dataType: 'Json',

         data:{
           uname:uname,
           password:password
         },

         success: function(data) {  
             $('#name').val(data.name);  
             $('#email').val(data.email);
         }  
     });  
  });  
}); 

</script>

【讨论】：

@JagathesewarenKuppuraj, .value 是属性而不是函数

【解决方案5】：

jQuery dataType Reference。

可能的dataType 值：xml、json、script 或 html

试试这个：

var dataToServer = { 
  uname : document.getElementById("uname").value,
  document.getElementById("pwd").value
};

$.ajax({  
  url:'http://localhost:8090/LoginAuthRWS/rest/orders',  
  type:'post',  // or put
  contentType: 'application/json', // type of data
  data: JSON.stringify(dataToServer) // make JSON string
  dataType: 'json', // type of return result
  success: function(data) {  
    $('#name').val(data.name);  
    $('#email').val(data.email);  
  }  
});

【讨论】：

您正在向服务器发送一个 json 样式的字符串。但是，您应该将 json 样式对象发送到服务器（数据：dataToServer）。

【解决方案6】：

您可以像这样将 json 数据作为请求正文传递：

    var JSONObject= {"uname":uname, "password":password };
    $.ajax({
        url : env + 'rest/orders',
        type : 'POST',
        headers: {
            'Content-Type':'application/json'
        },
        data : JSON.stringify(JSONObject),
        dataType   : "json",
    });

【讨论】：