Question

我有一个函数foo，它发出Ajax请求。我尝试从回调中返回数据，并成功通过“ xhr.onload”获取了数据，但通过“ xhr.onreadystatechange”获得了空字符串（“”）。

谁能告诉我为什么？

非常感谢您！

function foo(url){

  return new Promise(function(resolve,reject){
   var xhr = new XMLHttpRequest();
   xhr.open("GET",url,true);
//    xhr.onload = function(){
//     if(xhr.status == 200){             
//         resolve(xhr.responseText);
//         }else{
//          reject("false")
//         }
//    }
   xhr.send();
   xhr.onreadystatechange = function(){
      if(xhr.readyState && xhr.status == 200){             
          resolve(xhr.responseText);
      }else{
          reject("false")
      }

   }
 })

}

foo(url).then(function (data){
   console.log(data)
},function (err){
   console.log(err)
})

Answer 1

您的onreadystatechange处理程序不正确。您需要检查readyState的值4（而不仅仅是任何真实值），并且您不希望在readyState为4之前拒绝：

  if(xhr.readyState === 4){
      if (xhr.status == 200) { // or xhr.status >= 200 && xhr.status < 300
          resolve(xhr.responseText);
      } else {
          reject("false")
      }
  }

但是在现代浏览器中，您可能会改用fetch，它已经提供了承诺。只要确保不要发表these common mistakes（这是我贫乏的小博客上的帖子）即可。

关于您为什么看到自己看到的内容的原因，因为您在附加处理程序之前先调用了open和send，但显然没有得到readyState 1（打开）的回调，因此看起来您收到的第一个回调是在收到标头（readyState 2）时，此时将设置xhr.status-因此您正在解决诺言，但当然是请求尚未收到尸体。

为什么Promise返回一个空字符串？

1 个答案: