解析来自XMLHttpRequest的响应
我正在努力解析来自XMLHttpRequest的响应。响应是JSON格式:解析来自XMLHttpRequest的响应
http://flickr.com/services/rest/?method=flickr.photos.search&api_key=75564008a468bf8a284dc94bbd176dd8&tags=paris&format=json
,以确保它确实进来这样我测试了它:
document.getElementById('info').innerHTML = this.responseText
返回我一个页面,写JSON格式数据的长线。可能有人帮我找出为了从即所有的标题
的列表响应中提取数据的下一步骤,我做了一些研究和碰到这个传来:
response = this.responseText ;
var doc = new DOMParser().parseFromString(response, "text/xml");
我需要什么,下一步该怎么做? (注:我希望这样做手工即不jQuery的或类似工具的帮助下)
基于以下部分以及Flickr page on that matter的建议[编辑]
,我已经试过如下:
request.onreadystatechange = function()
{
...
if (this.responseXML != null)
{
jsonFlickrApi(this.responseText) ;
function jsonFlickrApi(rsp){
for (var i=0; i<rsp.photos.photo.length; i++){
var blog = rsp.photos.photo[i];
var div = document.createElement('div');
var txt = document.createTextNode(photo.owner);
div.appendChild(txt);
//document.body.appendChild(div);
document.getElementById('info').innerHTML.appendChild(div);
}
...
}
这不会返回任何可见的东西。
[EDIT2]
进一步的故障诊断显示:
rsp = this.responseText ;
document.getElementById('info').innerHTML = rsp.stat ;
打印undefined
约JSON很酷的事情是,它实际上是可执行代码。你不需要做任何“手动”解析 - 只需运行代码即可。也许Flickr提供了一个叫做jsonFlickrApi的函数,它们提供了API库供他们使用,但你也可以提供自己的API库。
function parseFlickrJson(jsonstring){
var data=null;
var jsonFlickrApi=function(d){
data = d;
}
eval(jsonstring);
return data;
}
myreturndata = parseFlickrJson(response);
// Try getting something from the object
alert(myreturndata.photos.pages);
你给的回报somethins这样的网址:
jsonFlickrApi({"photos":{"page":1, "p ... , "stat":"ok"})
所以,基本上,它l ooks像Javascript代码,其中:
- 调用
jsonFlickrApi
功能, - 传递一个大的JSON对象作为参数。
首先,在这里,您正在使用JSON工作,所以你不应该使用任何DOM相关的东西:DOM功能的目标是帮助操作XML。
相反,你应该:
- 写
jsonFlickrApi
功能, - 确保当您从Flickr的接收数据
关于这一点,你shuld找了一下,它被称为更多信息和示例,在这里:http://www.flickr.com/services/api/response.json.html
否则,在请求的URL末尾添加&nojsoncallback=1
参数,您将得到纯粹的JSON结果(而不是函数调用)。
这将允许您使用标准的JSON操作函数来处理该数据,而不必实现任何特定的功能。
这些解决方案之间,由你来选择,你更喜欢哪一个:-)
嗨帕斯卡,非常感谢您的反馈。正如你可以看到我很新,所以我正在探索...理想情况下,我想回到XML,然后使用DOM解析,这似乎有很多优点,例如希望是直截了当的。但是,如果我在末尾删除'&format = json',我的网址不会返回任何内容。我只找回没有可访问节点的对象。你会在这方面提出什么建议?重新SON操作函数,他们内置到PHP?还是我需要使用库? – raoulbia 2011-03-19 16:40:05
如果我删除'&format = json',我会得到XML作为响应 - 请注意,在这种情况下,'responseXML'将是一个解释的XML对象*(而不是XML字符串,在'responseText'中)* ;;;关于PHP中的JSON操作,你有'json_decode()'函数。 – 2011-03-19 17:03:33
Pascal说:“responseXML将是一个解释的XML对象”......这正是我偶然发现的地方,因为我无法访问节点。为什么它不以我想要的方式来? :) – raoulbia 2011-03-19 17:10:06
另一种方法是不使用JSON,而是使用XML代替。将网址的format=json
部分留出,并以XML形式获取数据。例如,您可以使用您尝试的DOMParser()
方法或使用this.responseXML
来解析此XML。然而,与JSON相比,使用XML的“后勤”稍微复杂一些,因为您浏览DOM树而不是JS对象。
更新:
所以这里有AJAX的阴暗细节之一。根据浏览器的不同,您不能仅在域之间进行XML请求。以下代码将在Safari上运行(返回一些有用的内容),但不适用于Firefox或Chrome。 (在那里,它将返回null或空字符串。)但是,没有在所有浏览器上,JSON请求似乎都能正常工作。
<script>
function createXHR(){
if (window.XMLHttpRequest){
// code for IE7+, Firefox, Chrome, Opera, Safari
return new XMLHttpRequest();
}
if (window.ActiveXObject){
// code for IE6, IE5
return new ActiveXObject("Microsoft.XMLHTTP");
}
return null;
}
function getFlickr(){
xmlhttp=createXHR();
url="http://www.flickr.com/services/rest/?method=flickr.photos.search&api_key=75564008a468bf8a284dc94bbd176dd8&tags=paris&";
xmlhttp.onreadystatechange=stateChanged;
xmlhttp.open("GET",url,true);
xmlhttp.send(null);
}
function stateChanged(){
if (xmlhttp.readyState==4){
alert(xmlhttp.getAllResponseHeaders());
alert(xmlhttp.responseXML)
alert(xmlhttp.responseText)
var xmlDoc=xmlhttp.responseXML.documentElement;
}
}
getFlickr();
</script>
HI nitro2k01,当我这样做时,我只返回一个没有可访问节点的对象,即responseXML是一个对象,而responseText给了我一些有形的东西,因此json方法,但是如果我可以,我也会采用xml方法 – raoulbia 2011-03-19 16:51:56
= function(d)...'d'做了什么或它从哪里来? – raoulbia 2011-03-19 18:51:36
非常感谢!你的代码片段就是我的救世主:) – raoulbia 2011-03-19 20:10:45
@all:感谢你的帮助!选择接受答案是一个困难的选择。我选择了在特定情况下具有最大实际价值的那个。再次感谢。 – raoulbia 2011-03-19 20:11:42