使用ajax进行JSON解析问题

时间:2015-04-26 20:42:43

标签: javascript ajax json

这是XMLHttpRequest对象。当我把它放在cosole.log上时,会给出以下回复:

console.log(this.responseText);
"[
  {
    "url": "https://api.github.com/gists/c7c0df592e99c0c34b99",
    "forks_url": "https://api.github.com/gists/c7c0df592e99c0c34b99/forks",
    "commits_url": "https://api.github.com/gists/c7c0df592e99c0c34b99/commits",
    "id": "c7c0df592e99c0c34b99",
    "git_pull_url": "https://gist.github.com/c7c0df592e99c0c34b99.git",
    "git_push_url": "https://gist.github.com/c7c0df592e99c0c34b99.git",
    "html_url": "https://gist.github.com/c7c0df592e99c0c34b99",
    "files": {
      "config.json": {
        "filename": "config.json",
        "type": "application/json",
        "language": "JSON",
        "raw_url": "https://gist.githubusercontent.com/anonymous/c7c0df592e99c0c34b99/raw/70489beaa4953f89fc8848195371da6eca76164c/config.json",
        "size": 17911
      }
    },
    "public": true,
    "created_at": "2015-04-26T20:34:11Z",
    "updated_at": "2015-04-26T20:34:11Z",
    "description": "Bootstrap Customizer Config",
    "comments": 0,
    "user": null,
    "comments_url": "h"[…]

但是当我尝试使用JSON.parse时,它会给我一个错误:SyntaxError: JSON.parse: unexpected character at line 1 column 1 of the JSON data

gists = JSON.parse(this.reponseText)

我应该使用这个api https://developer.github.com/v3/gists/,它应该根据该文档返回有效的json

网站返回的上述数据是否无效JSON?或者我应该使用JSON.parse以外的其他功能?或者发生了什么?请帮忙。

完全粘贴在这里:http://pastebin.com/BWttNtXP

2 个答案:

答案 0 :(得分:3)

更新:解决了问题

根本问题是代码中的印刷错误。你能发现它吗?

gists = JSON.parse(this.reponseText); 

修正:

gists = JSON.parse(this.responseText);

一旦做出这种改变,OP的代码就能正常工作。

嗯,任何编码了一段时间的人都知道在像丢失的括号或分号这样简单的事情上浪费大量时间是多么容易。当你终于找到它时...... D'哦!

原帖:

json源似乎没有任何问题,因为下面的代码能够很好地提取和处理数据。点击"运行代码段"查看。



<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="X-UA-Compatible" content="IE=10" />
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>JSON</title>
</head>
<body>
<h1 style="background-color:steelblue; color:white; padding:5px;">JSON DATA TEST</h1>
Raw Data:
<textarea id="output" style="width: 100%; height: 40em;padding:0.5em; border:1px black solid;"></textarea>

<script type="text/javascript">
    // synchronous request for testing only.
	var xhr = new XMLHttpRequest();
	xhr.open('GET', 'https://api.github.com/gists/public', false);
	xhr.send();
	document.getElementById('output').value = xhr.responseText;
	
	try {
		var data = JSON.parse( xhr.responseText );
		alert( 'SUCCESS:\n' + data[0].forks_url );
	}
	catch(e){ alert( 'ERROR:\n' + e.description ); }
</script>
</body>
</html>
&#13;
&#13;
&#13;

答案 1 :(得分:0)

试试这个:)

    console.log(this.responseText);
    var txt = this.responseText.trim("\"");
    gists = JSON.parse(txt);

这样你的pastebin html工作正常