Question

我有一个脚本，我想从端点获取一些json数据，但是我收到一个错误，这是我的脚本：

function httpGet(url) {
    return new Promise(
        function (resolve, reject) {
            var request = new XMLHttpRequest();
            request.onreadystatechange = function () {
                if (this.status === 200) {
                    // Success
                    resolve(this.response);
                } else {
                    // Something went wrong (404 etc.)
                    reject(new Error(this.statusText));
                }
            }
            request.onerror = function () {
                reject(new Error(
                    'XMLHttpRequest Error: '+this.statusText));
            };
            request.open('GET', url);
            request.send();
        });
}

var url = 'https://api.jsonPlaceholder.com';

httpGet(url)
  .then(JSON.parse)
  .then((r) => {
    console.log(r);
  }).catch(function(error) {
    console.log(error);
  });

然后，在控制台中它会抛出一个错误：

错误在XMLHttpRequest.request.onreadystatechange（app.js：11）在app.js：18 在Promise（）在httpGet（app.js：2）在app.js：25

Answer 1

您无法检查status，在决定发生了什么之前，您必须先检查readyState == 4：

function httpGet(url) {
    return new Promise(
        function (resolve, reject) {
            var request = new XMLHttpRequest();
            request.onreadystatechange = function () {
                if (this.readyState === 4) {                            // ***
                    if (this.status === 200) { 
                        // Success
                        resolve(this.response);
                    } else {
                        // Something went wrong (404 etc.)
                        reject(new Error(this.statusText));
                    }
                }                                                       // ***
            }
            request.onerror = function () {
                reject(new Error(
                    'XMLHttpRequest Error: '+this.statusText));
            };
            request.open('GET', url);
            request.send();
        });
}

The spec表示在请求完成之前访问this.response应该只返回一个空字符串，但对于我使用Chrome v57，这样做会给出您引用的错误。添加readyState检查会修复它。

E6 Ajax请求无法正常工作

1 个答案: