JSON.parse在函数中失败,在控制台中工作

时间:2013-06-17 13:33:39

标签: javascript json

我有一个简单的脚本来执行跨站点请求并从GitHub gist获取数据。来自Github API的数据作为JSON字符串返回。为了允许进一步修改数据,我希望它作为JSON对象。

// Create the XHR object.
function createCORSRequest(method, url) {
  var xhr = new XMLHttpRequest();
  if ("withCredentials" in xhr) {
    // XHR for Chrome/Firefox/Opera/Safari.
    xhr.open(method, url, true);
  } else if (typeof XDomainRequest != "undefined") {
    // XDomainRequest for IE.
    xhr = new XDomainRequest();
    xhr.open(method, url);
  } else {
    // CORS not supported.
    xhr = null;
  }
  return xhr;
}

var tmpJSON = "";
var gistData = "";

var gistID = "5789756";
var gitAPI = "https://api.github.com/gists/"
var gistQuery = gitAPI + gistID;

function incrementGist() {
    gistData = createCORSRequest('GET', gistQuery);
    gistData.send();
    tmpJSON = JSON.parse(gistData.response);
}

在html页面中,我有

<p><input type="button" value="Increment" OnClick="incrementGist()"></p>

如果我真的按下按钮,我得到的错误是:

Uncaught SyntaxError: Unexpected end of input 

但如果我随后打开控制台并运行它:

var crap = JSON.parse(gistData.response);

它运作得很好。这在Firefox和Chrome中都会发生。我真的不明白为什么JSON.parse命令在函数调用中失败,而不是在控制台中失败。实际页面设置为here

2 个答案:

答案 0 :(得分:3)

问题是您在服务器应答之前尝试读取响应。

您必须在回调中阅读回复。例如:

gistData = createCORSRequest('GET', gistQuery);
gistData.onreadystatechange = function() {
if (gistData.readyState === 4) {
    if (gistData.status === 200) {
                 tmpJSON = JSON.parse(gistData.response);
                 ... use tmpJSON...
                 ... which should not be called so as it is not JSON...
                 ... maybe tmpObject ?
            }
    }
}
gistData.send();

答案 1 :(得分:1)

那是因为你没有等待实际完成的请求。我不知道您的API,但尝试等待服务器响应然后解析您的JSON。您可以首先尝试使用SetTimeout来查看它是否正常工作,但您需要使用“success:function(...)回调

在jQuery中执行某些操作