Question

我尝试将async / await与fetch一起使用。我知道我已经关闭了，但我无法让它发挥作用。这是代码：

class Bar {
    async load() {
        let url =  'https://finance.yahoo.com/webservice/v1/symbols/goog/quote?format=json';
        try {
            response = await fetch(url);
            return response.responseText;
        } catch (e) {
            return e.message;
        }
    }
}

我使用如下：

let bar = new Bar();
bar.load().then(function (val) {
    console.log(val);
});

DEMO

出于某种原因，我总是通过消息

进入catch

response is not defined

有什么建议我做错了吗？

更新：正如评论中所建议的，fetch可能存在问题，所以我尝试了简化版（ES5）：

<!doctype html>

<html>
    <head>      
        <script>
            var url =  'https://finance.yahoo.com/webservice/v1/symbols/goog/quote?format=json';
            fetch(url, {method: 'get', mode: 'cors'}).then(function (response) {
                       console.log(response.responseText);
               });
        </script>
    <head>

   <body></body>
<html>

并且仍然无法工作:(但是，如果我替换fetch，它可以工作：

var request = new XMLHttpRequest();
request.open("GET", url, false);
request.send(null);
console.log(request.responseText);

Answer 1

您忘记将response声明为变量。类代码始终是严格的代码，您不会因为分配到implictly global variables而逃脱。相反，它会抛出ReferenceError。

除此之外，Response个对象没有像XHR那样的responseText属性，他们确实有.text()方法等待接收到的身体并返回承诺。

class Bar {
    async load() {
        let url =  'https://finance.yahoo.com/webservice/v1/symbols/goog/quote?format=json';
        try {
            let response = await fetch(url);
//          ^^^^
            return await response.text();
//                                ^^^^^^
        } catch (e) {
            return e.message;
        }
    }
}

async / await不能与fetch结合使用

1 个答案: