JavaScript - 为什么执行代码的奇怪顺序然后被卡住 - XMLHttpRequest - 读取URL /登录

时间:2017-07-14 02:33:16

标签: javascript xmlhttprequest

我的代码如下所示。我添加了几个console.log让我找到问题所在。但是代码的返回很奇怪,而且我没有设法在这里找到答案,所以我问了一个新问题。

var quote_data = new XMLHttpRequest();
var url = "http://SOME.WEBSITE.com/API_QUERIES?&FIELDS=VALUES&output=text"

console.log("HERE0: Begin");

quote_data.open("GET", url, true);

console.log("HERE1: After open");

quote_data.setRequestHeader('Authorization', 'Basic '+btoa('USERNAME'+':'+'PASSWORD'));

console.log("HERE2: After setRequestHeader");

quote_data.send();

console.log("HERE3: After send");

quote_data.onreadystatechange = function (){
  if (quote_data.readyState == 4 && quote_data.status == 200) {
    console.log(quote_data.status);
    console.log('HERE4A: Works Fine');
    var alltext = quote_data.responseText;
    var lines = alltext.split("\n");
    alert(lines);
    }
  else {
     console.log("HERE4B: Error Reason: "+quote_data.status+" "+quote_data.readyState);
   }
}

console.log("HERE5: After statechange");

var split_lines = alltext.split(",");

console.log("HERE6: End");

此代码的返回是: Return from Google Chrome

我的问题是: (1)为什么在执行带有console.log('HERE4A: Works Fine');的部分之后,代码不再转移到console.log("HERE5")? (2)为什么在console.log("HERE5")之后首先执行console.log("HERE3")而不是执行console.log("HERE4")

感谢大家的关注和帮助!!!

1 个答案:

答案 0 :(得分:0)

Ajax调用是异步的,因此在此ajax调用之后将立即显示HERE5。您应该将其余代码移动到以下函数中:

quote_data.onreadystatechange = function (){
  if (quote_data.readyState == 4 && quote_data.status == 200) {
    console.log(quote_data.status);
    console.log('HERE4A: Works Fine');
    var alltext = quote_data.responseText;
    var lines = alltext.split("\n");
    alert(lines);
    console.log("HERE5: After statechange");

    var split_lines = alltext.split(",");

    console.log("HERE6: End");
    }
  else {
     console.log("HERE4B: Error Reason: "+quote_data.status+" "+quote_data.readyState);
   }
}