javascript 如何发送HttpRequest，并返回Json数据并显示
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/16555250/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to send HttpRequest, and it returns Json data and display it
提问by Alex
I got very confused on getting Json data. Please correct me if anything does wrong. Below is my code:
我对获取 Json 数据感到非常困惑。如果有任何错误，请纠正我。下面是我的代码：
var xmlhttp;
if (window.XMLHttpRequest)
{// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp=new XMLHttpRequest();
}
else
{// code for IE6, IE5
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange=function()
{
if (xmlhttp.readyState==4 && xmlhttp.status==200)
{
var data = JSON.parse(xmlhttp.responseText);
document.getElementById("getListings").innerHTML=data;
}
}
xmlhttp.open("GET","https://getJsonData",true);
xmlhttp.setRequestHeader("Content-type","application/x-www-form-urlencoded");
request.setRequestHeader("Accept", "application/json; charset=utf-8");
xmlhttp.setRequestHeader("Accept-Datetime","Fri, 15 Feb 2013 00:00:00 GMT");
xmlhttp.setRequestHeader("Authorization","XXXXXXX");
xmlhttp.send();
I could not get anything displayed on "getListings" div.
我无法在“getListings”div 上显示任何内容。
回答by mclaassen
Assuming you have jQuery:
假设你有 jQuery：
$.ajax({
type: "GET",
url: "https://getJsonData",
dataType: "json",
success: processData,
error: function(){ alert("failed"); }
});
function processData(data)
{
//do something with data
}
Also, not sure what you're expecting just setting the innerHtml to the json object itself, you probably want to get some sort of propery value form the json by using data.someProperty
此外，不确定您期望将innerHtml 设置为json 对象本身，您可能希望通过使用从json 获取某种属性值 data.someProperty
回答by James Black
I see a couple of issues:
我看到几个问题：
xmlhttp.setRequestHeader("Content-type","application/x-www-form-urlencoded");
xmlhttp.setRequestHeader("Content-type","application/x-www-form-urlencoded");
You should use:
你应该使用：
xmlHttp.setRequestHeader('Content-Type', 'application/json')
xmlHttp.setRequestHeader('Content-Type', 'application/json')
But, I would go with httpRequest.setRequestHeader('Accept', 'application/json');as this tells the server you want to accept JSON, yours states you are sending JSON.
但是，我会同意，httpRequest.setRequestHeader('Accept', 'application/json');因为这告诉服务器您要接受 JSON，您的状态是您正在发送 JSON。
Now, when you parse the JSON, you may want to look at this: Parse JSON in JavaScript?as not all browsers can parse JSON.
现在，当您解析 JSON 时，您可能想看看这个：在 JavaScript 中解析 JSON？因为并非所有浏览器都可以解析 JSON。
Now, when you parse, you will want to look at not just putting it into the innerhtml, but format it and then put the formatted html code into the innerhtml if you desire.
现在，当您解析时，您不仅要查看将其放入innerhtml，还要将其格式化，然后将格式化的html 代码放入innerhtml（如果需要）。
A simple way to see if you are parsing it properly is to have an alert just show one property in the json.
查看您是否正确解析它的一种简单方法是让警报仅在 json 中显示一个属性。
